koha-tmpl/intranet-tmpl/prog/css/cateditor.css

   1 /*> Infrastructure */
   2 body {
   3     padding: 0;
   4 }
   5
   6 #loading {
   7     background-color: #FFF;
   8     cursor: wait;
   9     height: 100%;
  10     left: 0;
  11     opacity: .7;
  12     position: fixed;
  13     top: 0;
  14     width: 100%;
  15     z-index: 1000;
  16 }
  17
  18 #loading div {
  19     background : transparent url(../img/loading.gif) top left no-repeat;
  20     font-size : 175%;
  21     font-weight: bold;
  22     height: 2em;
  23     left: 50%;
  24     margin: -1em 0 0 -2.5em;
  25     padding-left : 50px;
  26     position: absolute;
  27     top: 50%;
  28     width: 15em;
  29 }
  30
  31 #alerts-container {
  32     font-size: 12px;
  33 }
  34
  35 #alerts-container h3 {
  36     font-size: inherit;
  37 }
  38
  39 #alerts-container > ul {
  40     padding: 0;
  41 }
  42
  43 #alerts-container > ul > li {
  44     border-bottom: 1px solid #DDD;
  45     display: block;
  46     padding: 4px 0;
  47 }
  48
  49 #alerts-container > ul > li:first-child {
  50     padding-top: 0;
  51 }
  52
  53 #alerts-container > ul > li:last-child {
  54     border-bottom: none;
  55     padding-bottom: 0;
  56 }
  57
  58 .humanMsg.humanSuccess {
  59         left: 75%;
  60     width: 20%;
  61     top: 160px;
  62 }
  63
  64 #shortcuts-container {
  65     font-size: 12px;
  66 }
  67
  68 /*> MARC editor */
  69 #editor .CodeMirror {
  70     line-height: 1.2;
  71 }
  72
  73 .cm-tagnumber {
  74     color: #080;
  75     font-weight: bold;
  76 }
  77
  78 .cm-bad-tagnumber {
  79     color: #A20;
  80     font-weight: bold;
  81 }
  82
  83 .cm-indicator {
  84     color: #884;
  85 }
  86
  87 .cm-subfieldcode {
  88     background-color: #F4F4F4;
  89     color: #187848;
  90     border-radius: 3px;
  91     border-right: 2px solid white;
  92     font-weight: bold;
  93     padding-left: 3px;
  94     padding-right: 3px;
  95     margin-right: -2px;
  96 }
  97
  98 .cm-bad-subfieldcode {
  99     background-color: #FFD9D9;
 100     color: #482828;
 101     border-radius: 3px 8px 8px 3px;
 102     font-weight: bold;
 103 }
 104
 105 .cm-end-space {
 106     background-color: #DDDDBB;
 107 }
 108
 109 #editor .modified-line-gutter {
 110     width: 10px;
 111 }
 112
 113 #editor .modified-line {
 114     background: #F8F8F8;
 115     border-left: 5px solid black;
 116     margin-left: -10px;
 117     padding-left: 5px;
 118 }
 119
 120 #editor .CodeMirror-gutters {
 121     background: transparent;
 122     border-right: none;
 123 }
 124
 125 /*> MARC editor widgets */
 126
 127 #editor .subfield-widget {
 128     color: #538200;
 129     border: solid 2px #538200;
 130     border-radius: 6px;
 131     font-family: inherit;
 132     line-height: 2.75;
 133     margin: 3px 0;
 134     padding: 2px;
 135 }
 136
 137 #editor .subfield-widget button {
 138     font-family: inherit;
 139     font-size: inherit;
 140     height: 1.5em;
 141     line-height: 1em;
 142     margin-left: 5px;
 143     vertical-align: middle;
 144 }
 145
 146 #editor .subfield-widget select, #editor .subfield-widget input {
 147     height: 1.5em;
 148     vertical-align: middle;
 149 }
 150
 151 #editor .subfield-widget select:focus {
 152     outline: 2px #83A230 solid;
 153 }
 154
 155 #editor .fixed-widget input {
 156     width: 4em;
 157     padding: 0;
 158     border-radius: 2px;
 159     border-width: 1px;
 160 }
 161
 162 #editor .fixed-widget select {
 163     width: 3em;
 164 }
 165
 166 #editor .fixed-widget .material-select {
 167     width: 4.5em;
 168     margin-right: .5em;
 169 }
 170
 171 #editor .fixed-collapsed {
 172     display: inline-block;
 173     margin: 0 .25em;
 174     text-align: center;
 175     text-decoration: underline;
 176 }
 177
 178 #editor .hidden-widget {
 179     color: #999999;
 180     border: solid 2px #AAAAAA;
 181     line-height: 2;
 182     padding: 2px;
 183 }
 184
 185 .structure-error {
 186     background: #FFEEEE;
 187     font-size: 0.9em;
 188     line-height: 1.5;
 189     margin: .5em;
 190     padding: 0 .5em;
 191 }
 192
 193 .structure-error i {
 194     vertical-align: text-bottom;
 195 }
 196
 197 #statusbar {
 198     background-color: #F4F8F9;
 199     border: solid 2px #b9d8d9;
 200     border-bottom-style: none;
 201     border-radius: 6px 6px 0 0;
 202     margin-bottom: -32px;
 203     overflow: auto;
 204     padding: 4px;
 205     padding-bottom: 0;
 206 }
 207
 208 #statusbar #status-tag-info, #statusbar #status-subfield-info {
 209     float: left;
 210     overflow: hidden;
 211     padding-right: 2%;
 212     width: 48%;
 213 }
 214
 215 #record-info .label {
 216     float: none;
 217 }
 218
 219 #record-info .label + span {
 220     display: block;
 221     padding-left: 1em;
 222 }
 223
 224 /*> Search */
 225
 226 #advanced-search-ui .modal-lg, #search-results-ui .modal-lg, #macro-ui .modal-lg {
 227     width: 90%;
 228 }
 229
 230 .modal-body {
 231     max-height: none;
 232 }
 233
 234 .modal-lg .modal-body {
 235     overflow-y: auto;
 236 }
 237
 238 #quicksearch-overlay {
 239     background: rgba(255, 255, 255, .9);
 240     border: 2px solid #CC8877;
 241     border-radius: 5px;
 242     -moz-box-sizing: border-box;
 243     -webkit-box-sizing: border-box;
 244     box-sizing: border-box;
 245     color: #664444;
 246     position: relative;
 247     vertical-align: middle;
 248 }
 249
 250 #quicksearch-overlay h3 {
 251     font-size: 1.5em%;
 252     margin: 0;
 253     text-align: center;
 254     padding: 50px 5px;
 255 }
 256
 257 #quicksearch-overlay p {
 258     bottom: 0;
 259     font-size: .8em;
 260     overflow: hidden;
 261     padding: 8px 15px;
 262     position: absolute;
 263     text-align: center;
 264 }
 265
 266 #quicksearch input, #quicksearch a {
 267     font-size: 1.2em;
 268     padding: 3px 0;
 269     width: 96%; /* I have no idea why this is necessary */
 270 }
 271
 272 #show-advanced-search {
 273     display: block;
 274     margin-top: .3em;
 275 }
 276
 277 #advanced-search-fields {
 278     -moz-column-width: 26em;
 279     -webkit-column-width: 26em;
 280     column-width: 26em;
 281     margin: 0;
 282     padding: 0;
 283 }
 284
 285 #advanced-search-fields li {
 286     display: block;
 287     list-style-type: none;
 288 }
 289
 290 #advanced-search-fields label {
 291     display: inline-block;
 292     font-weight: bold;
 293     padding: 1em 1em 1em 0;
 294     width: 10em;
 295     text-align: right;
 296 }
 297
 298 #advanced-search-fields input {
 299     display: inline-block;
 300     margin: 0px auto;
 301     width: 14em;
 302 }
 303
 304
 305 /*> Search results */
 306
 307 #search-serversinfo li {
 308     list-style-type: none;
 309 }
 310
 311 #search-serversinfo .search-toggle-server {
 312     margin-right: 5px;
 313 }
 314
 315 #searchresults table {
 316     width: 100%;
 317 }
 318
 319 .sourcecol {
 320     width: 50px;
 321 }
 322
 323 .results-info {
 324     height: 100px;
 325     overflow: auto;
 326 }
 327
 328 .toolscol {
 329     padding: 0;
 330     width: 100px;
 331 }
 332
 333 .toolscol ul {
 334     margin: 0;
 335     padding: 0;
 336 }
 337
 338 #searchresults .toolscol li {
 339     list-style-type: none;
 340     list-style-image: none;
 341 }
 342
 343 .toolscol a {
 344     border-bottom: 1px solid #BCBCBC;
 345     display: block;
 346     padding: 0 1em;
 347     line-height: 24px;
 348 }
 349
 350 .marccol {
 351     font-family: monospace;
 352     height: auto;
 353     white-space: pre-wrap;
 354 }
 355
 356 #searchresults {
 357     position: relative;
 358 }
 359
 360 #search-overlay {
 361     background: white;
 362     bottom: 0;
 363     font-size: 2em;
 364     left: 0;
 365     opacity: .7;
 366     padding: 2em;
 367     position: absolute;
 368     right: 0;
 369     text-align: center;
 370     top: 0;
 371     z-index: 9001;
 372 }
 373
 374 /*> Macros */
 375 #macro-save-message {
 376     color: #666;
 377     font-size: 13px;
 378     float: right;
 379     line-height: 26px;
 380 }
 381
 382 #macro-list > li {
 383     border: 2px solid #F0F0F0;
 384     border-radius: 6px;
 385     display: block;
 386     font-size: 115%;
 387 }
 388
 389 #macro-list > li + li {
 390     margin-top: -2px;
 391 }
 392
 393 #macro-list .active {
 394     background: #EDF4F6;
 395     border-color: none;
 396 }
 397
 398 #macro-list a {
 399     display: block;
 400     padding: 6px;
 401 }
 402
 403 #macro-list a:focus {
 404     outline: none;
 405 }
 406
 407 .macro-info {
 408     background-color: #F4F4F4;
 409     display: none;
 410     margin: 0;
 411     padding: 10px;
 412     text-align: right;
 413 }
 414
 415 .macro-info li {
 416     color: #666;
 417     font-size: 75%;
 418     list-style-type: none;
 419 }
 420
 421 .macro-info .label {
 422     clear: left;
 423     font-weight: bold;
 424     float: left;
 425 }
 426
 427 #macro-list .active .macro-info {
 428     display: block;
 429 }
 430
 431 .btn-toolbar label, .btn-toolbar select {
 432     font-size: 13px;
 433     vertical-align: middle;
 434 }
 435
 436 .btn-toolbar label {
 437     margin-left: 1em;
 438 }
 439
 440 .btn-toolbar select {
 441     padding: 2px;
 442 }
 443
 444 #macro-editor {
 445     display: flex;
 446     flex-direction: column;
 447     height: 100%;
 448 }
 449
 450 #macro-editor .CodeMirror {
 451     flex: 1;
 452     font-size: 13px;
 453 }
 454
 455 /* Hotpatch from latest CodeMirror: Fix gutter positioning */
 456 .CodeMirror-gutter-wrapper {
 457     position: absolute;
 458 }