boilerplate
This commit is contained in:
parent
4b9c3c24c5
commit
7f1ce08a1f
3 changed files with 200 additions and 0 deletions
21
bg.svg
Normal file
21
bg.svg
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
<svg width="403.94345" height="210.69344" viewBox="0 0 403.94344 210.69345" version="1.1" id="svg1" inkscape:version="1.4 (e7c3feb100, 2024-10-09)" sodipodi:docname="derv2.svg" inkscape:export-filename="derv.png" inkscape:export-xdpi="475.03" inkscape:export-ydpi="475.03" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<sodipodi:namedview id="namedview1" pagecolor="#ffffff" bordercolor="#000000" borderopacity="0.25" inkscape:showpageshadow="2" inkscape:pageopacity="0.0" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1" inkscape:document-units="px" inkscape:zoom="2" inkscape:cx="195.5" inkscape:cy="125.25" inkscape:window-width="1918" inkscape:window-height="1056" inkscape:window-x="0" inkscape:window-y="22" inkscape:window-maximized="1" inkscape:current-layer="g9" showgrid="false"/>
|
||||
<defs id="defs1"/>
|
||||
<g inkscape:label="Layer 1" inkscape:groupmode="layer" id="layer1" transform="translate(76.97172,-19.653282)">
|
||||
<rect style="fill:#1b0e0e;fill-opacity:1;stroke:none;stroke-width:22.6689;stroke-linecap:square;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers" id="rect2" width="403.94342" height="210.69344" x="-76.971718" y="19.653282"/>
|
||||
<path id="rect5" style="fill:#651c1c;fill-opacity:1;stroke:none;stroke-width:22.6689;stroke-linecap:square;stroke-linejoin:round;stroke-opacity:1;paint-order:stroke fill markers" d="m 326.97172,19.653285 c -144.46602,235.570445 -277.189031,189.388075 -403.94344,0 V 230.34672 h 403.94344 z" sodipodi:nodetypes="ccccc"/>
|
||||
<g id="g9" transform="translate(50.274751,38.085818)">
|
||||
<g id="g5" style="opacity:0.43007599">
|
||||
<path style="fill:none;fill-opacity:1;stroke:#d6caca;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers" d="M 53.886535,130.0342 45.92708,96.657852" id="path5" sodipodi:nodetypes="cc"/>
|
||||
<path style="fill:none;fill-opacity:1;stroke:#d6caca;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers" d="M 94.849217,128.78343 105.6371,94.699975" id="path6"/>
|
||||
<path id="path7" style="fill:#d6caca;stroke-width:7.03332;stroke-linecap:round;stroke-linejoin:round;paint-order:stroke fill markers;fill-opacity:1" d="m 134.3378,52.398358 c 0,17.663505 -7.68232,33.532711 -19.88798,44.448647 -10.54453,9.430345 7.81089,-0.30241 -39.294161,-1.19189 -32.68985,-0.61728 -28.417167,11.102235 -38.783551,2.38154 -12.998855,-10.935238 -21.25941,-27.32209 -21.25941,-45.638297 0,-32.9231 26.689447,-59.6125447 59.612547,-59.6125447 32.923095,0 59.612555,26.6894447 59.612555,59.6125447 z" sodipodi:nodetypes="sssssss"/>
|
||||
<path style="fill:none;fill-opacity:1;stroke:#d6caca;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers" d="M 73.539105,91.923882 V 142.48202" id="path9"/>
|
||||
<path id="path8" style="fill:#d6caca;stroke-width:4.67352;stroke-linecap:round;stroke-linejoin:round;paint-order:stroke fill markers;fill-opacity:1" d="m 103.30303,147.29696 c 0,-13.30762 -5.413882,-23.15379 -5.413882,-23.15379 0,0 -12.433954,9.26293 -24.796571,9.38325 -9.983187,0.0972 -20.961784,-10.27953 -20.961784,-10.27953 0,0 -6.71763,10.2507 -6.71763,24.05007 0,24.80417 0.334132,33.74559 28.694932,33.74559 30.778355,0 29.194935,-8.94142 29.194935,-33.74559 z" sodipodi:nodetypes="scscsss"/>
|
||||
</g>
|
||||
<path id="rect1" d="M 48.087186,15.828224 V 85.02551 H 90.85315 c 0,0 12.95939,-22.283993 12.95939,-34.599281 0,-12.31527 -12.95939,-34.598005 -12.95939,-34.598005 z m 4.373791,8.099606 H 84.53545 c 0,0 9.71954,17.066172 9.71954,26.498399 0,9.432228 -9.71954,26.499659 -9.71954,26.499659 H 52.460977 Z" style="fill:#651c1c;fill-opacity:1;stroke:#651c1c;stroke-width:6.4797;stroke-linecap:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"/>
|
||||
<path style="fill:#1b0e0e;fill-opacity:1;stroke:none;stroke-width:9.54825;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers" id="path1" d="m 50.298318,135.91136 c 0.246374,0.33238 0.481938,0.66962 0.739122,0.99716 0.481363,0.61308 0.999613,1.2089 1.476146,1.82417 0.587165,0.75812 1.153229,1.52587 1.714461,2.29546 1.405737,1.92762 2.886498,4.0023 4.09272,6.00255 0.609572,1.01081 1.129321,2.0521 1.693984,3.07815 1.731977,3.49666 1.051138,2.01399 2.482676,5.28641 0.788091,1.80151 0.956474,2.15108 1.626828,3.87987 0.341096,0.87961 0.657496,1.76477 0.987323,2.64695 0.294334,0.77247 0.547569,1.55456 0.741577,2.34559 0.03292,0.13473 -0.0692,0.34264 0.08973,0.40529 4.768398,1.88014 9.427048,4.00627 14.496244,5.34585 0.592128,0.15637 0.277277,-0.93679 0.415895,-1.40521 0.902862,-3.00558 0.30767,-1.17203 1.560158,-4.6071 0.412397,-1.131 0.770327,-2.27424 1.229165,-3.39469 0.72881,-1.77968 2.477016,-5.41525 3.437778,-7.12221 0.584112,-1.03775 1.271152,-2.03964 1.906719,-3.05945 1.660878,-2.51655 3.326762,-5.07149 5.563462,-7.32572 0.24295,-0.24486 0.51289,-0.47335 0.76935,-0.71 0,0 -13.282883,-5.79579 -13.282883,-5.79579 v 0 c -1.003707,3.14638 -2.226143,6.24863 -3.568803,9.31946 -0.48464,1.0865 -0.924934,2.18527 -1.453917,3.25957 -0.58552,1.18911 -1.237737,2.35847 -1.888095,3.52759 -0.636651,1.14449 -1.25857,2.29524 -1.972557,3.41255 -0.651043,1.01882 -1.392692,2.0023 -2.119227,2.99068 -1.677164,2.28153 -1.438727,1.93215 -3.186408,3.82878 -4.726079,3.45787 -1.385703,0.57255 12.696294,6.6646 0.175376,0.0759 -0.355199,-0.16016 -0.479784,-0.2815 -0.192647,-0.18766 -0.310917,-0.41411 -0.45278,-0.62667 -0.564536,-0.84604 -0.654764,-1.07004 -1.158815,-1.99946 -2.407739,-4.25981 -5.095453,-8.42438 -7.437093,-12.7069 -2.665973,-4.72184 -0.898831,-1.47639 -3.291498,-6.16319 -0.436088,-0.85421 -0.894569,-1.70166 -1.328571,-2.55652 -0.692849,-1.36468 -1.39871,-2.721 -1.676625,-4.17919 z"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.1 KiB |
99
index.css
Normal file
99
index.css
Normal file
|
|
@ -0,0 +1,99 @@
|
|||
:root {
|
||||
--black: rgb(16, 16, 16);
|
||||
--gray: rgb(38, 38, 38);
|
||||
--white: rgb(240, 240, 240);
|
||||
--primary-dark: rgb(59, 156, 40);
|
||||
--primary-light: rgb(202, 255, 200);
|
||||
--elem-width: min(800px, 90vw);
|
||||
--elem-height: 300px;
|
||||
--border-radius: 15px;
|
||||
--font: system-ui, sans-serif;
|
||||
color: var(--white);
|
||||
background: var(--black);
|
||||
font-family: var(--font) !important;
|
||||
}
|
||||
|
||||
.banner,
|
||||
body {
|
||||
display: flex;
|
||||
flex-direction: column
|
||||
}
|
||||
|
||||
body {
|
||||
align-items: center;
|
||||
overflow-x: hidden;
|
||||
margin-top: 0
|
||||
}
|
||||
|
||||
.banner {
|
||||
justify-content: center;
|
||||
margin-bottom: calc(-1*var(--elem-height))
|
||||
}
|
||||
|
||||
.banner-background,
|
||||
.banner-content {
|
||||
height: var(--elem-height);
|
||||
overflow-y: auto
|
||||
}
|
||||
|
||||
.banner-background {
|
||||
border-radius: var(--border-radius);
|
||||
background-color: var(--gray);
|
||||
opacity: 30%;
|
||||
object-fit: cover
|
||||
}
|
||||
|
||||
.banner-content {
|
||||
margin-left: 10px;
|
||||
margin-right: 10px;
|
||||
position: relative;
|
||||
top: calc(-1*var(--elem-height))
|
||||
}
|
||||
|
||||
.link {
|
||||
text-decoration: none;
|
||||
font-weight: 700;
|
||||
color: var(--white)
|
||||
}
|
||||
|
||||
.banner,
|
||||
.banner-background,
|
||||
.content {
|
||||
width: var(--elem-width)
|
||||
}
|
||||
|
||||
.content,
|
||||
.form-button {
|
||||
border: solid var(--gray) 3px;
|
||||
background: var(--black);
|
||||
border-radius: var(--border-radius);
|
||||
color: var(--white);
|
||||
padding: .5rem;
|
||||
margin-bottom: .5rem;
|
||||
text-decoration: none
|
||||
}
|
||||
|
||||
.content {
|
||||
margin-top: 10px;
|
||||
width: calc(var(--elem-width) - 1rem)
|
||||
}
|
||||
|
||||
.content-header {
|
||||
width: var(--elem-width)
|
||||
}
|
||||
|
||||
img {
|
||||
user-select: none
|
||||
}
|
||||
|
||||
pre {
|
||||
white-space: pre-wrap;
|
||||
font-family: var(--font) !important;
|
||||
}
|
||||
|
||||
.form-button {
|
||||
font-weight: 700;
|
||||
display: inline-block;
|
||||
background: var(--primary-dark);
|
||||
border-color: var(--primary-light)
|
||||
}
|
||||
80
index.html
Normal file
80
index.html
Normal file
|
|
@ -0,0 +1,80 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Dervland</title>
|
||||
<meta name="description" content="Collab on videos... make creative animations... and more!">
|
||||
<link rel="stylesheet" href="/index.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="banner"><img class="banner-background" src="/bg.svg">
|
||||
<div class="banner-content">
|
||||
<h1>Dervland</h1>
|
||||
<p>This is <b>08draven</b>'s amalgamation of games, web experiments and other projects.</p>
|
||||
<h2>Community</h2>
|
||||
|
||||
<a class="form-button" href="https://discord.gg/wZ3mg58JMT">Discord Server</a>
|
||||
<a class="form-button" href="https://git.xuyezo.net/08draven">Developer Portal</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class='content'>
|
||||
<h1 class='content-header'>Projects</h1>
|
||||
<div>
|
||||
<a class="form-button" href="https://ub.dervland.net">Unibutton</a>
|
||||
PVP with simple mechanics: only one button
|
||||
</div>
|
||||
<div>
|
||||
<a class="form-button" href="https://tree.dervland.net/?id=1066543460">Scratch Tree</a>
|
||||
Optimized Scratch remix tree frontend
|
||||
</div>
|
||||
<div>
|
||||
<a class="form-button" href="https://bg.dervland.net">BiglyChat</a>
|
||||
Social media and authentication server
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class='content'>
|
||||
<h1 class='content-header'>Archives</h1>
|
||||
<div>
|
||||
<a class="form-button" href="https://scratch.mit.edu/users/08draven">Scratch</a>
|
||||
Block coding language
|
||||
</div>
|
||||
<div>
|
||||
<a class="form-button" href="https://github.com/08draven">GitHub</a>
|
||||
Code community
|
||||
</div>
|
||||
<div>
|
||||
<a class="form-button" href="https://www.youtube.com/@08draven">YouTube</a>
|
||||
Video community
|
||||
</div>
|
||||
<div>
|
||||
<a class="form-button" href="https://alldimensions.fandom.com/wiki/User:Durvensonisback">FANDOM</a>
|
||||
Wiki community
|
||||
</div>
|
||||
<div>
|
||||
<a class="form-button" href="https://gamejolt.com/@08draven">GameJolt</a>
|
||||
Game development community
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class='content'>
|
||||
<h1 class='content-header'>My Story</h1>
|
||||
<p>
|
||||
I was introduced to the Internet around 2013-2014, when I was barely in elementary school.
|
||||
I spent a lot of time on Scratch; I learnt basic programming and made friends this way.
|
||||
</p>
|
||||
<p>
|
||||
On 2020-05-20, a friend group would create a Discord DM for learning HTML.
|
||||
While the DM derailed eventually, I became hooked on programming!
|
||||
</p>
|
||||
<p>
|
||||
Currently, I am aiming to diversify my experience and learn managerial skills.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Loading…
Reference in a new issue