git.m6w6.name Git - mdref/mdref/blob - public/index.css

   1 html {
   2         font-size: 16px;
   3 }
   4 html, body{
   5         height: 100%;
   6         min-height: 100%;
   7 }
   8 body, code {
   9         font-family:
  10                         'DejaVu Sans Mono', 'Liberation Mono',
  11                         'Andale Mono', Monaco, Menlo,
  12                         monospace;
  13         /*
  14                 Mitra Mono has broken kerning?
  15                 Ubuntu Mono is too small!
  16          */
  17 }
  18 body {
  19         line-height: 1.5;
  20         font-size: 1.1em;
  21         margin: 0;
  22         padding: 0;
  23         color: #3f3f3f;
  24 }
  25
  26 div.page {
  27         margin: auto;
  28 /*      max-width: 1200px;
  29 */      min-height: 100%;
  30         padding-bottom: 5em;
  31         box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.5);
  32 }
  33
  34 div.page>* {
  35         margin-left: 1em;
  36 }
  37 div.page>footer {
  38         margin-left: 0;
  39 }
  40 div.page>ul, div.page>div>ul {
  41         margin-left: 2em;
  42 }
  43
  44 .sidebar {
  45         float: right;
  46         background: #f0f0f0;
  47         border-bottom-left-radius: 10px;
  48         padding: 0;
  49         width: auto;
  50         min-width: 200px;
  51         padding-right: 1em;
  52         padding-bottom: 1em;
  53         margin-bottom: 1em;
  54 }
  55 .sidebar>ul {
  56 }
  57 .sidebar ul {
  58         margin-left: 1em;
  59         margin-top: .5em;
  60         margin-bottom: 0;
  61         padding: 0;
  62         list-style-type: none;
  63 }
  64
  65 .sidebar .edit {
  66         display: block;
  67         position: relative;
  68         top: 2em;
  69         right: 0;
  70         -webkit-transform: rotate(45deg);
  71         transform: rotate(45deg);
  72         text-decoration: none;
  73         font-weight: bold;
  74         text-shadow: 0 0 5px red;
  75         float: right;
  76 }
  77
  78 .sidebar .edit a {
  79         color: white !important;
  80 }
  81 code {
  82         border-radius: 2px;
  83         padding: 0px 2px 2px 2px;
  84         background: #f0f0f0;
  85         color: #606060;
  86         box-shadow: 0 0 1px #999;
  87 }
  88
  89 code code {
  90         display: inline;
  91         padding: 0;
  92         background: transparent;
  93         border: none;
  94         box-shadow: none;
  95 }
  96
  97 pre>code {
  98         display: inline-block;
  99         padding: 1em;
 100         min-width: 50%;
 101         line-height: 1.2;
 102 }
 103
 104 pre>code, pre>code code {
 105         background: #333;
 106         color: ghostwhite;
 107 }
 108 pre>code .comment {
 109         color: darkorange !important;
 110 }
 111 pre>code .string {
 112         color: darkseagreen !important;
 113 }
 114 pre>code .keyword {
 115         color: darkgray !important;
 116 }
 117
 118 p, pre, table, dl {
 119         margin: 1em 2em;
 120         margin-left: 2em !important;
 121 }
 122
 123 pre>code, table, dl {
 124         margin-bottom: 2em !important;
 125 }
 126
 127 li>p {
 128         margin: 1em 0;
 129 }
 130
 131 blockquote {
 132         border-top: 1px solid #800000;
 133         border-bottom: 1px solid #800000;
 134         background: #ffe4e1;
 135         margin: 2em 0 !important;
 136 }
 137
 138 ul {
 139         margin-top: 1em;
 140         margin-bottom: 2em;
 141 }
 142 ol {
 143         list-style-type: none;
 144 }
 145 ol ul {
 146         margin-top: 0;
 147         margin-bottom: 0;
 148 }
 149 ol li {
 150         margin-bottom: 0;
 151 }
 152 ol>li {
 153         font-weight: bold;
 154         margin-bottom: .5em;
 155 }
 156 ol>li>* {
 157         font-weight: normal;
 158 }
 159 li {
 160         margin-bottom: .5em;
 161 }
 162 a, h1 code>a {
 163         color: #2f4f4f;
 164 }
 165 a:hover {
 166         text-decoration: none;
 167 }
 168 a[href^="http:"]:after, a[href^="https:"]:after {
 169         content: " ⬈";
 170 }
 171 code>a {
 172         text-decoration: none;
 173 }
 174 code a[href^="http:"]:after, code a[href^="https:"]:after {
 175         content: "";
 176 }
 177
 178 a.permalink {
 179         position: relative;
 180         top: 0;
 181         right: 0;
 182         color: #999999;
 183         opacity: 0.25;
 184 }
 185 .blink {
 186         color: red !important;
 187 }
 188 .fade-out {
 189         opacity: 0;
 190 }
 191 .fade-in {
 192         opacity: 1;
 193 }
 194 .trans-slow {
 195         transition: all 600ms;
 196 }
 197 .trans-fast {
 198         transition: all 200ms;
 199 }
 200
 201 .var {
 202         color: #800000;
 203 }
 204 .constant {
 205         color: #2e8b57;
 206 }
 207
 208 h1, li h3, th, footer {
 209         background: #708090;
 210         color: #f5f5dc;
 211 }
 212
 213 h1, footer {
 214         margin: 0;
 215 /*      max-width: 1200px;
 216 */      padding: 1em;
 217 }
 218
 219 h1 {
 220         line-height: 1.5;
 221         margin-left: 0 !important;
 222         padding-left: 2em;
 223 }
 224 h1 code {
 225         font-weight: normal;
 226         font-size: .9em;
 227         line-height: 1.33;
 228 }
 229 h1 a.permalink {
 230         left: -.8em;
 231         margin-right: -.6em;
 232 }
 233
 234 li h3 {
 235         border-radius: 4px;
 236         display: inline-block;
 237         width: auto;
 238         padding: .2em;
 239         margin: .5em 0 0 0;
 240 }
 241
 242 div.page>h3, div.page>div>h3 {
 243         margin-left: 1.25em;
 244 }
 245 div.page>h4, div.page>div>h4 {
 246         margin-left: 1.5em;
 247 }
 248 div.page>h5, div.page>div>h5 {
 249         margin-left: 1.75em;
 250 }
 251 div.page>h6, div.page>div>h6 {
 252         margin-left: 2em;
 253 }
 254
 255 h1 .constant, pre>code .consant, li h3 .constant {
 256         color: #98fb98;
 257 }
 258
 259 h1 .var, pre>code .var, li h3 .var {
 260         color: #f4a460;
 261 }
 262 h1 {
 263         font-size: 125%;
 264 }
 265 h2 {
 266         font-size: 120%;
 267 }
 268 h3 {
 269         font-size: 110%;
 270 }
 271 h4 {
 272         font-size: 100%;
 273 }
 274 footer a, h1 a, pre>code a, li h3 a {
 275         color: #b0e0e6;
 276 }
 277 li h3 {
 278 }
 279 li h3 a {
 280         text-decoration: none;
 281 }
 282 li h3 a:hover {
 283         text-decoration: underline;
 284 }
 285
 286 .comments {
 287         width: 80%;
 288 }
 289 .comments .activator {
 290         width: 100%;
 291         margin: auto;
 292         padding: 1em;
 293         background-color: slategrey;
 294         color: white;
 295         font-size: 1em;
 296         font-weight: bold;
 297         border: 0;
 298         border-radius: 2px;
 299         box-shadow: 0 0 4px #999;
 300 }
 301
 302 footer {
 303         font-size: smaller;
 304         text-align: center;
 305         clear: both;
 306         position: fixed;
 307         bottom: 0;
 308         width: 100%;
 309         padding: 0;
 310         transition: margin-bottom 2s ease 0.1s;
 311 }
 312 footer.hidden {
 313         margin-bottom: -10em;
 314         transition: margin-bottom 2s ease 0.1s;
 315 }
 316
 317 footer ul {
 318         margin: 0;
 319         padding: 1em 0;
 320 }
 321
 322 footer li {
 323         list-style-type: none;
 324         display: inline-block;
 325         margin: 0 1em;
 326 }
 327
 328 footer a {
 329         text-decoration: none;
 330 }
 331
 332 footer a:hover {
 333         text-decoration: underline;
 334 }
 335
 336 table {
 337         border-collapse: collapse;
 338 }
 339 th, td {
 340         padding: .4em;
 341         border-bottom: 1px solid rgba(112, 128, 144, 0.1);
 342 }
 343 dt {
 344         font-weight: bold;
 345         margin-top: 1em;
 346 }
 347 dd {
 348         line-height: 1.33;
 349         margin-left: 1em;
 350 }
 351 h1, footer, table, .sidebar, pre>code, li h3 {
 352         box-shadow: 0 0 4px #708090;
 353 }