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-radius: 6px;
 201     overflow: auto;
 202     padding: 4px;
 203 }
 204
 205 #statusbar #status-tag-info, #statusbar #status-subfield-info {
 206     float: left;
 207     overflow: hidden;
 208     padding-right: 2%;
 209     width: 48%;
 210 }
 211
 212 #record-info .label {
 213     float: none;
 214 }
 215
 216 #record-info .label + span {
 217     display: block;
 218     padding-left: 1em;
 219 }
 220
 221 /*> Search */
 222
 223 #advanced-search-ui .modal-lg, #search-results-ui .modal-lg, #macro-ui .modal-lg {
 224     width: 90%;
 225 }
 226
 227 .modal-body {
 228     max-height: none;
 229 }
 230
 231 .modal-lg .modal-body {
 232     overflow-y: auto;
 233 }
 234
 235 #quicksearch-overlay {
 236     background: rgba(255, 255, 255, .9);
 237     border: 2px solid #CC8877;
 238     border-radius: 5px;
 239     -moz-box-sizing: border-box;
 240     -webkit-box-sizing: border-box;
 241     box-sizing: border-box;
 242     color: #664444;
 243     position: relative;
 244     vertical-align: middle;
 245 }
 246
 247 #quicksearch-overlay h3 {
 248     font-size: 1.5em%;
 249     margin: 0;
 250     text-align: center;
 251     padding: 50px 5px;
 252 }
 253
 254 #quicksearch-overlay p {
 255     bottom: 0;
 256     font-size: .8em;
 257     overflow: hidden;
 258     padding: 8px 15px;
 259     position: absolute;
 260     text-align: center;
 261 }
 262
 263 #quicksearch input, #quicksearch a {
 264     font-size: 1.2em;
 265     padding: 3px 0;
 266     width: 96%; /* I have no idea why this is necessary */
 267 }
 268
 269 #show-advanced-search {
 270     display: block;
 271     margin-top: .3em;
 272 }
 273
 274 #advanced-search-fields {
 275     -moz-column-width: 26em;
 276     -webkit-column-width: 26em;
 277     column-width: 26em;
 278     margin: 0;
 279     padding: 0;
 280 }
 281
 282 #advanced-search-fields li {
 283     display: block;
 284     list-style-type: none;
 285 }
 286
 287 #advanced-search-fields label {
 288     display: inline-block;
 289     font-weight: bold;
 290     padding: 1em 1em 1em 0;
 291     width: 10em;
 292     text-align: right;
 293 }
 294
 295 #advanced-search-fields input {
 296     display: inline-block;
 297     margin: 0px auto;
 298     width: 14em;
 299 }
 300
 301
 302 /*> Search results */
 303
 304 #search-serversinfo li {
 305     list-style-type: none;
 306 }
 307
 308 #search-serversinfo .search-toggle-server {
 309     margin-right: 5px;
 310 }
 311
 312 #searchresults table {
 313     width: 100%;
 314 }
 315
 316 .sourcecol {
 317     width: 50px;
 318 }
 319
 320 .results-info {
 321     height: 100px;
 322     overflow: auto;
 323 }
 324
 325 .toolscol {
 326     padding: 0;
 327     width: 100px;
 328 }
 329
 330 .toolscol ul {
 331     margin: 0;
 332     padding: 0;
 333 }
 334
 335 #searchresults .toolscol li {
 336     list-style-type: none;
 337     list-style-image: none;
 338 }
 339
 340 .toolscol a {
 341     border-bottom: 1px solid #BCBCBC;
 342     display: block;
 343     padding: 0 1em;
 344     line-height: 24px;
 345 }
 346
 347 .marccol {
 348     font-family: monospace;
 349     height: auto;
 350     white-space: pre-wrap;
 351 }
 352
 353 #searchresults {
 354     position: relative;
 355 }
 356
 357 #search-overlay {
 358     background: white;
 359     bottom: 0;
 360     font-size: 2em;
 361     left: 0;
 362     opacity: .7;
 363     padding: 2em;
 364     position: absolute;
 365     right: 0;
 366     text-align: center;
 367     top: 0;
 368     z-index: 9001;
 369 }
 370
 371 /*> Macros */
 372 #macro-save-message {
 373     color: #666;
 374     font-size: 13px;
 375     float: right;
 376     line-height: 26px;
 377 }
 378
 379 #macro-list > li {
 380     border: 2px solid #F0F0F0;
 381     border-radius: 6px;
 382     display: block;
 383     font-size: 115%;
 384 }
 385
 386 #macro-list > li + li {
 387     margin-top: -2px;
 388 }
 389
 390 #macro-list .active {
 391     background: #EDF4F6;
 392     border-color: none;
 393 }
 394
 395 #macro-list a {
 396     display: block;
 397     padding: 6px;
 398 }
 399
 400 #macro-list a:focus {
 401     outline: none;
 402 }
 403
 404 .macro-info {
 405     background-color: #F4F4F4;
 406     display: none;
 407     margin: 0;
 408     padding: 10px;
 409     text-align: right;
 410 }
 411
 412 .macro-info li {
 413     color: #666;
 414     font-size: 75%;
 415     list-style-type: none;
 416 }
 417
 418 .macro-info .label {
 419     clear: left;
 420     font-weight: bold;
 421     float: left;
 422 }
 423
 424 #macro-list .active .macro-info {
 425     display: block;
 426 }
 427
 428 .btn-toolbar label, .btn-toolbar select {
 429     font-size: 13px;
 430     vertical-align: middle;
 431 }
 432
 433 .btn-toolbar label {
 434     margin-left: 1em;
 435 }
 436
 437 .btn-toolbar select {
 438     padding: 2px;
 439 }
 440
 441 #macro-editor {
 442     display: flex;
 443     flex-direction: column;
 444     height: 100%;
 445 }
 446
 447 #macro-editor .CodeMirror {
 448     flex: 1;
 449     font-size: 13px;
 450 }
 451
 452 /* Hotpatch from latest CodeMirror: Fix gutter positioning */
 453 .CodeMirror-gutter-wrapper {
 454     position: absolute;
 455 }
 456
 457 /* Small devices (tablets, 768px and up) */
 458 @media (min-width: @screen-sm-min) {
 459     #statusbar {
 460         border-bottom-style: none;
 461         border-radius: 6px 6px 0 0;
 462         margin-bottom: -32px;
 463     }
 464 }