Koha/koha-tmpl/intranet-tmpl/prog/css/cateditor.css
Ere Maijala 75b5ce2a31 Bug 16424: Add framework support to advanced MARC editor
Keeps the selected framework, allows selecting another and validates the record using the correct framework. Contains additional minor tweaks to display proper error messages.

To test:
1. Add a record with a non-default framework in the basic editor.
2. Switch to advanced editor and make sure the settings menu displays the correct framework.
3. Save the record and confirm that the framework code did not change.
4. Change the framework and save the record again.
5. Verify that the framework code changed.
6. Change one framework to make an extra field mandatory.
7. Make sure that the field is required in the editor when the framework above is selected but not when another framework is selected.

Signed-off-by: Michal Denar <black23@gmail.com>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>

Signed-off-by: Nick Clemens <nick@bywatersolutions.com>
2018-09-28 19:01:50 +00:00

446 lines
6.9 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;
}
#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: 4px;
}
#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;
}
#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: #F4F8F9;
border: solid 2px #b9d8d9;
border-bottom-style: none;
border-radius: 6px 6px 0 0;
margin-bottom: -32px;
overflow: auto;
padding: 4px;
padding-bottom: 0;
}
#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;
}