project/static/css/master.css

   1 body {
   2     margin: 0;
   3     font: 10pt Helvetica, Verdana, sans-serif;
   4     overflow: hidden;
   5     background: #AAA;
   6 }
   7
   8 #header {
   9     position: absolute;
  10     padding: 0.2em 0.5em;
  11     background-color: #CDCDCD;
  12         border-bottom: 0.1px solid black;
  13         height: 1.8em;
  14         line-height: 1.8em;
  15         vertical-align: center;
  16
  17     top: 0px; left: 0px; right: 0px;
  18     z-index: 300;
  19 }
  20
  21 #header #breadcrumbs {
  22 }
  23
  24 #header-right-toolbar {
  25         position: absolute;
  26         right: 1em;
  27 }
  28
  29 #header button {
  30         vertical-align: center;
  31 }
  32
  33 #content {
  34     position: absolute;
  35     top: 2.4em; left: 0px; right: 0px; bottom: 0px;
  36     overflow: auto;
  37     background-color: white;
  38 }
  39
  40 ul {
  41     margin: 20px;
  42     padding: 0;
  43 }
  44
  45 li {
  46     margin: 0;
  47     padding: 0;
  48     list-style: none;
  49 }
  50
  51 a {
  52     text-decoration: none;
  53 }
  54
  55 a:hover {
  56     text-decoration: underline;
  57 }
  58
  59 li a {
  60     display: block;
  61     padding: 5px 20px;
  62     width: 480px;
  63 }
  64
  65 li a:hover {
  66     background-color: #BCD6E9;
  67 }
  68
  69 #tabs {
  70     border-bottom: 1px solid #858585;
  71     background-color: #B7B7B7;
  72 }
  73
  74 #tabs a {
  75     display: block;
  76     border-right: 1px solid #858585;
  77     float: left;
  78     padding: 5px 10px;
  79 }
  80
  81 #tabs a.active {
  82     background-color: #909090;
  83 }
  84
  85 .theme-begin {
  86     display: none;
  87 }
  88
  89 label {
  90     display: block;
  91 }
  92
  93 #text_id {
  94     width: 480px;
  95     height: 480px;
  96 }
  97
  98 #file-text {
  99     padding: 5px 10px;
 100     overflow-x: hidden;
 101     overflow-y: scroll;
 102 }
 103
 104 /* ========== */
 105 /* = Panels = */
 106 /* ========== */
 107
 108 #panels {
 109         position: absolute;
 110         bottom: 0px; left: 0px; right: 0px; top: 0px;
 111 }
 112
 113 .panel-wrap {
 114     overflow: hidden;
 115         position: absolute; /* absolute to relation with #panels */
 116         top: 0px;
 117         bottom: 0px;
 118 }
 119
 120 #left-panel-wrap {
 121         left: 0px;
 122         width: 8px; /* initial width */
 123 }
 124
 125 #right-panel-wrap {
 126         right: 0px;
 127         width: auto;
 128         left: 8px; /* initial width of the left panel */
 129 }
 130
 131 /* contents */
 132 .panel-content {
 133         position: absolute;
 134         overflow: auto;
 135         overflow-x: hidden;
 136         top: 22px; left: 0px; bottom:0px; right: 0px;
 137 }
 138
 139 .panel-overlay {
 140         position: absolute;
 141         top: 0px; bottom: 0px; left: 0px; right: 0px;
 142         z-index: 100;
 143         background: gray;
 144         opacity: 0.8;
 145         text-align: center;
 146         overflow: hidden;
 147         display: none;
 148         cursor: col-resize;
 149 }
 150
 151 .panel-content-overlay {
 152 }
 153
 154 .panel-wrap.last-panel .panel-content {
 155         right: 0px;
 156 }
 157
 158 .panel-wrap.last-panel .panel-slider {
 159     display: none;
 160 }
 161
 162 /* Toolbars with select box to change panel contents*/
 163 .panel-toolbar {
 164     position: absolute;
 165     top: 0px; left:0px; right: 0px; height: 20px;
 166
 167     padding: 0 0 2px 0;
 168     /* border-top: 1px solid #AAA; */
 169     border-bottom: 1px solid #AAA;
 170     font-size: 12px;
 171     line-height: 20px;
 172     background-color: #DDD;
 173     white-space: nowrap;
 174     overflow: hidden;
 175     z-index: 80;
 176 }
 177
 178 .panel-toolbar label {
 179     display: block;
 180     float: left;
 181     margin: 0 10px 0 2px;
 182 }
 183
 184 /* Slider between panels */
 185 .panel-wrap .panel-slider {
 186     position: absolute;
 187         background-color: #DDD;
 188
 189     top: 0px; bottom: 0px; right: 0px; width: 4px;
 190
 191     border-left: 1px solid #999;
 192     border-right: 1px solid #999;
 193     border-top: none;
 194     border-bottom: none;
 195
 196         z-index: 90;
 197         cursor: col-resize;
 198 }
 199
 200 .panel-wrap .panel-slider:hover {
 201     background-color: #999;
 202 }
 203
 204 .panel-content-overlay.panel-wrap .panel-slider {
 205         background-color: #DDD;
 206 }
 207
 208
 209 /* ================= */
 210 /* = Gallery panel = */
 211 /* ================= */
 212 .images-wrap {
 213     overflow-x: hidden;
 214     overflow-y: scroll;
 215 }
 216
 217
 218 /* ==================== */
 219 /* = XML Editor panel = */
 220 /* ==================== */
 221
 222 .toolbar {
 223     overflow: hidden;
 224     z-index: 70;
 225 }
 226
 227 .toolbar, .toolbar ol {
 228 /*    overflow: hidden;*/
 229     display: block;
 230     margin: 0;
 231     padding: 0;
 232     background-color: #CCC;
 233     border-top: 1px solid #AAA;
 234 }
 235
 236 .toolbar-tabs li {
 237     font-size: 14px;
 238     display: block;
 239     float: left;
 240     margin: 4px 0 -1px 4px;
 241     padding: 2px 10px 0 10px;
 242     background-color: #CCC;
 243     border: 1px solid #AAA;
 244     border-radius-topleft: 8px;
 245     border-radius-topright: 8px;
 246     -moz-border-radius-topleft: 8px;
 247     -moz-border-radius-topright: 8px;
 248     -webkit-border-top-left-radius: 8px;
 249     -webkit-border-top-right-radius: 8px;
 250 }
 251
 252 .toolbar-tabs {
 253     height: 21px;
 254 }
 255
 256 .toolbar-tabs li:hover, .toolbar-tabs li.active {
 257     cursor: default;
 258     background-color: #EEE;
 259     border-bottom: 1px solid #EEE;
 260 }
 261
 262 .toolbar-buttons {
 263     background-color: #EEE;
 264     border-bottom: 1px solid #AAA;
 265     z-index: 71;
 266 }
 267
 268 .toolbar-buttons li {
 269     display: block;
 270     font-size: 12px;
 271     padding: 1px 8px;
 272     margin: 4px;
 273     border-radius: 10px;
 274     -moz-border-radius: 10px;
 275     -webkit-border-radius: 8px;
 276     float: left;
 277 }
 278
 279 .toolbar-buttons li:hover {
 280     background-color: #777;
 281     color: #FFF;
 282     cursor: default;
 283 }
 284
 285 .change-font-size {
 286     width: 45px;
 287     height: 18px;
 288     padding: 3px 0 0;
 289     position: absolute;
 290     top: 0;
 291     right: 0;
 292 }
 293
 294 .change-font-size div {
 295     float: left;
 296     text-align: center;
 297     width: 20px;
 298     font-size: 13px;
 299     margin: 1px;
 300     cursor: default;
 301     border-radius: 2px;
 302     -moz-border-radius: 2px;
 303     -webkit-border-radius: 2px;
 304 }
 305
 306 .change-font-size div:hover {
 307     background-color: #EEE;
 308     border: 1px solid #AAA;
 309     margin: 0;
 310 }
 311
 312 /* =========================== */
 313 /* = DublinCore Editor panel = */
 314 /* =========================== */
 315 .panel-dceditor {
 316     padding: 10px;
 317 }
 318
 319 .panel-dceditor label {
 320     display: block;
 321     font-size: 12px;
 322     margin-top: 10px;
 323     color: #666;
 324     font-weight: bold;
 325 }
 326
 327 .panel-dceditor input, .panel-dceditor textarea {
 328     width: 400px;
 329     display: block;
 330 }
 331
 332 div.isection {
 333         margin: 1em auto;
 334         border: 1px solid black;
 335         padding: 0.5em 2em;
 336         background: #9f9ffa;
 337
 338         width: 60%;
 339 }
 340
 341 div.isection p {
 342         margin: 0.5em 1em;
 343 }
 344
 345 .change-notification {
 346     color: red;
 347 }
 348
 349 /*
 350  * Popups
 351  */
 352 #message-box {
 353     position: fixed;
 354     top: 2px;
 355     left: 40%;
 356 }
 357
 358 .msg-error, .msg-success, .msg-warning {
 359     overflow: hidden;
 360     padding: 0.1em 0.2em;
 361     text-align: center;
 362     border: 1px solid;
 363     -moz-border-radius: 8px;
 364     -webkit-border-radius: 8px;
 365     font-size: 10pt;
 366     line-height: 11pt;
 367     display: none;
 368
 369     width: 200px;
 370 }
 371
 372
 373 .msg-error {
 374     background-color: red;
 375     border-color: red;
 376 }
 377
 378 .msg-success {
 379     background-color: lightgreen;
 380     border-color: lightgreen;
 381 }
 382
 383 .msg-warning {
 384     background-color: yellow;
 385     border-color: yellow;
 386
 387 }