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