From 1298abd3377cc79d8883bb6e38b65bca46f0c8d7 Mon Sep 17 00:00:00 2001 From: littleblack111 Date: Sun, 29 Oct 2023 01:30:19 +0800 Subject: all space -> tab --- src/css/style.css | 374 +++++++++++++++++++++++++++--------------------------- 1 file changed, 187 insertions(+), 187 deletions(-) (limited to 'src/css/style.css') diff --git a/src/css/style.css b/src/css/style.css index 411c3ec3..397fb468 100644 --- a/src/css/style.css +++ b/src/css/style.css @@ -1,276 +1,276 @@ :root { - --topBarHeight: 10%; + --topBarHeight: 10%; } @font-face { - font-family: hacked; - src: url(/fonts/Hacked-KerX.ttf); + font-family: hacked; + src: url(/fonts/Hacked-KerX.ttf); } @font-face { - font-family: smooth; - src: url(/fonts/SmoothElegantRegular-ZLv3.ttf); + font-family: smooth; + src: url(/fonts/SmoothElegantRegular-ZLv3.ttf); } @font-face { - font-family: liga; - src: url(/fonts/LigaJetBrainsMonoNerdFont-Regular.ttf); + font-family: liga; + src: url(/fonts/LigaJetBrainsMonoNerdFont-Regular.ttf); } @font-face { - font-family: big; - src: url(/fonts/Big500-8MLOM.ttf); + font-family: big; + src: url(/fonts/Big500-8MLOM.ttf); } - + @font-face { - font-family: monoton; - src: url(/fonts/Monoton.ttf); + font-family: monoton; + src: url(/fonts/Monoton.ttf); } @font-face { - font-family: rocksalt; - src: url(/fonts/RockSalt-Regular.ttf); + font-family: rocksalt; + src: url(/fonts/RockSalt-Regular.ttf); } @font-face { - font-family: audiowide; - src: url(/fonts/audiowide.ttf); +font-family: audiowide; +src: url(/fonts/audiowide.ttf); } /* page setup ============================================= */ * { - box-sizing: border-box; - padding: 0; - margin: 0; - font-family: liga; - text-shadow: 0px 0px 1px black; - transition: all 0.3s; + box-sizing: border-box; + padding: 0; + margin: 0; + font-family: liga; + text-shadow: 0px 0px 1px black; + transition: all 0.3s; } body { - top: 0; - left: 0; - transition: background 1s ease-in-out; + top: 0; + left: 0; + transition: background 1s ease-in-out; } body::-webkit-scrollbar { - display: none; +display: none; } /* animation ============================================== */ @keyframes slideInTop { - from { - transform: translateY(-300px); - } - to { - transform: translateY(0); - } +from { + transform: translateY(-300px); +} +to { + transform: translateY(0); +} } @keyframes bounce { - 0%, 20%, 50%, 80%, 100% { - transform: translateY(0px); - } - 40% { - transform: translateY(30px); - } - 80% { - transform: translateY(-15px); - } +0%, 20%, 50%, 80%, 100% { + transform: translateY(0px); +} +40% { + transform: translateY(30px); +} +80% { + transform: translateY(-15px); +} } @keyframes zoomIn { - 0% { - transform: scale(0.01); - } - 85% { - transform: scale(1.1); - } - 100% { - transform: scale(1); - } +0% { + transform: scale(0.01); +} +85% { + transform: scale(1.1); +} +100% { + transform: scale(1); +} } @keyframes zoomOut { - 0% { - transform: scale(1); - } - 100% { - transform: scale(0.01); - } +0% { + transform: scale(1); +} +100% { + transform: scale(0.01); +} } @keyframes reveal { - 0% { - -webkit-filter: blur(32px); - -moz-filter: blur(32px); - -o-filter: blur(32px); - -ms-filter: blur(32px); - -webkit-backdrop-filter: blur(32px); - backdrop-filter: blur(32px); - transform: scale(2); - } +0% { + -webkit-filter: blur(32px); + -moz-filter: blur(32px); + -o-filter: blur(32px); + -ms-filter: blur(32px); + -webkit-backdrop-filter: blur(32px); + backdrop-filter: blur(32px); + transform: scale(2); +} } @keyframes shake { - 0% { transform: rotate(0deg); } - 25% { transform: rotate(.5deg); } - 50% { transform: rotate(0eg); } - 75% { transform: rotate(-.5deg); } - 100% { transform: rotate(0deg); } +0% { transform: rotate(0deg); } +25% { transform: rotate(.5deg); } +50% { transform: rotate(0eg); } +75% { transform: rotate(-.5deg); } +100% { transform: rotate(0deg); } } @keyframes background-pan { - from { - background-position: 0% center; - } - to { - background-position: -200% center; - } +from { + background-position: 0% center; +} +to { + background-position: -200% center; +} } /* animation: name duration timing-function delay iteration-count direction fill-mode; */ /* animate class */ .animate { - animation-duration: 0.5s; - animation-fill-mode: both; +animation-duration: 0.5s; +animation-fill-mode: both; } .animate.animate--infinite { - animation-iteration-count: infinite; +animation-iteration-count: infinite; } .animate.animation--delay-1s { - animation-delay: 1s; +animation-delay: 1s; } .animate.animation--delay-p5s { - animation-delay: 0.5s; +animation-delay: 0.5s; } .animate.animation--delay-p3s { - animation-delay: 0.3s; +animation-delay: 0.3s; } .animate.animation--fast { - animation-duration: 0.3s; +animation-duration: 0.3s; } .animate.animation--slow { - animation-duration: 1s; +animation-duration: 1s; } /* real utility classes */ .animate.slideInTop { - animation-name: slideInTop; - animation-timing-function: ease-in; +animation-name: slideInTop; +animation-timing-function: ease-in; } .animate.bounce { - animation-name: bounce; +animation-name: bounce; } .animate.zoomIn { - transition-timing-function: linear; - animation-name: zoomIn; +transition-timing-function: linear; +animation-name: zoomIn; } .animate.zoomOut { - transition-timing-function: linear; - animation-name: zoomOut; +transition-timing-function: linear; +animation-name: zoomOut; } .animate.reveal { - transition-timing-function: linear; - animation-name: reveal; +transition-timing-function: linear; +animation-name: reveal; } .animate.shake { - animation-name: shake +animation-name: shake } /* transition */ * { - transition: all 0.3s; +transition: all 0.3s; } .js-tilt-glare { - border-radius: 18px; - overflow: hidden; +border-radius: 18px; +overflow: hidden; } /* topbar styles ========================================== */ header { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 3em; - justify-content: space-between; - align-items:center; - /* background: color(0, 0, 0, .1); */ - z-index: 1000; - background: rgba(128, 128, 128, 0.2) + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 3em; + justify-content: space-between; + align-items:center; + /* background: color(0, 0, 0, .1); */ + z-index: 1000; + background: rgba(128, 128, 128, 0.2) } .navBar a { - position: relative; - height: 100%; - font-size: 5mm; - text-transform: capitalize; - text-align: center; - text-decoration: none; - margin-left: 5mm; - margin-right: 5mm; - padding-top: 3mm; - padding-bottom: 3mm; - border-radius: 8px; - color: #F4E8C1; + position: relative; + height: 100%; + font-size: 5mm; + text-transform: capitalize; + text-align: center; + text-decoration: none; + margin-left: 5mm; + margin-right: 5mm; + padding-top: 3mm; + padding-bottom: 3mm; + border-radius: 8px; + color: #F4E8C1; } .navBar .hleft a {float: left;} .navBar .hright a {float: right;} .navBar a::after { - content: ''; - position: absolute; - left: 0; - bottom: 0; - width: 100%; - height: 1mm; - background: rgba(128, 128, 128, 0.2); - border-radius: 1mm; - transform: scaleX(0); - transition: all 0.3s; + content: ''; + position: absolute; + left: 0; + bottom: 0; + width: 100%; + height: 1mm; + background: rgba(128, 128, 128, 0.2); + border-radius: 1mm; + transform: scaleX(0); + transition: all 0.3s; } .navBar a:hover::after { - transform: scaleX(1.1); + transform: scaleX(1.1); } .navBar a:hover { - /* background: rgba(255, 255, 255, 0.2); */ - /* outline: ridge rgba(128, 128, 128, .6); */ - -moz-filter: blur(10px); - -o-filter: blur(10px); - -ms-filter: blur(10px); - -webkit-backdrop-filter: blur(10px); - backdrop-filter: blur(10px); - transition: all 1s +/* background: rgba(255, 255, 255, 0.2); */ +/* outline: ridge rgba(128, 128, 128, .6); */ +-moz-filter: blur(10px); +-o-filter: blur(10px); +-ms-filter: blur(10px); +-webkit-backdrop-filter: blur(10px); +backdrop-filter: blur(10px); +transition: all 1s } .navBar a.active::after { - content: ''; - position: absolute; - left: 0; - bottom: 0; - width: 100%; - height: 1mm; - background: rgba(128, 128, 128, .9); - border-radius: 1mm; - transform: scaleX(1); + content: ''; + position: absolute; + left: 0; + bottom: 0; + width: 100%; + height: 1mm; + background: rgba(128, 128, 128, .9); + border-radius: 1mm; + transform: scaleX(1); } .navBar:active, @@ -280,64 +280,64 @@ header:hover, #navBarHeader:hover, #navBarHeader:active { - transform: scale(1.005); - -moz-filter: blur(10px); - -o-filter: blur(10px); - -ms-filter: blur(10px); - -webkit-backdrop-filter: blur(10px); - backdrop-filter: blur(10px); +transform: scale(1.005); +-moz-filter: blur(10px); +-o-filter: blur(10px); +-ms-filter: blur(10px); +-webkit-backdrop-filter: blur(10px); +backdrop-filter: blur(10px); transition: all 0.5s } .navBar, header, #navBarHeader { - -moz-filter: blur(2.5px); - -o-filter: blur(2.5px); - -ms-filter: blur(2.5px); - -webkit-backdrop-filter: blur(2.5px); - backdrop-filter: blur(2.5px); +-moz-filter: blur(2.5px); +-o-filter: blur(2.5px); +-ms-filter: blur(2.5px); +-webkit-backdrop-filter: blur(2.5px); +backdrop-filter: blur(2.5px); } /* other ================================================== */ .contents { - margin: 0; - padding: 0; - width: 100%; - height: 100%; + margin: 0; + padding: 0; + width: 100%; + height: 100%; } section { - position: relative; + position: relative; } .wrapper { - height: 100vh; - overflow-y: auto; - overflow-x: hidden; - perspective: 10px; +height: 100vh; +overflow-y: auto; +overflow-x: hidden; +perspective: 10px; } a:hover { - font-weight: bold; - text-decoration: underline; - text-decoration-thickness: 3px; - -webkit-text-decoration-line: underline; - cursor: pointer; - transition-timing-function: cubic-bezier(.4,0,.2,1); - transition-duration: .15s; - text-underline-offset: 1px; - transition: all .5s; - position: relative; - height: 100%; - font-size: 5mm; - text-transform: capitalize; - text-align: center; - margin-left: 5mm; - margin-right: 5mm; - padding-top: 3mm; - padding-bottom: 3mm; - /* border-radius: 8px; */ - /* color: #F4E8C1; */ + font-weight: bold; + text-decoration: underline; + text-decoration-thickness: 3px; + -webkit-text-decoration-line: underline; + cursor: pointer; + transition-timing-function: cubic-bezier(.4,0,.2,1); + transition-duration: .15s; + text-underline-offset: 1px; + transition: all .5s; + position: relative; + height: 100%; + font-size: 5mm; + text-transform: capitalize; + text-align: center; + margin-left: 5mm; + margin-right: 5mm; + padding-top: 3mm; + padding-bottom: 3mm; + /* border-radius: 8px; */ + /* color: #F4E8C1; */ } -- cgit v1.2.3