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