mirror of
https://github.com/DerTyp7/dertyp7.github.io.git
synced 2025-10-29 21:02:09 +01:00
2 lines
2.1 KiB
CSS
2 lines
2.1 KiB
CSS
#app{display:flex;flex-direction:column;background-color:var(--color-background-body);min-height:auto;flex:1}.header{padding:1rem 2rem;display:flex;justify-content:space-between;align-items:center;gap:5rem;flex-direction:row}.header .logo{flex:.5}.header .links{flex:1;display:flex;flex-direction:row;align-items:center;justify-content:space-around}.header .links a{margin-left:1rem;text-decoration:none;color:var(--color-font-link-header);font-weight:600;font-size:1.2rem;transition:all .1s ease-in-out;border-bottom:3px solid var(--color-border-link-header)}.header .links a:hover{color:var(--color-font-link-header-hover);border-color:var(--color-border-link-header-hover)}.header .control{display:flex;justify-content:space-around;align-items:center;flex:.5}.themeSwitch svg{aspect-ratio:1;height:2rem;cursor:pointer;animation-duration:.15s;animation-timing-function:linear;animation-iteration-count:1;animation-direction:normal;fill:var(--color-font-nav);transition:all 50ms linear}.themeSwitch svg:hover{fill:var(--color-font)}@keyframes spinThemeSwitch{0%{transform:rotate(0)}to{transform:rotate(-180deg)}}:root{--color-background-body: #ffffff;--color-background-header: transparent;--color-font: #000000;--color-font-link-header: #323232;--color-font-link-header-hover: #000000;--color-border-link-header: transparent;--color-border-link-header-hover: #000000;--color-danger: #cf000f;--color-success: #009944;--color-info: #63c0df;--color-warning: #f0541e;--color-svg-header: #363636;--color-accent: #2294ff;--color-font-link: var(--color-accent);--color-font-link-hover: #0966be}:root .theme-dark{--color-background-body: #1a1818;--color-background-header: transparent;--color-font: #fff}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:var(--color-font);background-color:var(--color-background-body);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body,#root{display:flex;flex-direction:column;height:100vh;width:100vw}
|