git.r.bdr.sh - rbdr/grita/blob - views/style.less

   1 @text_color: #666;
   2 @background_color: #fff;
   3 @emphasis_color: #222;
   4 @light_color: #999;
   5 @lighter_color: #ccc;
   6 @border_color: #eee;
   7 @error_color: #ffebe8;
   8 @success_color: #f0fff0;
   9
  10 @font_stack: "Helvetica Neue", Helvetica, Arial, sans-serif;
  11
  12 *{
  13         margin: 0;
  14         padding: 0;
  15 }
  16
  17 img{
  18         border: 0;
  19 }
  20
  21 body{
  22         color: @text_color;
  23         background-color: @background_color;
  24         text-align: center;
  25         font-size: .625em;
  26         font-family: @font_stack;
  27 }
  28
  29 #wrapper{
  30         margin: 0 auto;
  31         width: 960px;
  32         text-align: left;
  33 }
  34
  35 #header #logo{
  36         background-image: url(/images/logo.png);
  37         background-repeat: no-repeat;
  38         width: 460px;
  39         height: 212px;
  40         display: block;
  41         margin: 10px 250px;
  42 }
  43
  44 #header #logomini{
  45         background-image: url(/images/logomini.png);
  46         background-repeat: no-repeat;
  47         width: 140px;
  48         height: 65px;
  49         display: block;
  50         margin: 10px 410px;
  51 }
  52
  53 #header #logo span, #header #logomini span{
  54         display: none;
  55 }
  56
  57 #header #description p{
  58         font-size: 1.4em;
  59         line-height: 1.8em;
  60         margin: 10px 170px;
  61         width: 620px;
  62         color: @light_color;
  63 }
  64
  65 #body h1{
  66         margin: 20px 90px;
  67         font-size: 2.4em;
  68         color: @emphasis_color;
  69 }
  70
  71 #body h2{
  72         margin: 20px 90px;
  73         font-size: 1.8em;
  74         color: @emphasis_color;
  75 }
  76
  77 #body h3{
  78         margin: 20px 90px;
  79         font-size: 1.6em;
  80         color: @emphasis_color;
  81 }
  82
  83 #body p{
  84         margin: 20px 90px;
  85         font-size: 1.6em;
  86         line-height: 2.4em;
  87         text-indent: 3em;
  88         text-align: justify;
  89 }
  90
  91 #body ul, #body ol{
  92         margin: 20px 90px;
  93         font-size: 1.4em;
  94         line-height: 1.8em;
  95 }
  96
  97 #body ul li p, #body ol li p{
  98         font-size: 1em;
  99         margin: 0;
 100         line-height: 1em;
 101         text-indent: 0;
 102 }
 103
 104 #body ul li, #body ol li{
 105         margin-left: 80px;
 106 }
 107
 108 #body blockquote{
 109         margin: 20px 170px;
 110         text-align: justify;
 111         border-left: 2px solid @border_color;
 112         padding-left: 5px;
 113 }
 114
 115 #body blockquote blockquote{
 116         margin: 10px;
 117 }
 118
 119 #body pre{
 120         margin: 20px 170px;
 121         border: 1px solid @lighter_color;
 122         background-color: @border_color;
 123         padding: 10px;
 124 }
 125
 126 #body pre code{
 127         font-size: 1.6em;
 128         line-height: 1.8em;
 129 }
 130
 131 #body blockquote p{
 132         margin: 5px 0;
 133         text-indent: 0;
 134         font-size: 1.4em;
 135         line-height: 1.8em;
 136 }
 137
 138 hr{
 139         margin: 10px;
 140         border: 0;
 141         border-bottom: 1px solid @border_color;
 142 }
 143
 144 #body #sharing{
 145         text-align: center;
 146 }
 147
 148 #body input.title, #body input.url{
 149         border: 1px solid @lighter_color;
 150         font-size: 1.6em;
 151         padding: 5px;
 152         margin: 0 90px;
 153         width: 770px;
 154 }
 155
 156 #body #sharing input.url{
 157         width: 290px;
 158         margin-bottom: 10px;
 159         margin-top: 10px;
 160 }
 161
 162 #body textarea.text{
 163         border: 1px solid @lighter_color;
 164         font-size: 1.6em;
 165         padding: 5px;
 166         margin: 0 90px;
 167         resize: vertical;
 168 }
 169
 170 #body input.submit{
 171         width: 150px;
 172         font-size: 4.8em;
 173         margin: 10px 410px;
 174         padding: 20px;
 175 }
 176
 177 #body #errors{
 178         -moz-border-radius: 5px;
 179         border-radius: 5px;
 180         -webkit-border-radius: 5px;
 181         padding: 10px;
 182         font-size: 1.4em;
 183         margin: 0 90px;
 184         width: 760px;
 185         background-color: @error_color;
 186 }
 187
 188 #body #success{
 189         -moz-border-radius: 5px;
 190         border-radius: 5px;
 191         -webkit-border-radius: 5px;
 192         padding: 10px;
 193         font-size: 1.4em;
 194         margin: 0 90px;
 195         width: 760px;
 196         background-color: @success_color;
 197 }
 198
 199 .tooltip{
 200         position: absolute;
 201         top: 0;
 202         left: 0;
 203         z-index: 3;
 204         display: none;
 205 }
 206
 207 #footer{
 208         height: 100px;
 209 }