chrisbell/hexstudios-co
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Some CSS and colors

Browse Source
This commit is contained in:
Christopher Bell 2022-09-11 22:26:39 -05:00
parent 1ce12641cf
commit cfb64b02ff
3 changed files with 79 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
colorpallete.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

48
css/master.css
View File

@ -1,9 +1,57 @@
:root {
--color-pallete-red: #a80000;
--color-pallete-dark-red: #731010;
--color-pallete-dark-grey: #1f1f1f;
--color-pallete-grey: #707070;
--color-pallete-light-grey: #d4d4d4;
}
* { * {
margin: 0; margin: 0;
padding: 0; padding: 0;
box-sizing: border-box; box-sizing: border-box;
color: var(--color-pallete-light-grey);
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
} }
::selection {
background-color: var(--color-pallete-red);
}
a {
text-decoration: none;
}
a:visited {
color: var(--color-pallete-light-grey);
}
html {
background-color: var(--color-pallete-dark-grey);
}
body { body {
text-align: center; text-align: center;
}
#header {
display: flex;
height: 100vh;
justify-content: center;
align-items: center;
background-color: black; background-color: black;
} }
#content {
background-color: var(--color-pallete-dark-grey);
}
#footer {
background-color: black;
}
.content-break {
width: 45vw;
height: 2px;
background-color: red;
color: red;
}

11
index.html
View File

@ -9,6 +9,7 @@
<title>Hex Studios</title> <title>Hex Studios</title>
</head> </head>
<body> <body>
<div id="header">
<div id="hex-svg"> <div id="hex-svg">
<svg width="400" height="400" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg width="400" height="400" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="hex-logo"> <g id="hex-logo">
@ -29,6 +30,16 @@
<rect id="hex-logo-slash" x="50" y="50" width="1.5" height="13" fill="black"/> <rect id="hex-logo-slash" x="50" y="50" width="1.5" height="13" fill="black"/>
</g> </g>
</svg> </svg>
<div>
<a href="#content">\SCROLL DOWN/</a>
</div>
</div>
</div>
<div id="content">
<hr class="content-break">
</div>
<div id="footer">
</div> </div>
</body> </body>
</html> </html>