Owen Leonard
a3c28771ed
This patch makes style changes to the authority record editor in order to make it easier to navigate among tabs and tags. This change matches the one made to the basic MARC editor in Bug 22045. Tabs are now part of the page's toolbar, which floats as the page scrolls. In addition to the numbered tabs, there is also a section showing in-page links to the MARC tags which are available on that page. To test, apply the patch and clear your browser cache if necessary. Open a blank or existing record in the authority record editor. Test the redesigned tabs, the floating toolbar, and the in-page tag links. Signed-off-by: David Nind <david@davidnind.com> Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org> Signed-off-by: Fridolin Somers <fridolin.somers@biblibre.com>
457 lines
7.4 KiB
CSS
457 lines
7.4 KiB
CSS
form {
|
|
display: block;
|
|
}
|
|
|
|
div#toolbar {
|
|
border: 0;
|
|
}
|
|
|
|
#addbibliotabs .ui-tabs-nav,
|
|
#authoritytabs .ui-tabs-nav {
|
|
display: none;
|
|
}
|
|
|
|
.ui-tabs-panel h3 {
|
|
font-size: 140%;
|
|
margin: .3em 0;
|
|
}
|
|
|
|
.ui-tabs-panel ul {
|
|
margin-bottom: 0;
|
|
padding-left: 0;
|
|
}
|
|
|
|
ul li.tag, ul li.tag li.subfield_line {
|
|
list-style-type: none;
|
|
position: relative;
|
|
padding-left: 30px;
|
|
}
|
|
|
|
ul li.tag::before {
|
|
position: absolute;
|
|
font-size: .8em;
|
|
top: 0;
|
|
left: 10px;
|
|
content: " ";
|
|
}
|
|
|
|
|
|
ul li.tag.sortable_tag::before,
|
|
ul li.tag li.subfield_line::before {
|
|
color: #999;
|
|
cursor: move;
|
|
position: absolute;
|
|
font-family: 'FontAwesome';
|
|
font-size: .8em;
|
|
top: 0;
|
|
left: 10px;
|
|
content: "\f0c9";
|
|
}
|
|
|
|
ul li.tag::before {
|
|
padding-top: 1.7em;
|
|
}
|
|
|
|
li.ui-sortable-helper {
|
|
background-color: #e0e0e0;
|
|
max-height: 150px;
|
|
padding: 2px;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
li.ui-sortable-helper ul li {
|
|
display: none !important;
|
|
}
|
|
|
|
.sortable_subfield .ui-sortable-helper input.flat {
|
|
background-color: transparent;
|
|
}
|
|
|
|
ul li.tag li.subfield_line.ui-sortable-helper::before {
|
|
top: 5px;
|
|
}
|
|
|
|
.buttonPlus {
|
|
font-weight : bold;
|
|
text-decoration : none;
|
|
}
|
|
|
|
.buttonMinus {
|
|
font-weight : bold;
|
|
text-decoration : none;
|
|
}
|
|
|
|
a.expandfield {
|
|
text-decoration : none;
|
|
}
|
|
|
|
#authoritytabs {
|
|
margin-top : 1em;
|
|
margin-bottom : 1em;
|
|
}
|
|
|
|
.toptabs .ui-tabs-nav li a {
|
|
padding : .2em 1.2em;
|
|
}
|
|
|
|
.tag {
|
|
border-bottom: 2px solid #D5E6E9;
|
|
clear: both;
|
|
padding: .7em 0;
|
|
}
|
|
|
|
li.subfield_line {
|
|
padding-bottom: .3em;
|
|
float: left;
|
|
clear: left;
|
|
width: 100%;
|
|
}
|
|
|
|
li.subfield_line label {
|
|
font-size:89%;
|
|
float: left;
|
|
padding-right: .4em;
|
|
width: 10em;
|
|
text-align: left;
|
|
clear:left;
|
|
}
|
|
|
|
.subfieldcode img {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.tag_title {
|
|
font-size : 90%;
|
|
padding : .2em 0;
|
|
}
|
|
|
|
.tagnum {
|
|
font-size : 130%;
|
|
font-weight : bold;
|
|
color : #000;
|
|
padding : .1em .3em .1em 0;
|
|
}
|
|
|
|
a.tagnum {
|
|
font-size : 110%;
|
|
font-weight : bold;
|
|
color : #000;
|
|
padding : .1em .3em .1em 0;
|
|
text-decoration : none;
|
|
}
|
|
|
|
.subfield {
|
|
color : #00698a;
|
|
float: left;
|
|
width: 10em;
|
|
text-align:right;
|
|
}
|
|
|
|
.subfield.subfield_mandatory {
|
|
color: #C00;
|
|
}
|
|
|
|
.subfieldcode {
|
|
display: block;
|
|
float: left;
|
|
}
|
|
|
|
.labelsubfield {
|
|
float: left;
|
|
}
|
|
|
|
#cat_addbiblio .subfieldcode, #authoritytabs .subfieldcode {
|
|
float: none;
|
|
}
|
|
|
|
#cat_addbiblio .labelsubfield, #authoritytabs .labelsubfield {
|
|
font-size: 90%;
|
|
float: none;
|
|
}
|
|
|
|
#cat_addbiblio .subfield, #authoritytabs .subfield {
|
|
float: none;
|
|
padding: .25em .5em;
|
|
}
|
|
|
|
#cat_addbiblio .subfield label, #authoritytabs .subfield label {
|
|
color: #00698a;
|
|
}
|
|
|
|
.input_marceditor {
|
|
float: left;
|
|
width: 50%;
|
|
}
|
|
|
|
#cat_addbiblio .input_marceditor, #authoritytabs .input_marceditor {
|
|
float: none;
|
|
width: 100%;
|
|
}
|
|
|
|
#cat_addbiblio .subfield_line, #authoritytabs .subfield_line {
|
|
display: flex;
|
|
}
|
|
|
|
#cat_addbiblio .field_marceditor, #authoritytabs .field_marceditor {
|
|
flex-grow: 1;
|
|
padding: .25em .5em;
|
|
}
|
|
|
|
#cat_addbiblio .subfield_loop_mandatory, #authoritytabs .subfield_loop_mandatory {
|
|
padding: .25em .5em;
|
|
}
|
|
|
|
.indicator {
|
|
width: 1em;
|
|
box-sizing: content-box;
|
|
}
|
|
|
|
#cataloguing_additem_newitem fieldset.rows label, #cataloguing_additem_newitem fieldset.rows span.label {
|
|
font-size : 100%;
|
|
width : 25%;
|
|
}
|
|
|
|
#cataloguing_additem_newitem fieldset.rows li {
|
|
padding-bottom : 3px;
|
|
}
|
|
|
|
#cataloguing_additem_newitem .input_marceditor {
|
|
width: 50%;
|
|
}
|
|
|
|
#cataloguing_additem_newitem textarea.input_marceditor {
|
|
width: 31em;
|
|
}
|
|
|
|
.mandatory_marker {
|
|
color: red;
|
|
}
|
|
.linktools { display: block; white-space: nowrap; }
|
|
.linktools a { font-size : 75%; display:block;text-decoration:none;}
|
|
.linktools a {margin:0 2px;padding:2px;background-color:#FFF;text-align:center; }
|
|
.linktools a:first-child { border-bottom: 1px solid #DDD; }
|
|
.linktools a:hover { background-color: #FFC; }
|
|
.subfield_controls { margin: 0 .5em; }
|
|
|
|
#cataloguing_additem_itemlist {
|
|
margin-bottom : 1em;
|
|
}
|
|
|
|
tbody tr.active:nth-child(2n+1) td,
|
|
tbody tr.active td {
|
|
background-color: #FFFFCC;
|
|
}
|
|
|
|
#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;
|
|
}
|
|
|
|
.ui-tabs .ui-tabs-panel {
|
|
border: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.toolbar-tabs-container {
|
|
margin: 3em -5px -5px -5px;
|
|
}
|
|
|
|
.toolbar-tabs {
|
|
background-color: #FFF;
|
|
clear: both;
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: center;
|
|
margin-bottom: 0;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.toolbar-tabs li {
|
|
background-color: #fff;
|
|
display: flex;
|
|
justify-content: center;
|
|
flex-grow: 1;
|
|
text-align: center;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.toolbar-tabs li a {
|
|
border: 1px solid #EDF4F6;
|
|
border-left: 0;
|
|
border-right: 1px solid #EDF4F6;
|
|
border-bottom-right-radius: 5px;
|
|
border-bottom-left-radius: 5px;
|
|
display: block;
|
|
font-weight: bold;
|
|
padding: .3em 1.5em;
|
|
width: 100%;
|
|
}
|
|
|
|
.toolbar-tabs li.selected a {
|
|
background-color: #EDF4F6;
|
|
border-right: 1px solid #C3D6DB;
|
|
border-bottom: 1px solid #C3D6DB;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.toolbar-tabs li.selected a:hover {
|
|
background-color: #EDF4F6;
|
|
}
|
|
|
|
.toolbar-tabs li a:hover {
|
|
background-color: #F4F8F9;
|
|
}
|
|
|
|
.toolbar-tabs li:first-child a {
|
|
border-left: 1px solid #EDF4F6;
|
|
}
|
|
|
|
.tag_anchors_list {
|
|
background-color: #FFF;
|
|
clear: both;
|
|
display: block;
|
|
font-size: 95%;
|
|
margin-bottom: 0;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.tag_anchor.selected {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.tag_anchors {
|
|
display: none;
|
|
padding: .5em 0;
|
|
}
|
|
|
|
.tag_anchors a {
|
|
border-right: 1px solid #EDF4F6;
|
|
display: inline-block;
|
|
padding: 0 .4em;
|
|
}
|
|
|
|
.tag_anchors.tab_selected {
|
|
display: inline-block;
|
|
}
|
|
|
|
.matching_authority{
|
|
color: #99FF99;
|
|
}
|
|
|
|
.no_matching_authority{
|
|
color: #FFAAAA;
|
|
}
|
|
|
|
.matching_authority_field{
|
|
background-color: #99FF99 !important;
|
|
}
|
|
|
|
.no_matching_authority_field{
|
|
background-color: #FFAAAA !important;
|
|
}
|
|
|
|
.show-errors {
|
|
background: #FFEC8C none;
|
|
border-color: #E0C726;
|
|
color: #000;
|
|
display: none;
|
|
text-shadow: none;
|
|
}
|
|
|
|
.floating .show-errors {
|
|
display: inline-block;
|
|
}
|
|
|
|
@media (min-width: 768px) {
|
|
li.subfield_line label {
|
|
width: 20em;
|
|
}
|
|
|
|
.input_marceditor {
|
|
width: 50em;
|
|
}
|
|
|
|
.subfield {
|
|
width: 14em;
|
|
}
|
|
}
|
|
|
|
@media (min-width: 1200px) {
|
|
li.subfield_line label {
|
|
width: 25em;
|
|
}
|
|
|
|
.input_marceditor {
|
|
width: 60em;
|
|
}
|
|
|
|
.subfield {
|
|
width: 16em;
|
|
}
|
|
}
|
|
|
|
.ui-autocomplete {
|
|
z-index: 2000;
|
|
}
|
|
|
|
#authoritiestabs .marc_field {
|
|
display: inline-block;
|
|
padding: .3em;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
#authoritiestabs .marc_subfield {
|
|
font-weight: bold;
|
|
color: #666;
|
|
}
|
|
|
|
#authoritiestabs .marc_subfield_desc {
|
|
color: #00698a;
|
|
font-style: italic;
|
|
}
|
|
|
|
#authoritiestabs .auth_subfield {
|
|
display: flex;
|
|
}
|
|
|
|
#authoritiestabs .tag {
|
|
padding: .4em 0;
|
|
}
|
|
|
|
#authoritiestabs .tag_desc {
|
|
color: #026;
|
|
}
|
|
|
|
#authoritiestabs .tag_num {
|
|
color: #080;
|
|
}
|
|
|
|
#authoritiestabs .tag_title {
|
|
font-size: 100%;
|
|
font-weight: bold;
|
|
padding: 0;
|
|
}
|
|
|
|
#authoritiestabs .ui-tabs-nav.ui-widget-header {
|
|
border-bottom: 1px solid #b9d8d9;
|
|
border-radius: 0;
|
|
}
|