diff --git a/styles/stylemain.css b/styles/stylemain.css index c4f230c..c70df9b 100644 --- a/styles/stylemain.css +++ b/styles/stylemain.css @@ -1,179 +1,77 @@ +/* CSS for System64.dev v2, by IDeletedSystem64. Under MIT License (v4.14.23) */ @import url('https://fonts.googleapis.com/css2?family=Bitter:wght@600&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Share+Tech+Mono&display=swap'); -/* Import Fonts */ +/* Import dem fonts */ -div.alert { - width: 100%; - background-color: #ffffe1; -} -p.alert { +button.home { + font-family: 'Share Tech Mono', monospace; + color: white; + /* font-size: */ display: inline; - font-family: 'Share Tech Mono', monospace; - color: black; } -header { - background: linear-gradient(#072CFF, #0e26ae ); - position: absolute; - left: 0px; - top: 0px; - height: 40px; - width: 100% -} -h1.header { - padding: 32px; +h1 { font-family: 'Bitter', serif; color: white; display: inline; + font-size: 26pt } -/* Header / Menubar */ -h1.intro { - font-family: 'Share Tech Mono', monospace; +h2 { + font-family: 'Bitter', serif; color: white; - font-size: 2.5vw; - padding-top: 13vw; - padding-left: 5vw; -} -p.info { - font-family: 'Share Tech Mono', monospace; - color: white; - font-size: 1.25vw; - margin: 0 0 0 5.5%; /* we use margins now, fuck you. */ + font-size: 16pt; } + li { font-family: 'Share Tech Mono', monospace; color: white; - font-size: 1.20vw; + font-size: 15pt; list-style-type: square; } -ul { - margin: 1% 0 0 5.5%; -} -div.main { - width: 75%; - margin: auto; -} -div.buttons { - margin: 1% 0 0 5%; -} +/* Text based stuffs */ + body { background-image: url("/img/bg.jpg"); } -/* Main content as well as website background */ -input { - -webkit-appearance: none; - min-width: 200px; - background: #dad9d9; - font-size: 150%; - font-family: 'Share Tech Mono', monospace; - color: black; - box-shadow: inset -0.05em -0.05em black -} -input:active { - background: #acacac; - box-shadow: inset 0em 0em + +.container { + height: 100vh; + display: flex; + flex-direction: column; } -.button { - display: inline-flex; - font-size: 16px; - text-align: center; - border: none; - border-radius: 4px; - outline: none; - box-shadow: none; - cursor: pointer; - transition: 0.3s ease-in-out; +div.main { + margin-top: 30vh; + margin-left: 10vh; } +/* Website layout */ -.button.button1 { - border-radius: 0; - box-sizing: border-box; - min-height: 23px; - color: #000; - padding: 0 2px 2px 0; - border-top: 1px solid #CCCCCC; - border-right: 0.1px solid transparent; - border-bottom: 1px solid #333333; - border-left: 1px solid #CCCCCC; - background-color: #979797; - width: 15%; -} - -.button.button1 span { - -webkit-appearance: none; - margin-left: auto; - margin-right: auto; - display: block; - width: 100%; - background: #dad9d9; - font-size: 170%; - font-family: 'Share Tech Mono', monospace; - box-shadow: inset -0.05em -0.05em black; -} - -.button.button1 span:hover, -.button.button1:hover + .button.button1 span { - background-color: #ACACAC; - border-top: 1px solid transparent; - border-right: 0.1px solid #dad9d9; - border-bottom: 1px solid #dad9d9; - border-left: 1px solid transparent; - box-shadow: inset -0.05em -0.05em transparent;} -.button.button1:hover { - background-color: #ACACAC; -} - -div.webbutton { - margin: auto; - width: 264px; - padding-top: 3px; -} img.webbutton{ width: 88px; height: 31px; float: left; text-align: center; } -/* Button */ +/* Web buttons :) */ -a { - text-decoration: none; -} -/* I'm mad that I have to make this mobile-compatible, Lol. https://twitter.com/IDeleteSystem64/status/1512218098325147655?s=20&t=Hz4V-vxmywYwTMvuBbCAZQ */ -@media only screen and (max-width: 980px) { - p.intro { - font-size: 8vw; - padding-top: 10px; + /* Did you know: I wish I wasn't doing this right now? */ + @media (max-width: 64em) { + h1 { + font-size: 56pt; } - header { - height: 75px; + h2 { + font-size: 28pt; } - h1.header { - font-size: 60px; - padding-left: 25%; + li { + font-size: 26pt; } - input { - margin-left: -10%; - font-size: 7vw; - -webkit-text-size-adjust:100%; - min-width: 125%; - max-width: 125; - } - p.info { - font-family: 'Share Tech Mono', monospace; - color: white; - font-size: 4.5vw; - + div.main { + margin-left: 0vh; } - img.webbutton { - width: 176px; - height: 62px; - float: left; + .container { + flex-wrap: wrap; + align-items: center; } - div.webbutton { - width: 100%; - padding-left: 15%; - } -} + } + \ No newline at end of file