git.plutz.net Git - bookman/blob - bookmarks.css

   1 * { /* RESET */
   2   font-size: medium;
   3   margin: 0;
   4   padding: 0;
   5   text-decoration: none;
   6   font-weight: normal;
   7   color: black;
   8   background-color: white;
   9   box-sizing: border-box;
  10 }
  11
  12 html, body {
  13   background-color: #DDD;
  14 }
  15
  16 .folder, form.newfolder{
  17   display: block;
  18   width: 98%;
  19   border: 1px solid black;
  20   border-radius: .5em;
  21   margin: 1em auto;
  22   padding: 0;
  23   overflow: hidden;
  24 }
  25
  26 .folder > h1 {
  27   font-size: 1.25em;
  28   font-weight: bold;
  29   padding: .125em 1em .125em 2em;
  30   border-bottom: 1px solid black;
  31   background-color: #ACF;
  32   border-radius: .375em .375em 0 0;
  33   min-height: 1em;
  34 }
  35 .folder > h1 + a {
  36   display: block;
  37   position: relative;
  38   top: -1.5em;
  39   margin-left: 1em;
  40   color: transparent;
  41   width: 0; height: 0;
  42 }
  43 .folder > h1 + a:before {
  44   content: '\2699';
  45   color: #333;
  46 }
  47
  48 .dialog {
  49   display: block;
  50   position: fixed;
  51   width: 30em;
  52   min-width: 240px;
  53   min-height: 3em;
  54   left: 50%; top: 20%;
  55   margin: -3em -15em;
  56   text-align: center;
  57   z-index: 10;
  58   border-radius: .5em;
  59   border: 1px solid black;
  60   padding: .125em 0;
  61   background-color: #ACF;
  62   word-spacing: -.5ex;
  63 }
  64 .dialog:before {
  65   display: block;
  66   content: '';
  67   border: 1px solid black;
  68   border-radius: 0 0 .5em .5em;
  69   border-top: 0px;
  70   top: 1.75em; bottom: .125em; left: .5%; right: .5%;
  71   position: absolute;
  72   background-color: white;
  73   z-index: -1;
  74 }
  75 .newbookmark:before { border-top: 1px solid; }
  76 .dialog + *:after {
  77   content: ' ';
  78   position: fixed;
  79   top: 0; bottom: 0; left: 0; right: 0;
  80   background-color: rgba(0,0,0,.5);
  81 }
  82 .dialog > * { word-spacing: 0; }
  83
  84 .dialog > h1 {
  85   background-color: transparent;
  86   text-align: left;
  87   font-weight: bold;
  88   padding-left: .25em;
  89 }
  90
  91 .dialog > .tab {
  92   display: inline-block;
  93   width: 33%;
  94   padding: .25em;
  95   border: 1px solid black;
  96   border-radius: .5em .5em 0 0;
  97 }
  98 .dialog.modbookmark > .tab {
  99   width: 49.5%;
 100 }
 101 .dialog > label.tab { border-bottom: 0px; }
 102 .dialog > a.tab { background-color: #EEE; }
 103
 104 .newbookmark > label,
 105 .dialog > label:nth-of-type(2),
 106 .dialog > label:nth-of-type(3),
 107 .dialog > select,
 108 .modfolder > input {
 109   display: block;
 110   float: left;
 111   text-align: left;
 112   margin: 1em 0 0 1em;
 113 }
 114 .newbookmark > label,
 115 .dialog > label:nth-of-type(3),
 116 .dialog > label:nth-of-type(2) {
 117   clear: left;
 118   font-weight: bold;
 119 }
 120 .dialog > select {
 121   width: 10em;
 122   max-width: 95%;
 123 }
 124 .dialog > input {
 125   width: 28em;
 126   max-width: 95%;
 127 }
 128 .modbookmark > select,
 129 .dialog > button {
 130   display: inline-block;
 131   float: right;
 132   margin: 1.5em .5em .5em .5em;
 133   padding: 0 .5em;
 134   clear: left;
 135 }
 136
 137 .bookmark {
 138   position: relative;
 139   width: 16em;
 140   display: inline-block;
 141   margin: .5em 1em;
 142   white-space: nowrap;
 143 }
 144
 145 .bookmark > a.modify {
 146   display: inline-block;
 147   color: transparent;
 148   width: .75em;
 149 }
 150 .bookmark > a.modify:before {
 151   content: '\2699';
 152   color: #333;
 153 }
 154 .bookmark > a.bmove {
 155   display: none;
 156   color: transparent;
 157   overflow: hidden;
 158   vertical-align: top;
 159   font-size: 0;
 160 }
 161 .bookmark:hover { left: -1em; padding-left: 1em; }
 162 .bookmark:hover > a.bmove { display: inline-block; }
 163 .bookmark > a.bmove:before { color: #888; font-size: medium; }
 164 .bookmark > a.bmove:nth-last-of-type(2) { position: absolute; left: 0; }
 165 .bookmark > a.bmove:nth-last-of-type(2):before { content: '\25c0'; }
 166 .bookmark > a.bmove:nth-last-of-type(1):before { content: '\25b6'; }
 167
 168 .bookmark img {
 169   height: 1.25em;
 170   vertical-align: text-bottom;
 171   margin: 0 .5ex;
 172 }
 173