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