static/style.css

   1 html {
   2     font-family: Avenir, Montserrat, Corbel, 'URW Gothic', source-sans-pro, sans-serif;
   3 }
   4
   5 body {
   6     padding: 0;
   7     margin: 0;
   8 }
   9
  10 a {
  11     text-decoration: none;
  12 }
  13
  14 blockquote {
  15     margin: 0;
  16     margin-left: 1em;
  17     padding-left: 1em;
  18     border-left: 2px solid gray;
  19 }
  20
  21 div.topbar {
  22     background-color: darkred;
  23     color: white;
  24     border-bottom: 1px solid pink;
  25     display: flex;
  26     justify-content: space-between;
  27     align-items: center;
  28 }
  29
  30 div.topbar a {
  31     color: inherit;
  32     text-decoration: none;
  33 }
  34
  35 div.topbar div.sitename {
  36     font-size: 2em;
  37     padding: 0.5em;
  38 }
  39
  40 div.topbar div.sitename > span.subtitle {
  41     font-size: medium;
  42 }
  43
  44 div.topbar > div.sort {
  45     display: flex;
  46     padding-right: 0.5em;
  47 }
  48
  49 div.topbar > div.sort > div {
  50     margin: 0.5em;
  51     padding: 0.5em;
  52 }
  53
  54 div.topbar > div.sort > div.active {
  55     border: 1px solid white;
  56 }
  57
  58 div.topbar > form {
  59     width: 20em;
  60 }
  61
  62 div.topbar > form input {
  63     width: 100%;
  64     background-color: inherit;
  65     color: inherit;
  66     border: 1px solid white;
  67     border-radius: 2px;
  68     padding: 1em;
  69 }
  70
  71 div.submissionList {
  72     display: flex;
  73     flex-direction: column;
  74     padding: 1em;
  75 }
  76
  77 div.submissionItem {
  78     display: flex;
  79     flex-direction: row;
  80     margin-bottom: 1em;
  81 }
  82
  83 div.thread {
  84     display: flex;
  85     flex-direction: column;
  86 }
  87
  88 div.submission {
  89     display: flex;
  90     flex-direction: column;
  91     padding: 0.5em;
  92 }
  93
  94 div.submission div.body {
  95     background-color: #fafafa;
  96     border: 1px solid darkred;
  97     border-radius: 7px;
  98     width: 75%;
  99 }
 100
 101 div.submission div.submissionInfo {
 102     width: 100%;
 103     margin-left: 2em;
 104 }
 105
 106 div.submission div.submissionContent {
 107     display: flex;
 108     padding: 1em;
 109 }
 110
 111 div.submission div.submissionContent > div.body {
 112     padding: 1em;
 113 }
 114
 115 div.score {
 116     padding: 1em;
 117     font-size: small;
 118     font-weight: bold;
 119     text-align: center;
 120     color: darkgray;
 121 }
 122
 123 div.title {
 124     font-weight: bold;
 125     font-size: 16px;
 126 }
 127
 128 div.subtitle {
 129     color: #888;
 130     font-size: x-small;
 131 }
 132
 133 div.subtitle a {
 134     color: #888;
 135     font-weight: bold;
 136 }
 137
 138 div.comments {
 139     border-top: 1px solid gray;
 140 }
 141
 142 div.comment {
 143     display: flex;
 144     flex-direction: column;
 145     margin-left: 2em;
 146     margin-top: 0.5em;
 147     margin-bottom: 0.5em;
 148 }
 149
 150 div.body {
 151     margin-left: 1em;
 152     margin-right: 1em;
 153 }
 154
 155 div.metadata {
 156     font-size: small;
 157     color: #888;
 158 }
 159
 160 div.pagination {
 161     margin: 1em;
 162 }
 163
 164 .flair {
 165     font-size: small;
 166     overflow: hidden;
 167     white-space: nowrap;
 168     display: inline-block;
 169     background-color: #f5f5f5;
 170     color: #555;
 171     border: 1px solid #ddd;
 172     border-radius: 2px;
 173     font-weight: normal;
 174 }
 175
 176 div.thread .flair {
 177     max-width: 10em;
 178     text-overflow: ellipsis;
 179     margin-right: 0.5em;
 180 }
 181
 182 span.author {
 183     color: darkred;
 184     font-weight: bold;
 185 }
 186
 187 span.url {
 188     font-size: x-small;
 189     color: #555;
 190 }
 191
 192 span.url a {
 193     color: #555;
 194 }
 195
 196 span.truncate {
 197     max-width: 5em;
 198     text-overflow: ellipsis;
 199 }
 200
 201 #searchResults > div.loading {
 202     padding: 1em;
 203 }