style.css (2878B)
1 @media (prefers-color-scheme: dark) { 2 :root { 3 color-scheme: light; 4 --bg: #e3cad6; 5 --head: #100f0f; 6 --hover: #0000ff; 7 --accent-bg: #f5f7ff; 8 --text: #212121; 9 --text-light: #585858; 10 --accent: #0d47a1; 11 --accent-hover: #1266e2; 12 --accent-text: var(--bg); 13 --code: #5baaff; 14 --preformatted: #444; 15 --marked: #ffdd33; 16 --disabled: #efefef; 17 } 18 19 20 :root { 21 color-scheme: dark; 22 --bg: #100f0f; 23 --head: #6a7a82; 24 --hover: #e3cad6; 25 --accent-bg: #2b2b2b; 26 --text: #dcdcdc; 27 --text-light: #ababab; 28 --accent: #ffb300; 29 --accent-hover: #ffe099; 30 --accent-text: var(--bg); 31 --code: #6a7a82; 32 --preformatted: #ccc; 33 --disabled: #111; 34 } 35 } 36 html{ 37 font-family: monospace; 38 background-color: var(--bg); 39 font-weight: 400; 40 color: var(--head); 41 max-width: 520px ; 42 font-size:14px ; 43 text-align: left ; 44 margin: auto ; 45 } 46 47 body { 48 background-color: var(--bg); 49 color: var(--head); 50 font-family: monospace; 51 margin-bottom: 100px; 52 font-weight: 400; 53 /* font-size: 16px;*/ 54 } 55 56 .title { 57 white-space: pre ; 58 margin: auto ; 59 text-align: center ; 60 font-size: 8px; 61 max-width: 520px; 62 } 63 64 65 footer { 66 text-align: left; 67 color: var(--accent) ; 68 font-size: small; 69 } 70 71 72 a { 73 color: var(--head); 74 text-decoration: underline; 75 } 76 77 a:hover { 78 color: var(--hover); 79 text-decoration: underline; 80 } 81 82 83 .qr { 84 max-width: 100px; 85 padding: 10px; 86 border: medium none; 87 align: left; 88 } 89 90 91 .pix { 92 max-width: 450px; 93 padding: 10px; 94 border: medium none; 95 align: center; 96 } 97 98 code { 99 overflow-x:auto; 100 overflow-y:auto; 101 padding: 4px; 102 min-width:600; 103 background-color: var(--code); !important; 104 font-size:14px!important; 105 margin-bottom:10px; 106 color: var(--bg); 107 line-height: 1.3em; 108 } 109 110 .separator { 111 text-align: center; 112 white-space: nowrap; 113 overflow-x: hidden; 114 margin-top: 8px; 115 margin-bottom: 8px; 116 overflow-x: hidden; 117 border-top: 1px dashed var(--head); 118 } 119 120 menu { 121 text-align: right; 122 white-space: nowrap; 123 overflow-x: hidden; 124 margin-top: 14px; 125 margin-bottom: 14px; 126 margin: 14px; 127 background-color: var(--bg); 128 color: var(--head); 129 overflow-x: hidden; 130 } 131 132 .logo { 133 align: center; 134 max-width: 75%; 135 max-height: 75%; 136 text-decoration: none; 137 border-bottom: unset; 138 background: unset !important; 139 margin-right: 50px; 140 margin-left: 50px; 141 } 142 143 .icon { 144 align: center; 145 max-width: 20%; 146 max-height: 20%; 147 text-decoration: none; 148 border-bottom: unset; 149 background: unset !important; 150 margin: auto; 151 } 152 153 154 155 ul { 156 list-style-type: none; 157 margin: 0; 158 padding: 0; 159 max-width: 75%; 160 font-size: 14px; 161 display: block; 162 163 } 164 165 166 @media only screen and (max-width: 800px) { 167 /*GENERAL ELEMENTS*/ 168 /*CLASSES*/ 169 .wrapper { 170 width: 100%; 171 /*font-size: 4vw;*/ 172 } 173 174 .title { 175 font-size: 0.8vw; 176 } 177 .tops{ 178 font-size: 2.5vw; 179 } 180 }