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