git-repo-styles
Design documents for git.pablopie.xyz ✏️
styles.css (3510B)
1 /* This program is free software: you can redistribute it and/or modify 2 it under the terms of the GNU General Public License as published by 3 the Free Software Foundation, either version 3 of the License, or 4 (at your option) any later version. 5 6 This program is distributed in the hope that it will be useful, 7 but WITHOUT ANY WARRANTY; without even the implied warranty of 8 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 9 GNU General Public License for more details. 10 11 You should have received a copy of the GNU General Public License 12 along with this program. If not, see <https://www.gnu.org/licenses/>. */ 13 14 :root { 15 --light-background: #101822; 16 --dark-background: #070d15; 17 --foreground: #dfdfdf; 18 --accent: #ff6b9c; 19 } 20 21 body { 22 margin: 0; 23 padding: 1em; 24 25 color: var(--foreground); 26 background: var(--light-background); 27 28 font-size: 12.5pt; 29 text-align: left; 30 font-family: sans-serif; 31 } 32 33 @media (min-width: 800px) { 34 body { 35 padding: 1em 15vw; 36 } 37 } 38 39 main { 40 padding: 1em 0; 41 } 42 43 p { 44 margin-top: 1em; 45 } 46 47 a { 48 color: var(--foreground); 49 } 50 51 h1, h2, h3, h4, h5, h6 { 52 color: var(--accent); 53 margin: 1rem 0; 54 text-align: left; 55 } 56 57 ul, ol { 58 padding: 0; 59 } 60 61 ul { 62 margin-left: 1em; 63 list-style-type: disc; 64 } 65 66 ol { 67 margin-left: 2em; 68 list-style-type: decimal; 69 } 70 71 ul li::marker, ol li::marker { 72 font-weight: bold; 73 font-style: normal; 74 color: var(--accent); 75 } 76 77 dt { 78 font-weight: bold; 79 } 80 81 dd { 82 margin-left: 1em; 83 } 84 85 footer { 86 text-align: center; 87 } 88 89 table { 90 width: 100%; 91 } 92 93 thead td { 94 font-weight: bold; 95 } 96 97 main > *:first-child, #readme > *:first-child { 98 margin-top: 0; 99 } 100 101 main > *:last-child, #readme > *:last-child { 102 margin-bottom: 0; 103 } 104 105 header nav img { 106 position: relative; 107 top: 0.3rem; 108 width: 1.2rem; 109 height: 1.2rem; 110 margin-right: .5rem; 111 } 112 113 .article-list article, #readme { 114 background: var(--dark-background); 115 padding: 1em; 116 margin: .5em 0; 117 } 118 119 .article-list article h4 { 120 margin: 0; 121 margin-bottom: .5em; 122 font-size: 1rem; 123 } 124 125 .article-list article > p:last-child { 126 margin-bottom: 0; 127 } 128 129 .article-list article h4 a, header nav a { 130 color: var(--accent); 131 font-weight: bold; 132 text-decoration: none; 133 } 134 135 .article-list article h4 a:hover { 136 text-decoration: underline; 137 } 138 139 .article-list article h4 { 140 border-bottom: 1px solid var(--accent); 141 font-size: 1em; 142 } 143 144 .article-list article time { 145 display: inline-block; 146 float: right; 147 color: var(--dark-background); 148 background: var(--foreground); 149 padding: 0 10px; 150 maring-top: 10px; 151 } 152 153 .table-container { 154 max-width: 100%; 155 overflow-x: scroll; 156 scrollbar-width: none; 157 } 158 159 .table-container::-webkit-scrollbar { 160 display: none; 161 } 162 163 .codeblock { 164 background: var(--dark-background); 165 border-left: 5px solid var(--accent); 166 167 overflow-x: scroll; 168 scrollbar-width: none; 169 170 margin: 1em 0; 171 } 172 173 .codeblock::-webkit-scrollbar { 174 display: none; 175 } 176 177 #readme .codeblock { 178 background: var(--light-background); 179 } 180 181 .codeblock pre { 182 margin: 1em; 183 width: min-content; 184 } 185 186 .line { 187 color: var(--accent); 188 font-weight: bold; 189 text-decoration: none; 190 } 191 192 .line:hover { 193 text-decoration: underline; 194 } 195 196 .commit { 197 margin-top: 1em; 198 padding: 1em; 199 background: var(--dark-background); 200 overflow-wrap: break-word; 201 } 202 203 .commit > :first-child { 204 margin-top: 0; 205 } 206 207 .commit > :last-child { 208 margin-bottom: 0; 209 } 210 211 .d { 212 color: #ff0a38; 213 text-decoration: none; 214 } 215 216 .i { 217 color: #00e639; 218 text-decoration: none; 219 } 220 221 .h { 222 color: var(--accent); 223 font-weight: bold; 224 }