diff options
| author | s1nical <[email protected]> | 2019-08-12 00:56:40 -0700 |
|---|---|---|
| committer | s1nical <[email protected]> | 2019-08-12 00:56:40 -0700 |
| commit | cf5a0bd62c9d2a444eb517eeabae929558776d73 (patch) | |
| tree | 6e0d59d0aa04af3a4a682e848c9a9259c9c7c7fa /css | |
| parent | fix small formatting eyesore (diff) | |
| download | s1n.pw-admin-cf5a0bd62c9d2a444eb517eeabae929558776d73.tar.xz s1n.pw-admin-cf5a0bd62c9d2a444eb517eeabae929558776d73.zip | |
remove .scss files
Diffstat (limited to 'css')
| -rw-r--r-- | css/main.scss | 231 |
1 files changed, 0 insertions, 231 deletions
diff --git a/css/main.scss b/css/main.scss deleted file mode 100644 index 267e903..0000000 --- a/css/main.scss +++ /dev/null @@ -1,231 +0,0 @@ -/* BACKGROUND SPARKLES CSS */ -html, body { - margin: 0 0; - padding: 0 0; - text-align: center; - font-size: 0; - background-color: #fdfcf3; -} - -body svg { - position: absolute; - top: 0; - left: 0; - z-index: -1; -} - -/* LOADING ANIMATION */ - -/* body { -** text-align: center; -** padding-top: 20%; -** background: #fdfdfd; -** } -*/ - -.loader-wrapper { - width: 100%; - height: 100%; - position: absolute; - top: 0; - left: 0; - background: #fdfdfd; - display: flex; - justify-content: center; - align-items: center; -} - -.loader { - width: 100px; - height: 100px; - display: inline-table; - box-sizing: border-box; - position: relative; - border-spacing: 0.3em; -} -.loader row { - display: table-row; -} -.loader row span { - display: table-cell; - position: relative; - background: #1d1f20; - opacity: 0; - -webkit-animation: flicker 0.5985999999999999s ease-out infinite alternate; - animation: flicker 0.5985999999999999s ease-out infinite alternate; /* Added standard property to fix compatbiliy issues */ -} - -@-webkit-keyframes flicker { - from, 20% { - opacity: 0; - } - 100%, to { - opacity: 1; - } -} - -@keyframes flicker { /* Added standard property to fix compatbiliy issues */ - from, 20% { - opacity: 0; - } - 100%, to { - opacity: 1; - } -} - -.loader row:nth-child(1) span:nth-child(1) { -webkit-animation-delay: .50s; animation-delay: .50s; } /* Added standard property to fix compatbiliy issues */ -.loader row:nth-child(1) span:nth-child(2) { -webkit-animation-delay: .70s; animation-delay: .70s; } -.loader row:nth-child(1) span:nth-child(3) { -webkit-animation-delay: .60s; animation-delay: .60s; } -.loader row:nth-child(2) span:nth-child(1) { -webkit-animation-delay: .20s; animation-delay: .20s; } -.loader row:nth-child(2) span:nth-child(2) { -webkit-animation-delay: .80s; animation-delay: .80s; } -.loader row:nth-child(2) span:nth-child(3) { -webkit-animation-delay: .90s; animation-delay: .90s; } -.loader row:nth-child(3) span:nth-child(1) { -webkit-animation-delay: .10s; animation-delay: .10s; } -.loader row:nth-child(3) span:nth-child(2) { -webkit-animation-delay: .30s; animation-delay: .30s; } -.loader row:nth-child(3) span:nth-child(3) { -webkit-animation-delay: .40s; animation-delay: .40s; } - -/* ORINGINAL SITE CSS */ -html { - box-sizing: border-box; - display: flex; - justify-content: center; - user-select: none; - -webkit-tap-highlight-color: transparent; -} - -*, *:before, *:after { - box-sizing: inherit; -} - -html, body { - height: 100%; - display: flex; - flex-flow: row wrap; -} - -body { - font: normal 20px/1.4 'Inter', sans-serif; - margin: 0 1em; - padding: 1em 0; - color: #000; - background: none; -} - -@supports (font-variation-settings: normal) { - body { - font-family: 'Inter var', sans-serif; - } -} - -main { - /* margin: auto; ** This is only needed for mobile */ - font-size: 6vh; - line-height: 1.2; - max-width: 75vh; -} - -/* I was trying to figure out how to only call the <a> tags from index.html, so it wouldn't change the values for other <a> tags, and I tried everything, -** or so I thought, and I figured out I had to do `.links a` by scrolling up and saw `.loader row span` which wasn't even the correct syntax but I removed -** the `row` and IT WORKED! I actually got so happy lol. - 2:15 AM, 8/7/2019 -*/ - -.links a { - color: inherit; - text-decoration: none; - background-color: #ffdc73; /* hsl(200, 100%, 80% */ - box-shadow: - 0 7px 30px -10px #ffdc73, - 0 7px 30px -10px #ffdc73; - transition: background-color 0.15s ease-in-out; -} - -/* #ffdc73 box-shadow should usually be only box-shadow, but I made it two so it would be more visable. -// Secondary box-shadow, rgba(154,160,185,0.05) -*/ - -.links a:hover, -.links a:focus { - outline: none; - background-color: #282936; - color: #fff; - transition: color 0.15s ease-in-out; - box-shadow: - 0 7px 30px -10px #282936, /* rgba(154,160,185,0.05) */ - 0 7px 30px -10px #282936; /* rgba(166,173,201,0.2) */ - transition: box-shadow 0.15s ease-in-out; -} - -/* NAVIGATION MENU */ -@import url('https://fonts.googleapis.com/css?family=DM+Sans:500,700&display=swap'); - -.navigation-bar { - display: flex; - flex: 1 0 100%; - justify-content: center; -} - -.nav { - overflow: hidden; - max-width: 100%; - background-color: #fff; - padding: 0 20px; - border-radius: 40px; - box-shadow: 0 10px 40px rgba(159, 162, 177, .8); - position: absolute; /* Only reason it's centered. */ - /* Manual position adjusting - ** top: 0; - ** left: 0; - */ - display: flex; - justify-content: center; - align-items: center; -} - -.nav-item { - color: #83818c; - padding: 20px; - text-decoration: none; - transition: .3s; - margin: 0 6px; - font-family: 'DM Sans', sans-serif; - font-weight: 500; - position: relative; - display: flex; - justify-content: center; - align-items: center; - - &:before { - content: ""; - position: absolute; - bottom: -6px; - left: 0; - width: 100%; - height: 5px; - background-color: #dfe2ea; - border-radius: 8px 8px 0 0; - opacity: 0; - transition: .3s; - } -} - -.nav-item:not(.is-active):hover:before { - opacity: 1; - bottom: 0; -} - - -.nav-item:not(.is-active):hover { color: #333; } - -.nav-indicator { - position: absolute; - left: 0; - bottom: 0; - height: 4px; - transition: .4s; - height: 5px; - z-index: 1; - border-radius: 8px 8px 0 0; -} - -@media (max-width: 580px) { - .nav { overflow: auto; } -} |