git.plutz.net Git - serve0/blob - style.css

   1 * {
   2   box-sizing: border-box;
   3   margin: 0; padding: 0;
   4 }
   5 button { padding: .125em .5em; }
   6 a { color: inherit; text-decoration: none;}
   7
   8 body {
   9   position: relative;
  10   color: white;
  11   background-color: black;
  12 }
  13
  14 #prefs, #bookmarks {
  15   display: block;
  16   overflow: hidden;
  17   height: 0;
  18 }
  19 #prefs:target,
  20 #bookmarks:target {
  21   height: auto;
  22 }
  23
  24 #navigation{
  25   text-align: center;
  26   background-color: #333;
  27   padding: .25em;
  28   border-bottom: 1px solid;
  29 }
  30
  31 #search { display: inline; }
  32
  33 a[href="#prefs"] {
  34   position: absolute;
  35   top: 0; right: .25em;
  36   font-size: 1.5em;
  37 }
  38
  39 a[href="#bookmarks"] {
  40   position: absolute;
  41   top: 0; left: .25em;
  42   font-size: 1.5em;
  43 }
  44
  45 a[href="#advsearch"] {
  46   margin-left: .5em;
  47 }
  48 a[href="#advsearch"]:before {
  49   content: '\25b8';
  50   margin: 0 .5em;
  51 }
  52
  53 #prefs:target {
  54   position: absolute;
  55   right: 0; width: 13em;
  56   margin-left: auto;
  57   margin-top: -1px;
  58   background-color: #333;
  59   border: 1px solid;
  60   border-top: none;
  61   border-right: none;
  62   padding: .5em 1em;
  63   z-index: 1;
  64   overflow: visible;
  65 }
  66
  67 #prefs:target a[href="#"] {
  68   position: absolute;
  69   right: .25em; margin-top: -1.5em;
  70   font-size: 1.5em;
  71   padding: 0 .25em;
  72   background-color: #333;
  73   z-index: 1;
  74 }
  75
  76 #prefs label[for=prefs_ps] {
  77   font-weight: bold;
  78 }
  79 #prefs #prefs_ps {
  80   max-width: 3em;
  81   margin-bottom: 1em;
  82 }
  83 #prefs button {
  84   margin-top: 1em;
  85 }
  86 #prefs input { vertical-align: top; }
  87 #prefs input[type=radio] + label,
  88 #prefs input[type=checkbox] + label {
  89   display: inline-block;
  90   margin-bottom: .5em;
  91   max-width: 85%;
  92 }
  93
  94 .itemlist { display: block; overflow: hidden; }
  95 .list {
  96   position: relative;
  97   display: inline-block;
  98   width: 25%;
  99   min-width: 250px;
 100   padding: .25em;
 101   overflow: none;
 102   word-wrap: break-word;
 103   vertical-align: top;
 104   color: black;
 105 }
 106 .list.dir {
 107   padding: .5em 1em;
 108 }
 109
 110 .list:before {
 111   position: absolute;
 112   top: .25em; left: .25em;
 113   bottom: .25em; right: .25em;
 114   z-index: -2;
 115   content: '';
 116 }
 117 .list.dir:before { background-color: #CCF; }
 118 .list.file:before { background-color: #FDD; }
 119 .list.file:first-of-type { clear: left; }
 120
 121 .list.file a img{
 122   display: block;
 123   width: 100%;
 124   min-height: 4em;
 125 }
 126 .list.file a label{
 127   position: absolute;
 128   top: 0; padding: .25em .5em;
 129   color: white;
 130   background-color: rgba(0,0,0,.625);
 131 }
 132
 133 .list.file .time,
 134 .list.file .dim {
 135   color: white;
 136   background-color: #004;
 137   padding: .125em .5em;
 138 }
 139
 140 .pagination {
 141   display: block;
 142   text-align: center;
 143   margin-top: 1em;
 144 }
 145 .page {
 146   display: inline-block;
 147   padding: .25em .5em;
 148   color: black;
 149   background-color: #FDD;
 150   border: 1px solid;
 151   margin: 0 .125em;
 152 }
 153
 154 #editing {
 155   width: 100%; bottom: 0;
 156   background-color: #333;
 157   border-top: 1px solid;
 158   padding: .25em;
 159 }
 160
 161 #index label:first-of-type { font-weight: bold; }
 162 #index input, #index button { margin-left: 1em;}