Koha/koha-tmpl/intranet-tmpl/prog/css/cateditor.css
Owen Leonard 8e473cb69a Bug 34567: Correct colors for advanced cataloging editor status bar
This patch updates the advanced cataloging editor CSS so that the
"status bar" footer below the editor has colors consistent with the
staff interface redesign.

To test, apply the patch and clear your browser cache if necessary.

- Enable the EnableAdvancedCatalogingEditor preference if necessary.
- Go to Cataloging -> Advanced editor.
- At the bottom of the screen below the editor the "status bar" should
  have a green border that matches color in the header search bar.

Signed-off-by: Chris Cormack <chris@bigballofwax.co.nz>
Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
(cherry picked from commit 3ed9168315)
Signed-off-by: Fridolin Somers <fridolin.somers@biblibre.com>
2023-08-30 09:57:55 -10:00

480 lines
7.5 KiB
CSS

/*> Infrastructure */
body {
padding: 0;
}
#loading {
background-color: #FFF;
cursor: wait;
height: 100%;
left: 0;
opacity: .7;
position: fixed;
top: 0;
width: 100%;
z-index: 1000;
}
#loading div {
background : transparent url(../img/loading.gif) top left no-repeat;
font-size : 175%;
font-weight: bold;
height: 2em;
left: 50%;
margin: -1em 0 0 -2.5em;
padding-left : 50px;
position: absolute;
top: 50%;
width: 15em;
}
#alerts-container {
font-size: 12px;
}
#alerts-container h3 {
font-size: inherit;
}
#alerts-container > ul {
padding: 0;
}
#alerts-container > ul > li {
border-bottom: 1px solid #DDD;
display: block;
padding: 4px 0;
}
#alerts-container > ul > li:first-child {
padding-top: 0;
}
#alerts-container > ul > li:last-child {
border-bottom: none;
padding-bottom: 0;
}
.humanMsg.humanSuccess {
left: 75%;
width: 20%;
top: 160px;
}
#shortcuts-container {
font-size: 12px;
}
/*> MARC editor */
#editor .CodeMirror {
line-height: 1.2;
}
.cm-tagnumber {
color: #080;
font-weight: bold;
}
.cm-bad-tagnumber {
color: #A20;
font-weight: bold;
}
.cm-indicator {
color: #884;
}
.cm-subfieldcode {
background-color: #F4F4F4;
color: #187848;
border-radius: 3px;
border-right: 2px solid white;
font-weight: bold;
padding-left: 3px;
padding-right: 3px;
margin-right: -2px;
}
.cm-bad-subfieldcode {
background-color: #FFD9D9;
color: #482828;
border-radius: 3px 8px 8px 3px;
font-weight: bold;
}
.cm-end-space {
background-color: #DDDDBB;
}
.cm-double-space {
border-bottom: 2px dotted #CC3333;
}
#editor .modified-line-gutter {
width: 10px;
}
#editor .modified-line {
background: #F8F8F8;
border-left: 5px solid black;
margin-left: -10px;
padding-left: 5px;
}
#editor .CodeMirror-gutters {
background: transparent;
border-right: none;
}
/*> MARC editor widgets */
#editor .subfield-widget {
color: #538200;
border: solid 2px #538200;
border-radius: 6px;
font-family: inherit;
line-height: 2.75;
margin: 3px 0;
padding: 2px;
}
#editor .subfield-widget button {
font-family: inherit;
font-size: inherit;
height: 1.5em;
line-height: 1em;
margin-left: 5px;
vertical-align: middle;
}
#editor .subfield-widget select, #editor .subfield-widget input {
height: 1.5em;
vertical-align: middle;
}
#editor .subfield-widget select:focus {
outline: 2px #83A230 solid;
}
#editor .fixed-widget input {
width: 4em;
padding: 0;
border-radius: 2px;
border-width: 1px;
}
#editor .fixed-widget select {
width: 3em;
}
#editor .fixed-widget .material-select {
width: 4.5em;
margin-right: .5em;
}
#editor .fixed-collapsed {
display: inline-block;
margin: 0 .25em;
text-align: center;
text-decoration: underline;
}
#editor .hidden-widget {
color: #999999;
border: solid 2px #AAAAAA;
line-height: 2;
padding: 2px;
}
.structure-error {
background: #FFEEEE;
font-size: 0.9em;
line-height: 1.5;
margin: .5em;
padding: 0 .5em;
}
.structure-error i {
vertical-align: text-bottom;
}
#statusbar {
background-color: #EEE;
border: solid 2px #6FAF44;
border-radius: 6px;
overflow: auto;
padding: 4px;
}
#statusbar #status-tag-info, #statusbar #status-subfield-info {
float: left;
overflow: hidden;
padding-right: 2%;
width: 48%;
}
#record-info .label {
float: none;
}
#record-info .label + span {
display: block;
padding-left: 1em;
}
/*> Search */
#advanced-search-ui .modal-lg, #search-results-ui .modal-lg, #macro-ui .modal-lg {
width: 90%;
}
.modal-body {
max-height: none;
}
.modal-lg .modal-body {
overflow-y: auto;
}
#quicksearch-overlay {
background: rgba(255, 255, 255, .9);
border: 2px solid #CC8877;
border-radius: 5px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #664444;
position: relative;
vertical-align: middle;
}
#quicksearch-overlay h3 {
font-size: 1.5em%;
margin: 0;
text-align: center;
padding: 50px 5px;
}
#quicksearch-overlay p {
bottom: 0;
font-size: .8em;
overflow: hidden;
padding: 8px 15px;
position: absolute;
text-align: center;
}
#quicksearch input, #quicksearch a {
font-size: 1.2em;
padding: 3px 0;
width: 96%; /* I have no idea why this is necessary */
}
#show-advanced-search {
display: block;
margin-top: .3em;
}
#advanced-search-fields {
-moz-column-width: 26em;
-webkit-column-width: 26em;
column-width: 26em;
margin: 0;
padding: 0;
}
#advanced-search-fields li {
display: block;
list-style-type: none;
}
#advanced-search-fields label {
display: inline-block;
font-weight: bold;
padding: 1em 1em 1em 0;
width: 10em;
text-align: right;
}
#advanced-search-fields input {
display: inline-block;
margin: 0px auto;
width: 14em;
}
/*> Search results */
#search-serversinfo li {
list-style-type: none;
}
#search-serversinfo .search-toggle-server {
margin-right: 5px;
}
#searchresults table {
width: 100%;
}
.sourcecol {
width: 50px;
}
.results-info {
height: 100px;
overflow: auto;
}
.toolscol {
padding: 0;
width: 100px;
}
.toolscol ul {
margin: 0;
padding: 0;
}
#searchresults .toolscol li {
list-style-type: none;
list-style-image: none;
}
.toolscol a {
border-bottom: 1px solid #BCBCBC;
display: block;
padding: 0 1em;
line-height: 24px;
}
.marccol {
font-family: monospace;
height: auto;
white-space: pre-wrap;
}
#searchresults {
position: relative;
}
#search-overlay {
background: white;
bottom: 0;
font-size: 2em;
left: 0;
opacity: .7;
padding: 2em;
position: absolute;
right: 0;
text-align: center;
top: 0;
z-index: 9001;
}
/*> Macros */
#macro-save-message {
color: #666;
font-size: 13px;
float: right;
line-height: 26px;
}
#macro-list > li {
border: 2px solid #F0F0F0;
border-radius: 6px;
display: block;
font-size: 115%;
}
#macro-list > li + li {
margin-top: -2px;
}
#macro-list .active {
background: #EDF4F6;
border-color: none;
}
#macro-list a {
display: block;
padding: 6px;
}
#macro-list a:focus {
outline: none;
}
.macro-info {
background-color: #F4F4F4;
display: none;
margin: 0;
padding: 10px;
text-align: right;
}
.macro-info li {
color: #666;
font-size: 75%;
list-style-type: none;
}
.macro-info .label {
clear: left;
font-weight: bold;
float: left;
}
#macro-list .active .macro-info {
display: block;
}
.btn-toolbar label, .btn-toolbar select {
font-size: 13px;
vertical-align: middle;
}
.btn-toolbar label {
margin-left: 1em;
}
.btn-toolbar select {
padding: 2px;
}
#macro-editor {
display: flex;
flex-direction: column;
height: 100%;
}
#macro-editor .CodeMirror {
flex: 1;
font-size: 13px;
}
/* Hotpatch from latest CodeMirror: Fix gutter positioning */
.CodeMirror-gutter-wrapper {
position: absolute;
}
/* Small devices (tablets, 768px and up) */
@media (min-width: @screen-sm-min) {
#statusbar {
border-bottom-style: none;
border-radius: 6px 6px 0 0;
margin-bottom: -32px;
}
}
#keyboard-layout .layouts {
column-count: 2;
}
#keyboard-layout .layouts > div {
cursor: pointer;
}
.ui-keyboard-accept {
display: none;
}