global.less 1.3 KB
Newer Older
1 2 3 4 5
@import (reference) 'mixins';
@import (reference) 'settings';

html {
  background: @page-background-color;
Emma's avatar
Emma committed
6
  box-sizing: border-box;
7 8
  color: @page-color;
  font-family: @page-font-family;
9
  font-size: @page-font-size;
Emma's avatar
Emma committed
10
  height: 100%;
11
  line-height: @page-line-height;
12 13
}

Emma's avatar
Emma committed
14 15 16 17
*, *::before, *::after {
  box-sizing: inherit;
}

18
body {
Emma's avatar
Emma committed
19 20 21
  display: flex;
  flex-direction: column;
  min-height: 100%;
22 23 24
  margin: 0;
}

25 26 27 28 29 30 31 32 33
a {
  color: @page-link-color;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

Emma's avatar
Emma committed
34 35 36 37 38 39 40
// Avoid having to deal with margin collapsing. This approach requires
// containers to have a top padding of 1rem for typographic elements to look
// good.
h1, h2, h3, h4, h5, h6, p, dl, ol, ul, blockquote {
  margin-top: 0;
  margin-bottom: 1rem;
}
Emma's avatar
Emma committed
41

Emma's avatar
Emma committed
42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59
// opinionated blockquote styling - should be safe?
blockquote {
  background-color: @blockquote-background-color;
  border-left: 1px inset @blockquote-border-color;
  margin: 0 0 0 0.5rem;
  padding: 0 0.5rem;

  & > * {
    @day-color: lighten(@page-color, 25%);
    @night-color: darken(@page-color, 25%);
    color: contrast(@page-color, @day-color, @night-color);
  }

  a {
    color: @page-color;
  }
}

Emma's avatar
Emma committed
60 61 62 63 64 65
ol ol,
ol ul,
ul ol,
ul ul {
  margin-bottom: 0;
}
66 67 68 69 70 71 72 73 74

button,
input,
optgroup,
option,
select,
textarea {
  font: inherit;
}
Emma's avatar
Emma committed
75 76 77 78

pre {
  overflow-x: auto;
}