app/Resources/static/themes/baggy/css/guide.scss

   1
   2 ::selection {
   3   color: #fff;
   4   background-color: #000;
   5 }
   6
   7 .desktopHide {
   8   display: none;
   9 }
  10
  11 .logo {
  12   position: fixed;
  13   z-index: 20;
  14   top: 0.4em;
  15   left: 0.6em;
  16 }
  17
  18 h2,
  19 h3,
  20 h4 {
  21   font-family: "PT Sans", sans-serif;
  22   text-transform: uppercase;
  23 }
  24
  25 p,
  26 li,
  27 label {
  28   color: #666;
  29 }
  30
  31 a {
  32   color: #000;
  33   font-weight: bold;
  34
  35   &.nostyle {
  36     text-decoration: none;
  37   }
  38
  39   &:hover,
  40   &:focus {
  41     text-decoration: none;
  42   }
  43 }
  44
  45 form fieldset {
  46   border: 0;
  47   padding: 0;
  48   margin: 0;
  49 }
  50
  51 form input[type="text"],
  52 form input[type="number"],
  53 select,
  54 form input[type="password"],
  55 form input[type="url"],
  56 form input[type="email"] {
  57   border: 1px solid #999;
  58   padding: 0.5em 1em;
  59   min-width: 12em;
  60   color: #666;
  61 }
  62
  63 @media screen and (-webkit-min-device-pixel-ratio: 0) {
  64   select {
  65     -webkit-appearance: none;
  66     border-radius: 0;
  67     background: #fff url("../../_global/img/bg-select.png") no-repeat right center;
  68   }
  69 }
  70
  71 .inline {
  72   .row {
  73     display: inline-block;
  74     margin-right: 0.5em;
  75   }
  76
  77   label {
  78     min-width: 6em;
  79   }
  80 }
  81
  82 fieldset label {
  83   display: inline-block;
  84   min-width: 12.5em;
  85   color: #666;
  86 }
  87
  88 label {
  89   margin-right: 0.5em;
  90 }
  91
  92 form .row {
  93   margin-bottom: 0.5em;
  94 }
  95
  96 form button,
  97 input[type="submit"] {
  98   cursor: pointer;
  99   background-color: #000;
 100   color: #fff;
 101   padding: 0.5em 1em;
 102   display: inline-block;
 103   border: 1px solid #000;
 104 }
 105
 106 form button:hover,
 107 form button:focus,
 108 input[type="submit"]:hover,
 109 input[type="submit"]:focus {
 110   background-color: #fff;
 111   color: #000;
 112   -webkit-transition: all 0.5s ease;
 113   -moz-transition: all 0.5s ease;
 114   -ms-transition: all 0.5s ease;
 115   -o-transition: all 0.5s ease;
 116   transition: all 0.5s ease;
 117 }
 118
 119 #bookmarklet {
 120   cursor: move;
 121 }
 122
 123 h2::after {
 124   content: "";
 125   height: 4px;
 126   width: 20%;
 127   background-color: #000;
 128   display: block;
 129 }
 130
 131 .links {
 132   padding: 0;
 133   margin: 0;
 134
 135   li {
 136     list-style: none;
 137     margin: 0;
 138     padding: 0;
 139   }
 140 }
 141
 142 #links {
 143   position: fixed;
 144   top: 0;
 145   width: 10em;
 146   left: 0;
 147   text-align: right;
 148   background-color: #333;
 149   padding-top: 9.5em;
 150   height: 100%;
 151   box-shadow: inset -4px 0 20px rgba(0, 0, 0, 0.6);
 152   z-index: 15;
 153
 154   > li > a {
 155     display: block;
 156     padding: 0.5em 2em 0.5em 1em;
 157     color: #fff;
 158     position: relative;
 159     text-transform: uppercase;
 160     text-decoration: none;
 161     font-weight: normal;
 162     font-family: "PT Sans", sans-serif;
 163     transition: all 0.5s ease;
 164
 165     &:hover,
 166     &:focus {
 167       background-color: #999;
 168       color: #000;
 169     }
 170   }
 171
 172   .current::after {
 173     content: "";
 174     width: 0;
 175     height: 0;
 176     position: absolute;
 177     border: 10px solid transparent;
 178     border-right-color: #eee;
 179     right: 0;
 180     top: 50%;
 181     margin-top: -10px;
 182   }
 183
 184   li:last-child {
 185     position: fixed;
 186     bottom: 1em;
 187     width: 10em;
 188
 189     a::before {
 190       font-size: 1.2em;
 191       position: relative;
 192       top: 2px;
 193     }
 194   }
 195 }
 196
 197 #main {
 198   margin-left: 12em;
 199   position: relative;
 200   z-index: 10;
 201   padding-right: 5%;
 202   padding-bottom: 1em;
 203 }
 204
 205 #sort {
 206   padding: 0;
 207   list-style-type: none;
 208   opacity: 0.5;
 209   display: inline-block;
 210
 211   li {
 212     display: inline;
 213     font-size: 0.9em;
 214
 215     & + li {
 216       margin-left: 10px;
 217     }
 218   }
 219
 220   a {
 221     padding: 2px 2px 0;
 222     vertical-align: middle;
 223   }
 224
 225   img {
 226     vertical-align: baseline;
 227
 228     :hover {
 229       cursor: pointer;
 230     }
 231   }
 232 }
 233
 234 #display-mode {
 235   float: right;
 236   margin-top: 10px;
 237   margin-bottom: 10px;
 238   opacity: 0.5;
 239 }
 240
 241 #listmode {
 242   width: 16px;
 243   display: inline-block;
 244   text-decoration: none;
 245
 246   &.tablemode {
 247     background: url("../../_global/img/table.png") no-repeat bottom;
 248   }
 249
 250   .listmode {
 251     background: url("../../_global/img/list.png") no-repeat bottom;
 252   }
 253 }
 254
 255 #warning_message {
 256   position: fixed;
 257   background-color: #ff6347;
 258   z-index: 1000;
 259   bottom: 0;
 260   left: 0;
 261   width: 100%;
 262   color: #000;
 263 }