From 2df87a94f5bcd538799b8684139525d79d8c0af5 Mon Sep 17 00:00:00 2001 From: Owen Leonard Date: Thu, 15 Mar 2018 16:14:09 +0000 Subject: [PATCH] Bug 20427: Convert OPAC LESS to SCSS This patch converts the OPAC LESS files to SCSS. In the process of converting opac.less (and other .less files) to .scss, I have improved the completeness of the nesting, reordered properties, and in general done cleanup based on rules in .scss-lint.yml. All of these changes should have no impact on the style of the OPAC. This patch modifies the commands used to compile CSS so that OPAC and staff assets can be processed separately: 'yarn build' <-- Builds the staff client assets by default 'yarn build --view opac' <-- Builds OPAC assets To test, apply the patch and compile the CSS by running the command above (or apply the follow-up patch with compiled CSS). Do a thorough review of the OPAC, taking care to cover as many pages as possible and checking responsive behavior at the same time. There should be no visual differences in the OPAC before and after applying the patch. Signed-off-by: Claire Gravely Signed-off-by: Katrin Fischer Signed-off-by: Nick Clemens --- .gitignore | 1 + .scss-lint.yml | 245 ++ gulpfile.js | 18 +- .../opac-tmpl/bootstrap/css/src/_mixins.scss | 10 + .../src/_responsive.scss} | 327 +- .../opac-tmpl/bootstrap/css/src/opac.scss | 2977 +++++++++++++++++ .../opac-tmpl/bootstrap/css/src/print.scss | 251 ++ .../src/right-to-left.scss} | 346 +- .../opac-tmpl/bootstrap/less/mixins.less | 12 - koha-tmpl/opac-tmpl/bootstrap/less/opac.less | 2634 --------------- koha-tmpl/opac-tmpl/bootstrap/less/print.less | 258 -- 11 files changed, 3853 insertions(+), 3226 deletions(-) create mode 100644 .scss-lint.yml create mode 100644 koha-tmpl/opac-tmpl/bootstrap/css/src/_mixins.scss rename koha-tmpl/opac-tmpl/bootstrap/{less/responsive.less => css/src/_responsive.scss} (56%) create mode 100644 koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss create mode 100644 koha-tmpl/opac-tmpl/bootstrap/css/src/print.scss rename koha-tmpl/opac-tmpl/bootstrap/{less/right-to-left.less => css/src/right-to-left.scss} (63%) delete mode 100644 koha-tmpl/opac-tmpl/bootstrap/less/mixins.less delete mode 100644 koha-tmpl/opac-tmpl/bootstrap/less/opac.less delete mode 100644 koha-tmpl/opac-tmpl/bootstrap/less/print.less diff --git a/.gitignore b/.gitignore index 2a3d1d7a08..c70d94a1dd 100644 --- a/.gitignore +++ b/.gitignore @@ -3,4 +3,5 @@ /Makefile /pm_to_blib node_modules/ +koha-tmpl/opac-tmpl/bootstrap/css/maps/ koha-tmpl/intranet-tmpl/prog/css/maps/ diff --git a/.scss-lint.yml b/.scss-lint.yml new file mode 100644 index 0000000000..aec327331d --- /dev/null +++ b/.scss-lint.yml @@ -0,0 +1,245 @@ +# Default application configuration that all configurations inherit from. + +scss_files: "**/*.scss" +plugin_directories: ['.scss-linters'] + +# List of gem names to load custom linters from (make sure they are already +# installed) +plugin_gems: [] + +# Default severity of all linters. +severity: warning + +linters: + BangFormat: + enabled: true + space_before_bang: true + space_after_bang: false + + BemDepth: + enabled: false + max_elements: 1 + + BorderZero: + enabled: true + convention: zero # or `none` + + ChainedClasses: + enabled: false + + ColorKeyword: + enabled: false + + ColorVariable: + enabled: false + + Comment: + enabled: false + style: silent + + DebugStatement: + enabled: true + + DeclarationOrder: + enabled: true + + DisableLinterReason: + enabled: false + + DuplicateProperty: + enabled: true + + ElsePlacement: + enabled: true + style: same_line # or 'new_line' + + EmptyLineBetweenBlocks: + enabled: true + ignore_single_line_blocks: true + + EmptyRule: + enabled: true + + ExtendDirective: + enabled: false + + FinalNewline: + enabled: true + present: true + + HexLength: + enabled: false + style: short # or 'long' + + HexNotation: + enabled: true + style: uppercase # or 'lowercase' + + HexValidation: + enabled: true + + IdSelector: + enabled: false + + ImportantRule: + enabled: true + + ImportPath: + enabled: true + leading_underscore: false + filename_extension: false + + Indentation: + enabled: true + allow_non_nested_indentation: false + character: space # or 'tab' + width: 4 + + LeadingZero: + enabled: true + style: exclude_zero # or 'include_zero' + + MergeableSelector: + enabled: true + force_nesting: true + + NameFormat: + enabled: true + allow_leading_underscore: true + convention: hyphenated_lowercase # or 'camel_case', or 'snake_case', or a regex pattern + + NestingDepth: + enabled: true + max_depth: 4 + ignore_parent_selectors: false + + PlaceholderInExtend: + enabled: true + + PrivateNamingConvention: + enabled: false + prefix: _ + + PropertyCount: + enabled: false + include_nested: false + max_properties: 10 + + PropertySortOrder: + enabled: true + ignore_unspecified: false + min_properties: 2 + separate_groups: false + + PropertySpelling: + enabled: true + extra_properties: [] + disabled_properties: [] + + PseudoElement: + enabled: true + + QualifyingElement: + enabled: true + allow_element_with_attribute: false + allow_element_with_class: false + allow_element_with_id: false + + SelectorDepth: + enabled: true + max_depth: 4 + + SelectorFormat: + enabled: false + convention: hyphenated_lowercase # or 'classic_BEM', or 'hyphenated_BEM', or 'snake_case', or 'camel_case', or a regex pattern + + Shorthand: + enabled: true + allowed_shorthands: [1, 2, 3, 4] + + SingleLinePerProperty: + enabled: true + allow_single_line_rule_sets: false + + SingleLinePerSelector: + enabled: true + + SpaceAfterComma: + enabled: true + style: one_space # or 'no_space', or 'at_least_one_space' + + SpaceAfterComment: + enabled: false + style: one_space # or 'no_space', or 'at_least_one_space' + allow_empty_comments: true + + SpaceAfterPropertyColon: + enabled: true + style: one_space # or 'no_space', or 'at_least_one_space', or 'aligned' + + SpaceAfterPropertyName: + enabled: true + + SpaceAfterVariableColon: + enabled: false + style: one_space # or 'no_space', 'at_least_one_space' or 'one_space_or_newline' + + SpaceAfterVariableName: + enabled: true + + SpaceAroundOperator: + enabled: true + style: one_space # or 'at_least_one_space', or 'no_space' + + SpaceBeforeBrace: + enabled: true + style: space # or 'new_line' + allow_single_line_padding: false + + SpaceBetweenParens: + enabled: true + spaces: 1 + + StringQuotes: + enabled: true + style: double_quotes # or single_quotes + + TrailingSemicolon: + enabled: true + + TrailingWhitespace: + enabled: true + + TrailingZero: + enabled: false + + TransitionAll: + enabled: false + + UnnecessaryMantissa: + enabled: true + + UnnecessaryParentReference: + enabled: true + + UrlFormat: + enabled: true + + UrlQuotes: + enabled: true + + VariableForProperty: + enabled: false + properties: [] + + VendorPrefix: + enabled: true + identifier_list: base + additional_identifiers: [] + excluded_identifiers: [] + + ZeroUnit: + enabled: true + + Compass::*: + enabled: false diff --git a/gulpfile.js b/gulpfile.js index 2a868e10c8..1eb0d6ba31 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -26,28 +26,36 @@ var sassOptions = { precision: 3 } +if( gutil.env.view == "opac" ){ + var css_base = OPAC_CSS_BASE; + var js_base = OPAC_JS_BASE; +} else { + var css_base = STAFF_CSS_BASE; + var js_base = STAFF_JS_BASE; +} + gulp.task( "default", ['watch'] ); // CSS processing for development gulp.task('css', function() { - return gulp.src( STAFF_CSS_BASE + "/src/**/*.scss" ) + return gulp.src( css_base + "/src/**/*.scss" ) .pipe(sourcemaps.init()) .pipe(sass( sassOptions ).on('error', sass.logError)) .pipe(autoprefixer()) .pipe(sourcemaps.write('./maps')) - .pipe(gulp.dest( STAFF_CSS_BASE )); + .pipe(gulp.dest( css_base )); }); // CSS processing for production gulp.task('build', function() { - return gulp.src( STAFF_CSS_BASE + "/src/**/*.scss" ) + return gulp.src( css_base + "/src/**/*.scss" ) .pipe(sass( sassOptions ).on('error', sass.logError)) .pipe(autoprefixer()) .pipe(cssnano()) - .pipe(gulp.dest( STAFF_CSS_BASE )); + .pipe(gulp.dest( css_base )); }); gulp.task('watch', function(){ - gulp.watch( STAFF_CSS_BASE + "/src/**/*.scss", ['css'] ); + gulp.watch( css_base + "/src/**/*.scss", ['css'] ); }); \ No newline at end of file diff --git a/koha-tmpl/opac-tmpl/bootstrap/css/src/_mixins.scss b/koha-tmpl/opac-tmpl/bootstrap/css/src/_mixins.scss new file mode 100644 index 0000000000..73ee84cf1d --- /dev/null +++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/_mixins.scss @@ -0,0 +1,10 @@ +$color: #999999; +$links: #0076B2; + +@mixin shadowed { + box-shadow: 0 1px 1px 0 rgba( 0, 0, 0, .2 ); +} + +@mixin border-radius-all( $radius: 3px ) { + border-radius: $radius; +} \ No newline at end of file diff --git a/koha-tmpl/opac-tmpl/bootstrap/less/responsive.less b/koha-tmpl/opac-tmpl/bootstrap/css/src/_responsive.scss similarity index 56% rename from koha-tmpl/opac-tmpl/bootstrap/less/responsive.less rename to koha-tmpl/opac-tmpl/bootstrap/css/src/_responsive.scss index 2df6bf56a7..832bbf3594 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/less/responsive.less +++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/_responsive.scss @@ -1,60 +1,48 @@ -@import "mixins.less"; -@media only screen and (min-width: 0px) and (max-width: 304px) { +@import "mixins"; + +@media only screen and ( min-width: 0 ) and ( max-width: 304px ) { /* Screens bewteen 0 and 304 pixels wide */ - #oh:after { - content: "(min-width: 0px) and (max-width: 304px)"; - } input, select, textarea { - width : auto; - max-width : 11em; + max-width: 11em; + width: auto; } } -@media only screen and (min-width: 0px) and (max-width: 390px){ +@media only screen and ( min-width: 0 ) and ( max-width: 390px ){ /* Screens bewteen 0 and 390 pixels wide */ - #oh:after { - content: "(min-width: 0px) and (max-width: 390px)"; - } .ui-tabs .ui-tabs-nav li a, .statictabs li a { padding: .1em .5em; } - .input-fluid { - width : 90%; - } -} -@media only screen and (min-width: 305px) and (max-width: 341px) { - /* Screens bewteen 305 and 341 pixels wide */ - #oh:after { - content: "(min-width: 305px) and (max-width: 341px)"; + .input-fluid { + width: 90%; } } -@media only screen and (min-width: 342px) and (max-width: 479px) { +@media only screen and ( min-width: 342px ) and ( max-width: 479px ) { /* Screens bewteen 342 and 479 pixels wide */ - #oh:after { - content: "(min-width: 342px) and (max-width: 479px)"; - } .input-fluid { - width : 75%; + width: 75%; } + .searchsuggestion { display: block; } } /* Override Bootstrap Responsive CSS fixed navbar */ -@media (max-width: 979px) { - .navbar-fixed-top, - .navbar-fixed-bottom { - position: fixed; - margin-left: 0px; - margin-right: 0px; - } +@media ( max-width: 979px ) { + .navbar-fixed-top, + .navbar-fixed-bottom { + margin-left: 0; + margin-right: 0; + position: fixed; + } } -@media only screen and (max-width: 608px) { + +@media only screen and ( max-width: 608px ) { /* Screens below 608 pixels wide */ fieldset { &.rows { @@ -63,30 +51,38 @@ float: none; text-align: left; } + li { - padding-bottom : .5em; + padding-bottom: .5em; } + ol { - margin-left : 0; + margin-left: 0; } + .hint { margin-left: 0; } } } + body { padding: 0; } + .tdlabel { display: inline; } + .navbar-fixed-top, .navbar-static-top { - margin : 0; + margin: 0; } + .navbar-inner { - padding : 0; + padding: 0; } + .checkall, .clearall, .highlight_controls, @@ -96,388 +92,423 @@ #remove-selected { display: none; } + .table td.bibliocol { padding-left: 1.3em; } + .actions { display: block; - a, #login4tags { + + a, + #login4tags { + @include border-radius-all( 4px ); background-color: #F2F2EF; - border : 1px solid #DDD; - .border-radius-all(4px); - font-weight: bold; + border: 1px solid #DDD; display: block; font-size: 120%; + font-weight: bold; margin: 2px 0; } + .label { display: block; font-weight: bold; } + #login4tags { margin-right: 1em; } } + #opac-main-search { button, input, select, .librarypulldown .transl1, .input-append { + @include border-radius-all( 5px ); box-sizing: border-box; display: block; height: 120%; - width : 97%; + margin: .5em 0; max-width: 100%; - margin : .5em 0; - .border-radius-all(5px); + width: 97%; } + .input-append { - margin : 0; + margin: 0; width: 100%; } + .librarypulldown .transl1 { - width : 94.5%; + width: 94.5%; } } + #toolbar .resort { - font-size : 14px; + @include border-radius-all( 5px ); + font-size: 14px; + margin: .5em 0; max-width: 100%; - margin : .5em 0; - padding : 4px 6px; - .border-radius-all(5px); + padding: 4px 6px; } + .mastheadsearch { - margin : 0; - .border-radius-all(0px); + @include border-radius-all( 0 ); + margin: 0; } + .main { - margin : .5em 0; - padding : 15px; - .border-radius-all(0px); + @include border-radius-all( 0 ); + margin: .5em 0; + padding: 15px; } + .breadcrumb { - margin : 10px 0; + margin: 10px 0; } + #moresearches { text-align: center; } + #searchsubmit { font-weight: bold; } + .ui-tabs-panel, .tabs-container, #topissues, #usertags, #usersuggestions { .item-thumbnail { - margin : .5em 0 0 .5em; + margin: .5em 0 0 .5em; } + .table-bordered { - border : none; + border: 0; } + .table { th, thead { display: none; } + td { - border-right : 1px solid #dddddd; - border-left : 1px solid #dddddd; - border-top : 0; - display : block; - padding : .2em; + border-left: 1px solid #DDDDDD; + border-right: 1px solid #DDDDDD; + border-top: 0; + display: block; + padding: .2em; } + p { - margin-bottom : 2px; + margin-bottom: 2px; } } + tr { display: block; - margin-bottom : .6em; + margin-bottom: .6em; + td:first-child { - border-top : 1px solid #dddddd; border-radius: 5px 5px 0 0; + border-top: 1px solid #DDDDDD; } + td:last-child { + border-bottom: 2px solid #CACACA; border-radius: 0 0 5px 5px; - border-bottom : 2px solid #CACACA; } } } + .no-image { - display : none; + display: none; } } -@media only screen and (max-width: 700px) { +@media only screen and ( max-width: 700px ) { /* Screens below 700 pixels wide */ #opac-main-search { label { display: none; } } + #logo { - background: transparent url("../lib/bootstrap/img/glyphicons-halflings-white.png") no-repeat; + background: transparent url( "../lib/bootstrap/img/glyphicons-halflings-white.png" ) no-repeat; background-position: 0 -24px; margin: 14px 14px 0 14px; width: 14px; + a { - padding:14px 0 0; - width:14px; + padding: 14px 0 0; + width: 14px; } } + #user-menu-trigger { display: inline; - margin-right : 12px; + margin-right: 12px; } + #members { + clear: both; display: none; - clear : both; + li { + border-bottom: 1px solid #555; padding-right: 20px; text-align: right; - border-bottom : 1px solid #555; + &:first-child { - border-top : 1px solid #555; + border-top: 1px solid #555; } + &:last-child { - border-bottom : none; + border-bottom: 0; } } + .nav { float: none; + + > li { + float: none; + } + &.pull-right { float: none; } } - .nav>li { - float: none; - } + .divider-vertical { - border : 0; - height : 0; - margin : 0; + border: 0; + height: 0; + margin: 0; } } } -@media only screen and (min-width: 480px) and (max-width: 608px) { +@media only screen and ( min-width: 480px ) and ( max-width: 608px ) { /* Screens between 480 and 608 pixels wide */ - #oh:after { - content: " Between 480 pixels and 608 pixels. "; - } .input-fluid { - width : 75%; + width: 75%; } } -@media only screen and (min-width: 608px) { +@media only screen and ( min-width: 608px ) { #views { - border-bottom : 1px solid #D6D6D6; + border-bottom: 1px solid #D6D6D6; margin: 0; padding: 0; - white-space : nowrap; + white-space: nowrap; } + .view { + border-bottom-width: 0; border-radius: 0; border-right-width: 0; border-top-width: 0; - border-bottom-width: 0; } .current-view { border: 0; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; + box-shadow: none; } } -@media only screen and (min-width: 608px) and (max-width: 767px) { +@media only screen and ( min-width: 608px ) and ( max-width: 767px ) { /* Screens between 608 and 767 pixels wide */ - #oh:after { - content: " Between 608 pixels and 767 pixels. "; - } .main { - padding: 0.8em 20px; + padding: .8em 20px; } + .breadcrumb { - margin : 10px 0; + margin: 10px 0; } + .navbar-static-bottom { - margin-left : -20px; - margin-right : -20px; + margin-left: -20px; + margin-right: -20px; } + .row-fluid input.span6 { width: 48.9362%; } } -@media only screen and (max-width: 767px) { +@media only screen and ( max-width: 767px ) { /* Screens below 767 pixels wide */ a { &.title { font-size: 120%; } } + #userresults { - margin : 0 -20px; + margin: 0 -20px; } + .breadcrumb, #top-pages, .menu-collapse { display: none; } + #search-facets, #menu { margin-bottom: .5em; + h4 { display: block; - margin : 0; - padding : 0; + margin: 0; + padding: 0; + a { - .border-radius-all(7px); + @include border-radius-all( 7px ); border-bottom: 0; font-weight: normal; padding: .7em .2em; } } + ul { padding: 0; } } + #menu { li { a { - .border-radius-all(0px); - border : 0; + @include border-radius-all( 0 ); + border: 0; + border-bottom: 1px solid #D8D8D8; display: block; font-size: 120%; - text-decoration: none; - border-bottom: 1px solid #D8D8D8; margin: 0; + text-decoration: none; } + &.active { a { - border-top: 1px solid #D8D8D8; border-right-width: 1px; + border-top: 1px solid #D8D8D8; } } + &:last-child { a { - -webkit-border-radius: 0 0 7px 7px; - -moz-border-radius: 0 0 7px 7px; - border-radius: 0 0 7px 7px; + border-radius: 0 0 7px 7px; } } } } + #search-facets { li { - padding : .4em; + padding: .4em; } + h5 { margin: .2em; } } + #menu h4 a.menu-open, #search-facets h4 a.menu-open { - -webkit-border-radius: 7px 7px 0 0; - -moz-border-radius: 7px 7px 0 0; - border-radius: 7px 7px 0 0; border-bottom: 1px solid #D8D8D8; + border-radius: 7px 7px 0 0; } } -@media only screen and (max-width: 800px) { +@media only screen and ( max-width: 800px ) { /* Screens below 800 pixels wide */ .cartlabel, .listslabel { display: none; } + .navbar { .divider-vertical { - margin : 0 2px; + margin: 0 2px; } + #members { .divider-vertical { - margin : 0 9px; + margin: 0 9px; } } } } -@media only screen and (min-width: 768px) { +@media only screen and ( min-width: 768px ) { /* Screens above 768 pixels wide */ .main { margin-left: 20px; margin-right: 20px; } + #menu { - border : 0; - .border-radius-all(0px); - border-right : 1px solid #D8D8D8; + @include border-radius-all( 0 ); + border: 0; + border-right: 1px solid #D8D8D8; + h4 { display: none; } + ul { padding: 1em 0 1em 0; } } + #didyoumean { margin: 0; } + .searchsuggestion { white-space: nowrap; } } -@media only screen and (min-width: 768px) and (max-width: 984px) { +@media only screen and ( min-width: 768px ) and ( max-width: 984px ) { /* Screens between 768 and 984 pixels wide */ - #oh:after { - content: " Between 768 and 984 pixels. "; - } .librarypulldown .transl1 { - width : 38%; + width: 38%; } } -@media only screen and (max-width: 984px) { - /* Screens up to 984 pixels wide */ - // #oh:after { - // content: " Below 984 pixels. "; - // } -} - -@media only screen and (min-width: 984px) { +@media only screen and ( min-width: 984px ) { /* Screens above 969 pixels wide */ - #oh:after { - content: " Above 984 pixels. "; - } .librarypulldown .transl1 { - width : 53%; + width: 53%; } } -@media only screen and (max-width: 1040px) { +@media only screen and ( max-width: 1040px ) { .pg_menu { li { a { float: none; - text-align : left; + text-align: left; } + &.back_results { a { - border : 1px solid #D0D0D0; - border-width : 1px 0 1px 0; + border: 1px solid #D0D0D0; + border-width: 1px 0 1px 0; } } } } + #ulactioncontainer { - min-width : 0; + min-width: 0; } } diff --git a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss new file mode 100644 index 0000000000..dec30075b3 --- /dev/null +++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss @@ -0,0 +1,2977 @@ +@import "mixins"; + +body { + background-color: #EAEAE6; +} + +/* Sticky footer styles */ +html, +body { + height: 100%; + /* The html and body elements cannot have any padding or margin. */ +} + +.no-js { + .dateformat { + display: inline; + white-space: nowrap; + } + + .modal-body { + padding: 0; + } + + .selections-toolbar { + display: none; + } +} + +.js { + .dateformat { + display: none; + } +} + +/* Wrapper for page content to push down footer */ +#wrap { + height: auto !important; + height: 100%; + min-height: 100%; + /* Negative indent footer by it's height */ + // margin: 0 auto -60px; +} + +#changelanguage { + /* Set the fixed height of the footer here */ + // height: 60px; + .nav { + > .active { + > p { + padding: 0 15px; + } + } + } +} + +.popup { + padding-left: 0; + padding-right: 0; + + .main { + font-size: 90%; + padding: 0 1em; + } + + legend { + line-height: 1.5em; + margin-bottom: .5em; + } +} + +a { + color: $links; + + &.cancel { + padding-left: 1em; + } + + &:visited { + color: $links; + } + + &.title { + font-size: 108%; + font-weight: bold; + } + + &.btn { + &:visited { + color: #333; + } + } + + &.btn-primary { + &:visited { + color: #FFF; + } + } + + &.login-link { + color: #A6D8ED; + font-weight: bold; + } + + &.listmenulink { + &:link, + &:visited { + color: #0076B2; + font-weight: bold; + } + + &:hover, + &:active { + color: #FFF; + font-weight: bold; + } + } + + .idreambooksrating { + color: #29ADE4; + font-size: 30px; + line-height: 30px; + padding-left: 85px; + text-decoration: none; + } + + &.reviewlink, + &.reviewlink:visited { + color: black; + font-weight: normal; + text-decoration: none; + } + + &.addtocart { + @extend %initial_icon; + background-position: -5px -265px; /* Cart */ + padding-left: 35px; + } + + &.addtoshelf { + @extend %initial_icon; + background-position: -5px -225px; /* Virtual shelf */ + padding-left: 35px; + } + + &.brief { + @extend %initial_icon; + background-position: -2px -868px; /* Zoom out */ + padding-left: 27px; + } + + &.deleteshelf { + @extend %initial_icon; + + &.disabled { + @extend %initial_icon; + } + } + + &.detail { + @extend %initial_icon; + background-position: -2px -898px; /* Zoom in */ + padding-left: 27px; + } + + &.download { + @extend %initial_icon; + background-position: -5px -348px; /* Download */ + padding-left: 20px; + } + + &.editshelf { + @extend %initial_icon; + background-position: 2px -348px; /* List edit */ + padding-left: 26px; + } + + &.empty { + @extend %initial_icon; + background-position: 2px -598px; /* Trash */ + padding-left: 30px; + } + + &.hide { + @extend %initial_icon; + background-position: -3px -814px; /* Close */ + padding-left: 26px; + } + + &.highlight_toggle { + @extend %initial_icon; + background-position: -5px -841px; /* Highlight */ + display: none; + padding-left: 35px; + } + + &.hold { + @extend %initial_icon; + background-position: -2px -453px; /* Toolbar place hold */ + padding-left: 23px; + + &.disabled { + @extend %initial_icon; + background-position: -5px -621px; /* Place hold disabled */ + } + } + + &.incart { + @extend %initial_icon; + background-position: -5px -265px; /* Cart */ + color: #666; + padding-left: 35px; + } + + &.new { + @extend %initial_icon; + background-image: url( "../images/sprite.png" ); /* New */ + background-position: -4px -922px; + padding-left: 23px; + } + + &.print-small { + @extend %initial_icon; + background-position: 0 -423px; /* Toolbar print */ + padding-left: 30px; + } + + &.print-large { + @extend %initial_icon; + background-position: -5px -186px; /* Toolbar print */ + padding-left: 35px; + } + + &.removeitems { + @extend %initial_icon; + background-position: 2px -690px; /* Delete */ + padding-left: 25px; + + &.disabled { + @extend %initial_icon; + background-position: 2px -712px; /* Delete disabled */ + } + } + + &.reserve { + @extend %initial_icon; + background-position: -6px -144px; /* Place hold */ + padding-left: 35px; + } + + &.article_request { + @extend %initial_icon; + background-position: 0 -24px; /* Place article request */ + padding-left: 35px; + } + + &.send { + @extend %initial_icon; + background-position: 2px -386px; /* Email */ + padding-left: 28px; + } + + &.tag_add { + @extend %initial_icon; + background-position: 3px -1111px; /* Tag results */ + padding-left: 27px; + } + + &.removefromlist { + @extend %initial_icon; + } +} + +h1 { + font-size: 140%; + line-height: 150%; + + &#libraryname { + background: transparent url( "../images/logo-koha.png" ) no-repeat scroll 0%; + border: 0; + float: left !important; + margin: 0; + padding: 0; + width: 120px; + + a { + border: 0; + cursor: pointer; + display: block; + height: 0 !important; + margin: 0; + overflow: hidden; + padding: 40px 0 0; + text-decoration: none; + width: 120px; + } + } +} + +h2 { + font-size: 130%; + line-height: 150%; +} + +h3 { + font-size: 120%; + line-height: 150%; +} + +h4 { + font-size: 110%; +} + +h5 { + font-size: 100%; +} + +caption { + font-size: 120%; + font-weight: bold; + margin: 0; + text-align: left; +} + +input, +textarea { + width: auto; +} + +.input-fluid { + width: 50%; +} + +legend { + font-size: 110%; + font-weight: bold; +} + +table { + font-size: 90%; +} + +table, +td { + background-color: #FFF; +} + +td { + img { + max-width: none; + } + + &.overdue { + color: #CC3333; + } + + .sum { + background-color: #FFC; + font-weight: bold; + } + + .btn { + white-space: nowrap; + } + + .btn-link { + padding: 0; + } +} + +th { + background-color: #ECEDE6; + + &.sum { + text-align: right; + } + + &[scope=row] { + background-color: transparent; + text-align: right; + } +} + +#advsearches, +#booleansearch { + label { + display: inline; + } +} + +#basketcount { + display: inline; + margin: 0; + padding: 0; + + span { + @include border-radius-all( 3px ); + background-color: #FFC; + color: #000; + display: inline; + font-size: 80%; + font-weight: normal; + margin: 0 0 0 .9em; + padding: 0 .3em; + } +} + + +#members { + display: block; + + p { + color: #EEE; + } + + a { + &.logout { + color: #E8583C; + font-weight: bold; + padding: 0 .3em; + } + } +} + +#koha_url { + p { + color: #666666; + float: right; + margin: 0; + } +} + +#moresearches { + margin: .5em 0; + padding: 0 .8em; + + li { + display: inline; + white-space: nowrap; + + &::after { + content: " | "; + } + + &:last-child { + &::after { + content: ""; + } + } + + } + + ul { + margin: 0; + } +} + +#news { + margin: .5em 0; +} + +.newscontainer { + border: 1px solid #DDD; + border-bottom-width: 0; + border-top-left-radius: 5px; + border-top-right-radius: 5px; +} + +.newsheader { + background-color: #ECEDE6; + border-bottom: 1px solid #DDD; + margin: 0; + padding: 8px; +} + +.newsbody { + padding: 8px; +} + +.newsfooter { + border-bottom: 1px solid #DDD; + font-style: italic; + padding: 4px 8px; +} + +#opacheader { + background-color: #DDD; +} + +#selections, +.selections { + font-weight: bold; +} + +.actions { + a { + background-repeat: no-repeat; + margin-right: 1em; + text-decoration: none; + white-space: nowrap; + + &.hold { + background-image: url( "../images/sprite.png" ); /* Place hold small */ + background-position: -5px -542px; + padding-left: 21px; + } + + &.article_request { + background-image: url( "../images/sprite.png" ); /* Place hold small */ + background-position: -2px -26px; + padding-left: 21px; + } + + &.addtocart { + background-image: url( "../images/sprite.png" ); /* Cart small */ + background-position: -5px -572px; + padding-left: 20px; + } + + &.addtoshelf { + background-image: url( "../images/sprite.png" ); /* MARC view */ + background-position: -5px -27px; + padding-left: 20px; + } + + &.addtolist { + background-position: -5px -27px; + padding-left: 20px; + } + + &.tag_add { + background-position: -5px -1110px; + padding-left: 20px; + } + + /* List contents remove from list link */ + &.removefromlist { + background-position: -8px -690px; /* Delete */ + padding-left: 15px; + } + } +} + +/* Override Bootstrap alert */ +.alert { + background: linear-gradient( to bottom, #FFFBE5 0%, #FFF0B2 9%, #FFF1A8 89%, #F7E665 100% ); + border-color: #D6C43B; + color: #333; + + /* Redefine a new style for Bootstrap's class "close" since we use that already */ + /* Use × */ + + .closebtn { + line-height: 20px; + position: relative; + right: -21px; + top: -2px; + } +} + +/* Override Bootstrap alert.alert-info */ +.alert-info { + background: linear-gradient( to bottom, #F4F6FA 0%, #EAEEF5 4%, #E8EDF6 96%, #CDDBF2 100% ); + border-color: #C5D1E5; + color: #333; +} + +/* Override Bootstrap alert.alert-success */ +.alert-success { + background: linear-gradient( to bottom, #F8FFE8 0%, #E3F5AB 4%, #DCF48D 98%, #9EBF28 100% ); + border-color: #9FBA35; + color: #333; +} + +.breadcrumb { + @include border-radius-all( 7px ); + background-color: #F2F2EF; + font-size: 85%; + list-style: none outside none; + margin: 10px 20px; + padding: 5px 10px; +} + +.form-inline { + display: inline; + margin: 0; + padding: 0; + + fieldset { + margin: .3em 0; + padding: .3em; + } +} + +.main { + @include border-radius-all( 7px ); + @include shadowed; + background-color: #FFF; + border: 1px solid #D2D2CF; + margin-bottom: .5em; + margin-top: .5em; +} + +.mastheadsearch { + @include border-radius-all( 7px ); + background: linear-gradient( to bottom, #C7C7C1 38%, #A7A7A2 100% ); + margin: .5em 0; + padding: .8em; + + label { + font-size: 115%; + font-weight: bold; + } +} + +.navbar-inverse { + .brand { + color: #9FE1FF; + font-weight: bold; + } + + .nav { + > li { + > a { + color: #9FE1FF; + font-weight: bold; + } + } + } +} + +.navbar-fixed-bottom { + &.navbar-static-bottom { + margin-top: .5em; + position: static; + } +} + +.table-striped tbody > tr:nth-child(odd) > td, +.table-striped tbody > tr:nth-child(odd) > th { + background-color: #F4F4F4; +} + + +/* jQuery UI standard tabs */ +.ui-tabs-nav .ui-tabs-active a, +.ui-tabs-nav a:hover, +.ui-tabs-nav a:focus, +.ui-tabs-nav a:active, +.ui-tabs-nav span.a { + background: none repeat scroll 0 0 transparent; + outline: 0 none; +} + +.ui-widget, +.ui-widget input, +.ui-widget select, +.ui-widget textarea, +.ui-widget button { + font-family: inherit; + font-size: inherit; +} + +ul { + &.ui-tabs-nav { + li { + list-style: none; + } + } +} + +.ui-tabs { + .ui-tabs-nav { + li { + background: #F3F3F3 none; + border-color: #D8D8D8; + margin-right: .4em; + + &.ui-tabs-active { + background-color: #FFF; + border: 1px solid #D8D8D8; + border-bottom: 0; + + a { + color: #000; + font-weight: bold; + } + + &.ui-state-hover { + background: #FFF none; + } + } + + &.ui-state-default.ui-state-hover { + background: #F3F3F3 none; + } + } + } + + .ui-tabs-panel { + border: 1px solid #D8D8D8; + margin-bottom: 1em; + } + + &.ui-widget-content { + background: transparent none; + border: 0; + } + + .ui-state-default { + a { + color: #006699; + + &:link { + color: #006699; + } + + &:visited { + color: #006699; + } + } + } + + .ui-state-hover a { + color: #990033; + + &:link { + color: #990033; + } + + &:visited { + color: #990033; + } + } +} + +.ui-tabs-nav { + &.ui-widget-header { + background: none; + border: 0; + } +} + +.statictabs { + ul { + background: none repeat scroll 0 0 transparent; + border: 0 none; + border-bottom-left-radius: 4px; + border-bottom-right-radius: 4px; + border-top-left-radius: 4px; + border-top-right-radius: 4px; + color: #222222; + font-size: 100%; + font-weight: bold; + line-height: 1.3; + list-style: none outside none; + margin: 0; + outline: 0 none; + padding: .2em .2em 0; + text-decoration: none; + + &::before { + content: ""; + display: table; + } + + &::after { + clear: both; + content: ""; + display: table; + } + } + + li { + background: none repeat scroll 0 0 #E6F0F2; + border: 1px solid #B9D8D9; + border-bottom: 0 none !important; + border-top-left-radius: 4px; + border-top-right-radius: 4px; + color: #555555; + float: left; + font-weight: normal; + list-style: none outside none; + margin-bottom: 0; + margin-right: .4em; + padding: 0; + position: relative; + top: 1px; + white-space: nowrap; + + &.active { + background-color: #FFFFFF; + color: #212121; + font-weight: normal; + padding-bottom: 1px; + + a { + background: none repeat scroll 0 0 transparent; + color: #000000; + cursor: text; + font-weight: bold; + outline: 0 none; + } + } + + a { + color: #004D99; + cursor: pointer; + float: left; + padding: .5em 1em; + text-decoration: none; + + &:hover { + background-color: #EDF4F5; + border-top-left-radius: 4px; + border-top-right-radius: 4px; + color: #538200; + } + } + } + + .tabs-container { + background: none repeat scroll 0 0 transparent; + border: 1px solid #B9D8D9; + border-bottom-left-radius: 4px; + border-bottom-right-radius: 4px; + color: #222222; + display: block; + padding: 1em 1.4em; + } +} + +/* End jQueryUI tab styles */ + +/* jQuery UI Datepicker */ + +.ui-datepicker { + @include shadowed; + table { + border: 0; + border-collapse: collapse; + font-size: .9em; + margin: 0 0 .4em; + width: 100%; + } + + th { + background: transparent none; + border: 0; + font-weight: bold; + padding: .7em .3em; + text-align: center; + } +} + +.ui-datepicker-trigger { + margin: 0 3px; + vertical-align: middle; +} + +/* End jQueryUI datepicker styles */ + + +/* jQueryUI Core */ + +.ui-widget-content { + background: #FFFFFF none; + border: 1px solid #AAA; + color: #222222; + + a, + a:visited { + color: $links; + } +} + +.ui-widget-header { + background: #E6F0F2 none; + border: 1px solid #AAA; + color: #222222; + font-weight: bold; +} + +.ui-state-default, +.ui-widget-content .ui-state-default, +.ui-widget-header .ui-state-default { + background: #F4F8F9 none; + border: 1px solid #AAA; + color: #555555; + font-weight: normal; +} + +.ui-state-hover, +.ui-widget-content .ui-state-hover, +.ui-widget-header .ui-state-hover, +.ui-state-focus, +.ui-widget-content .ui-state-focus, +.ui-widget-header .ui-state-focus { + background: #E6F0F2 none; + border: 1px solid #AAA; + color: #212121; + font-weight: normal; +} + +.ui-state-active, +.ui-widget-content .ui-state-active, +.ui-widget-header .ui-state-active { + background: #FFFFFF none; + border: 1px solid #AAAAAA; + color: #212121; + font-weight: normal; +} + +.ui-state-highlight, +.ui-widget-content .ui-state-highlight, +.ui-widget-header .ui-state-highlight { + background: #FBF9EE; + border: 1px solid #FCEFA1; + color: #363636; +} + +.ui-state-error, +.ui-widget-content .ui-state-error, +.ui-widget-header .ui-state-error { + background: #FEF1EC; + border: 1px solid #CD0A0A; + color: #CD0A0A; +} + +/* end jQueryUI core */ + +/* jQueryUI autocomplete */ + +.ui-autocomplete { + @include shadowed; + cursor: default; + position: absolute; + + &.ui-widget-content .ui-state-hover { + background: #E6F0F2 none; + border: 1px solid #AAA; + color: #212121; + font-weight: normal; + } +} + +.ui-autocomplete-loading { + background: #FFF url( "../../img/loading-small.gif" ) right center no-repeat; +} + +.ui-menu li { + list-style: none; +} + +/* end jQueryUI autocomplete */ + +.item-thumbnail { + max-width: none; +} + +.no-image { + @include border-radius-all( 3px ); + background-color: #FFF; + border: 1px solid #AAA; + color: #979797; + display: block; + font-size: 86%; + font-weight: bold; + text-align: center; + width: 75px; +} + +#bookcover { + float: left; + margin: 0; + padding: 0; + + .no-image { + margin-bottom: 10px; + margin-right: 10px; + } + + img { + margin: 0 1em 1em 0; + } +} + +.required { + color: #C00; +} + + +.label { + background-color: transparent; + color: inherit; + display: inline; + font-weight: normal; + padding: 0; + text-shadow: none; +} + +.blabel { + background-color: #999999; + border-radius: 3px; + color: #FFFFFF; + display: inline-block; + font-weight: bold; + padding: 2px 4px; + text-shadow: 0 -1px 0 rgba( 0, 0, 0, .25 ); +} + +.label-important { + background-color: #B94A48; +} + +.label-warning { + background-color: #F89406; +} + +.label-success { + background-color: #468847; +} + +.label-info { + background-color: #3A87AD; +} + +.label-inverse { + background-color: #333333; +} + +fieldset { + &.rows { + clear: left; + float: left; + font-size: 90%; + margin: .9em 0 0; + padding: 0; + width: 100%; + + legend { + font-size: 130%; + font-weight: bold; + } + + label, + .label { + float: left; + font-weight: bold; + margin-right: 1em; + text-align: right; + width: 9em; + } + + label { + &.lradio { + float: none; + margin: inherit; + width: auto; + } + } + + fieldset { + margin: 0; + padding: .3em; + } + + ol { + list-style-type: none; + padding: 1em 1em 0 1em; + + &.lradio { + label { + float: none; + margin-right: 0; + width: auto; + + &.lradio { + float: left; + margin-right: 1em; + width: 12em; + } + } + } + } + + li { + clear: left; + float: left; + list-style-type: none; + padding-bottom: 1em; + width: 100%; + + &.lradio { + padding-left: 8.5em; + width: auto; + + label { + float: none; + margin: 0 0 0 1em; + width: auto; + } + } + } + + .hint { + display: block; + margin-left: 11em; + } + } + + &.action { + border: 0; + clear: both; + float: none; + margin: 0; + padding: 1em 0 .3em; + width: auto; + + p { + margin-bottom: 1em; + } + } + + table { + font-size: 100%; + } +} + +div { + &.rows { + float: left; + clear: left; + margin: 0; + padding: 0; + width: 100%; + + + div.rows { + margin-top: .6em; + } + + span { + &.label { + float: left; + font-weight: bold; + margin-right: 1em; + text-align: left; + width: 9em; + } + } + + ol { + list-style-type: none; + margin-left: 0; + padding: .5em 1em 0 0; + + li { + li { + border-bottom: 0; + } + } + } + + li { + border-bottom: 1px solid #EEE; + clear: left; + float: left; + list-style-type: none; + padding-bottom: .2em; + padding-top: .1em; + width: 100%; + } + + ul { + li { + margin-left: 7.3em; + + &:first-child { + clear: none; + float: none; + margin-left: 0; + } + } + } + } +} + +/* different sizes for different tags in opac-tags.tt */ + +.tagweight0 { + font-size: 12px; +} + +.tagweight1 { + font-size: 14px; +} + +.tagweight2 { + font-size: 16px; +} + +.tagweight3 { + font-size: 18px; +} + +.tagweight4 { + font-size: 20px; +} + +.tagweight5 { + font-size: 22px; +} + +.tagweight6 { + font-size: 24px; +} + +.tagweight7 { + font-size: 26px; +} + +.tagweight8 { + font-size: 28px; +} + +.tagweight9 { + font-size: 30px; +} + +.toolbar { + background-color: #EEEEEE; + border: 1px solid #E8E8E8; + font-size: 85%; + padding: 3px 3px 5px 5px; + vertical-align: middle; + + a { + white-space: nowrap; + } + + label { + display: inline; + font-size: 100%; + font-weight: bold; + margin-left: .5em; + } + + select { + font-size: 97%; + height: auto; + line-height: inherit; + margin: 0; + padding: 0; + white-space: nowrap; + width: auto; + } + + .hold, + #tagsel_tag { + font-size: 97%; + font-weight: bold; + padding-left: 28px; + } + + #tagsel_form { + margin-top: .5em; + } + + li { + display: inline; + list-style: none; + + a { + border-left: 1px solid #E8E8E8; + } + + &:first-child { + a { + border-left: 0; + } + } + } + + ul { + padding-left: 0; + } +} + +#basket { + .toolbar { + padding: 7px 5px 9px 9px; + } +} + +#selections-toolbar, +.selections-toolbar { + background: linear-gradient( top, #B2B2B2 0%, #E0E0E0 14%, #E8E8E8 100% ); + margin: 0 0 1em; + padding-left: 10px; + padding-top: .5em; +} + +.list-actions { + display: inline; +} + +%tag_button_default { + background-color: transparent; + background-image: url( "../images/sprite.png" ); + background-position: 1px -643px; + background-repeat: no-repeat; + border: 0; + color: #0076B2; + cursor: pointer; + font-size: 100%; + padding-left: 25px; + text-decoration: none; +} + +%tag_button_hover { + color: #005580; + text-decoration: underline; +} + +%tag_button_disabled { + color: #888888; + padding-left: 23px; + text-decoration: none; +} + +#tagsel_tag { + @extend %tag_button_default; + + &.disabled { + background-position: -1px -667px; + } +} + +#selections-toolbar { + input.hold { + &:hover { + @extend %tag_button_hover; + } + + &.disabled { + @extend %tag_button_disabled; + + &:hover { + @extend %tag_button_disabled; + } + } + } + + a.disabled { + @extend %tag_button_disabled; + + &:hover { + @extend %tag_button_disabled; + } + } +} + +#tagsel_span input { + &.submit { + @extend %tag_button_default; + } + + &:hover { + @extend %tag_button_hover; + } + + &.disabled { + @extend %tag_button_disabled; + + &:hover { + @extend %tag_button_disabled; + } + } + + &.hold.disabled { + @extend %tag_button_disabled; + + &:hover { + @extend %tag_button_disabled; + } + } +} + +.selections-toolbar a.disabled { + @extend %tag_button_disabled; + + &:hover { + @extend %tag_button_disabled; + } +} + +.results_summary { + color: #707070; + display: block; + font-size: 85%; + padding: 0 0 .5em; + + .results_summary { + font-size: 100%; + } + + &.actions { + margin-top: .5em; + } + + &.tagstatus { + display: inline; + } + + .label { + color: #202020; + } + + a { + font-weight: normal; + } +} + +#views { + margin-bottom: .5em; + padding: 0 2em .2em .2em; +} + +.view { + background-color: #F3F3F3; + border: 1px solid #C9C9C9; + border-radius: 4px; + display: inline-block; + padding: .2em .5em; + white-space: nowrap; + + a, + span { + background-image: url( "../images/sprite.png" ); + background-repeat: no-repeat; + font-size: 87%; + padding-left: 15px; + text-decoration: none; + } + + a { + font-weight: normal; + } +} + +#bibliodescriptions, +#isbdcontents { + clear: left; + margin-top: .5em; +} + +.current-view { + background-color: #FFF; + font-weight: bold; +} + +#MARCview { + background-position: -9px -27px; +} + +#ISBDview { + background-position: -10px -56px; +} + +#Normalview { + background-position: -8px 3px; +} + +/* pagination */ +.results-pagination { + background-color: #F3F3F3; + border: 1px solid #D0D0D0; + display: none; + height: auto; + left: -1px; + padding-bottom: 10px; + position: absolute; + top: 32px; + width: 100%; + z-index: 100; +} + + +.back { + float: right; + + input { + background: none !important; + color: #999 !important; + } +} + +.pagination_list { + ul { + padding-left: 0; + padding-top: 40px; + } + + li { + color: #999; + float: bottom; + list-style: none; + padding: 4px; + + &.highlight { + background-color: #F3F3F3; + border-bottom: 1px solid #DDDDDD; + border-top: 1px solid #DDDDDD; + } + + a { + padding-left: 0; + } + } + + .li_pag_index { + color: #999999; + float: left; + font-size: 15px; + font-weight: bold; + padding-right: 10px; + text-align: right; + width: 13px; + } +} + +.nav_results { + background-color: #F3F3F3; + border: 1px solid #D0D0D0; + font-size: 95%; + font-weight: bold; + margin-top: .5em; + position: relative; + + .l_Results { + a { + background: #E1E1E1 url( "../images/sprite.png" ) no-repeat 0 -504px; /* Browse results menu */ + color: #006699; + display: block; + padding: 8px 28px; + text-decoration: none; + } + + &:hover { + background-color: #D9D9D9; + } + } +} + +.pg_menu { + border-top: 1px solid #D0D0D0; + margin: 0; + white-space: nowrap; + + li { + color: #B2B2B2; + display: inline; + list-style: none; + margin: 0; + + &.back_results { + a { + border-left: 1px solid #D0D0D0; + border-right: 1px solid #D0D0D0; + } + } + + a, + span { + background-color: #F3F3F3; + display: block; + float: left; + font-weight: normal; + padding: .4em .5em; + text-align: center; + text-decoration: none; + } + + span { + color: #B2B2B2; + } + } +} + +#listResults { + li { + background-color: #999999; + color: #C5C5C5; + display: block; + font-size: 80%; + font-weight: normal; + margin-right: 1px; + min-width: 18px; + padding: 0; + text-align: center; + + &:hover { + background-color: #006699; + } + + a { + color: #FFFFFF; + font-weight: normal; + } + } +} + +/* nav */ +.nav_pages { + .close_pagination { + padding-right: 10px; + position: absolute; + right: 3px; + top: -25px; + + a { + text-decoration: none !important; + } + } + + ul { + padding-top: 10px; + } + + li { + color: #999; + float: left; + list-style: none; + padding: 4px; + + a { + text-decoration: none !important; + + &:hover { + text-decoration: underline; + } + } + + ul { + float: left; + } + } +} + +/* action buttons */ +#action { + background-color: #F3F3F3; + border: 1px solid #E8E8E8; + margin: .5em 0 0 0; + padding-bottom: 3px; + + li { + list-style: none; + margin: .2em; + padding: .3em 0; + } + + a { + font-weight: bold; + text-decoration: none; + } +} + +#export, +#moresearches_menu { + li { + margin: 0; + padding: 0; + + a { + font-weight: normal; + + &.menu-inactive { + font-weight: bold; + } + } + } +} + +#format, +#furthersearches { + padding-left: 35px; +} + +.highlight_controls { + float: left; +} + +%initial_icon { + background-image: url( "../images/sprite.png" ); + background-repeat: no-repeat; + text-decoration: none; +} + +input { + &.hold { + @extend %initial_icon; + background-color: transparent; + background-position: -2px -453px; /* Toolbar place hold */ + border: 0; + color: #0076B2; + font-weight: bold; + padding-left: 23px; + text-decoration: none; + + &.disabled { + @extend %initial_icon; + background-position: -5px -621px; /* Place hold disabled */ + } + } + + &.editshelf { + @extend %initial_icon; + background-color: transparent; + background-position: 2px -735px; /* List edit */ + border: 0; + color: #006699; + cursor: pointer; + filter: none; + font-size: 100%; + padding-left: 29px; + text-decoration: none; + + &:active { + border: 0; + } + } +} + +.newshelf { + @extend %initial_icon; + background-position: 2px -764px; /* List new */ + border: 0; + color: #006699; + cursor: pointer; + filter: none; + font-size: 100%; + padding-left: 28px; + + &.disabled { + @extend %initial_icon; + background-position: -4px -791px; /* List new disabled */ + } +} + +.deleteshelf { + @extend %initial_icon; + background-color: transparent; + background-position: 2px -688px; /* Delete */ + border: 0; + color: #006699; + cursor: pointer; + filter: none; + font-size: 100%; + padding-left: 25px; + text-decoration: none; + + &:active { + border: 0; + } + + &:hover { + color: #990033; + } +} + +.links a { + font-weight: bold; +} + +#tagslist li { + display: inline; +} + +#login4tags { + background-image: url( "../images/sprite.png" ); /* Tag results disabled */ + background-position: -6px -1130px; + background-repeat: no-repeat; + padding-left: 20px; + text-decoration: none; +} + +.tag_results_input { + font-size: 12px; + margin-left: 1em; + padding: .3em; + + input[type="text"] { + font-size: inherit; + margin: 0; + padding: 0; + } + + label { + display: inline; + } +} + +.tagsinput { + input[type="text"] { + font-size: inherit; + margin: 0; + padding: 0; + } + + label { + display: inline; + } +} + +.branch-info-tooltip { + display: none; +} + +.ui-tooltip-content p { + margin: .3em 0; +} + +#social_networks { + a { + background: transparent url( "../images/social-sprite.png" ) no-repeat; + display: block; + height: 20px !important; + text-indent: -999em; + width: 20px; + } + + span { + color: #274D7F; + display: block; + float: left; + font-size: 85%; + font-weight: bold; + line-height: 2em; + margin: .5em 0 .5em .5em !important; + } + + div { + float: left !important; + margin: .5em 0 .5em .2em !important; + } + + #facebook { + background-position: -7px -35px; + } + + #twitter { + background-position: -7px -5px; + } + + #linkedin { + background-position: -7px -95px; + } + + #delicious { + background-position: -7px -66px; + } + + #email { + background-position: -7px -126px; + } +} + +#marc { + td, + th { + background-color: transparent; + border: 0; + padding: 3px 5px; + text-align: left; + } + + td:first-child { + text-indent: 2em; + } + + p { + padding-bottom: .6em; + + .label { + font-weight: bold; + } + } + + ul { + padding-bottom: .6em; + } + + .results_summary { + clear: left; + + ul { + clear: none; + display: inline; + float: none; + list-style: none; + margin: 0; + padding: 0; + } + + li { + display: inline; + } + } +} + +#items, +#items td, +#items th { + border: 1px solid #EEE; + font-size: 90%; +} + +#plainmarc { + table { + border: 0; + font-family: monospace; + font-size: 95%; + margin: .7em 0 0; + } + + th { + background-color: #FFF; + border: 0; + padding: 2px; + text-align: left; + vertical-align: top; + white-space: nowrap; + } + + td { + border: 0; + padding: 2px; + vertical-align: top; + } +} + +#renewcontrols { + float: right; + font-size: 66%; + + a { + background-repeat: no-repeat; + padding: .1em .4em; + padding-left: 18px; + text-decoration: none; + } +} + +#renewselected_link { + background-image: url( "../images/sprite.png" ); + background-position: -5px -986px; + background-repeat: no-repeat; +} + +#renewall_link { + background-image: url( "../images/sprite.png" ); + background-position: -8px -967px; + background-repeat: no-repeat; +} + +.authref { + text-indent: 2em; + + .label { + font-style: italic; + } +} + +.authstanza { + margin-top: 1em; + + li { + margin-left: .5em; + } +} + +.authstanzaheading { + font-weight: bold; +} + +.authorizedheading { + font-weight: bold; +} + +.authres_notes, +.authres_seealso, +.authres_otherscript { + padding-top: .5em; +} + +.authres_notes { + font-style: italic; +} + +#didyoumean { + @include border-radius-all( 3px ); + background-color: #EEE; + border: 1px solid #E8E8E8; + box-sizing: border-box; + margin: .5em 1.5em; + padding: .5em; + text-align: left; + + &.dym-loaded { + background-color: #FFFBEA; + border-color: #F4ECBE; + } +} + +.suggestionlabel { + font-weight: bold; +} + +.searchsuggestion { + display: inline-block; + padding: .2em .5em; +} + +.authlink { + padding-left: .25em; +} + +#hierarchies { + a { + color: #069; + font-weight: normal; + text-decoration: underline; + + &:hover { + color: #990033; + } + } +} + +#top-pages { + margin: 0 0 .5em; +} + +.dropdown-menu { + > li { + > a { + font-size: 90%; + } + } +} + +#cartDetails, +#cartUpdate, +#holdDetails, +#listsDetails { + background-color: #FFF; + border: 1px solid rgba( 0, 0, 0, .2 ); + border-radius: 6px; + box-shadow: 0 5px 10px rgba( 0, 0, 0, .2 ); + color: black; + display: none; + font-size: 90%; + margin: 0; + padding: 8px 20px; + text-align: center; + width: 180px; + z-index: 2; +} + +#cartmenulink { + white-space: nowrap; +} + +#search-facets, +#menu { + @include border-radius-all( 7px ); + border: 1px solid #D2D2CF; + + ul { + margin: 0; + padding: .3em; + } + + form { + margin: 0; + } + + h4 { + font-size: 90%; + margin: 0 0 .6em 0; + text-align: center; + + a { + background-color: #F2F2EF; + border-bottom: 1px solid #D8D8D8; + border-radius: 8px 8px 0 0; + display: block; + font-weight: bold; + padding: .7em .2em; + text-decoration: none; + } + } + + li { + font-size: 90%; + font-weight: bold; + list-style-type: none; + + li { + font-size: 95%; + font-weight: normal; + line-height: 125%; + margin-bottom: 2px; + padding: .1em .2em; + } + + &.showmore { + a { + font-weight: bold; + text-indent: 1em; + } + } + } + + a { + font-weight: normal; + text-decoration: underline; + } + + .facet-count { + display: inline-block; + } + +} + +#menu { + font-size: 94%; + + li { + list-style-type: none; + + a { + background: #EEEEEE; + border: 1px solid #D8D8D8; + border-bottom-color: #999; + border-radius: 5px 0 0 5px; + display: block; + font-size: 111%; + margin: .4em 0; + margin-right: -1px; + padding: .4em .6em; + text-decoration: none; + + &:hover { + background: #EAEEF5; + } + } + + &.active { + a { + background-color: #FFF; + background-image: none; + border-right-width: 0; + font-weight: bold; + + &:hover { + background-color: #FFF; + } + } + } + } + + h4 { + display: none; + } +} + +#addto { + max-width: 10em; +} + +/* Search results add to cart (lists disabled) */ +.addto { + .addtocart { + background-image: url( "../images/sprite.png" ); /* Cart */ + background-position: -5px -266px; + background-repeat: no-repeat; + padding-left: 33px; + text-decoration: none; + } +} + +.searchresults { + p { + margin: 0; + padding: 0 0 .6em 0; + + &.details { + color: #979797; + } + } + + a { + &.highlight_toggle { + background-image: url( "../images/sprite.png" ); /* Highlight */ + background-position: -11px -841px; + background-repeat: no-repeat; + display: none; + font-weight: normal; + padding: 0 10px 0 21px; + } + } + + .commentline { + @include border-radius-all( 3px ); + @include shadowed; + background-color: rgba( 255, 255, 204, .4 ); + border: 1px solid #CCC; + display: inline-block; + margin: .3em; + padding: .4em; + + .yours { + background-color: rgba( 239, 254, 213, .4 ); + } + } +} + +.commentline .avatar { + float: right; + padding-left: .5em; +} + +/* style for search terms in catalogsearch */ +.term { + /* color: blue; */ + background-color: #FFFFCC; + color: #990000; +} + +/* style for shelving location in catalogsearch */ +.shelvingloc { + display: block; + font-style: italic; +} + +#CheckAll, +#CheckNone, +.CheckAll, +.CheckNone { + font-weight: normal; + margin: 0 .5em; + text-decoration: underline; +} + +.sep { + color: #888; + padding: 0 .2em 0 .5em; + text-shadow: 1px 1px 0 #FFF; +} + +%page-first-child { + border-bottom-left-radius: 3px; + border-top-left-radius: 3px; + border-width: 1px; +} + +%page-last-child { + border-bottom-right-radius: 3px; + border-top-right-radius: 3px; + border-width: 1px 1px 1px 0; +} + +%page-middle-child { + background-color: #FFFFFF; + border-color: #DDDDDD; + border-image: none; + border-style: solid; + border-width: 1px 1px 1px 0; + float: left; + font-size: 11.9px; + line-height: 20px; + padding: 4px 12px; + text-decoration: none; +} + +.pages { + margin: 20px 0; + + span { + &:first-child { + @extend %page-first-child; + } + + &:last-child { + @extend %page-last-child; + } + } + + a { + @extend %page-middle-child; + + &:first-child { + @extend %page-first-child; + } + + &:last-child { + @extend %page-last-child; + } + } + + .inactive { + @extend %page-middle-child; + background-color: #F5F5F5; + } + + .currentPage { + @extend %page-middle-child; + } + + a[rel='last'] { + border-bottom-right-radius: 3px; + border-top-right-radius: 3px; + } +} + +.hold-message { + @include border-radius-all( 3px ); + background-color: #FFF0B1; + display: inline-block; + margin: .5em; + padding: .2em .5em; +} + +.reserve_date, +.expiration_date { + white-space: nowrap; +} + +.close { + color: #0088CC; + filter: none; + float: none; + font-size: inherit; + font-weight: normal; + opacity: inherit; + position: inherit; + right: auto; + text-shadow: none; + top: auto; +} + +.close:hover { + color: #538200; + filter: inherit; + font-size: inherit; + opacity: inherit; +} + +/* Redefine a new style for Bootstrap's class "close" since we use that already */ +/* Use × */ + +.modal-header .closebtn { + margin-top: 2px; +} + +.closebtn { + color: #000000; + float: right; + font-size: 20px; + font-weight: bold; + line-height: 20px; + opacity: .2; + text-shadow: 0 1px 0 #FFFFFF; + + &:hover { + color: #000000; + cursor: pointer; + opacity: .4; + text-decoration: none; + } +} + +button.closebtn { + background: transparent; + border: 0; + cursor: pointer; + padding: 0; +} + +.btn-group { + label, + select { + font-size: 13px; + } +} + +.span2 select { + width: 100%; +} + +.item-status { + display: block; + font-size: 95%; + margin-bottom: .5em; +} + +.available { + color: #006600; +} + +.unavailable { + color: #990033; +} + +.waiting, +.intransit, +.notforloan, +.checkedout, +.lost, +.notonhold { + display: block; +} + +.notforloan { + color: #900; +} + +.lost { + color: #666; +} + +.suggestion { + @include border-radius-all( 3px ); + background-color: #EEEEEB; + border: 1px solid #DDDED3; + margin: 1em auto; + padding: .5em; + width: 35%; +} + +.librarypulldown .transl1 { + width: auto; +} + +.nolibrarypulldown { + width: 68%; + + .transl1 { + width: 87%; + } +} + +#opac-main-search { + select { + max-width: 12em; + width: auto; + } +} + +#logo { + background: transparent url( "../images/koha-logo-navbar.png" ) no-repeat scroll 0%; + border: 0; + float: left !important; + margin: 0; + padding: 0; + width: 100px; + + a { + border: 0; + cursor: pointer; + display: block; + height: 0 !important; + margin: 0; + overflow: hidden; + padding: 40px 0 0; + text-decoration: none; + width: 100px; + } +} + +#user-menu-trigger { + display: none; + + .icon-user { + background: transparent url( "../lib/bootstrap/img/glyphicons-halflings-white.png" ) no-repeat; + background-position: -168px 0; + background-repeat: no-repeat; + height: 14px; + line-height: 14px; + margin: 12px 0 0; + vertical-align: text-top; + width: 14px; + } + + .caret { + border-bottom-color: #999999; + border-top-color: #999999; + margin-top: 18px; + } +} + +/* Class to be added to toolbar when it starts being fixed at the top of the screen*/ +.floating { + box-shadow: 0 3px 2px 0 rgba( 0, 0, 0, .4 ); + margin-top: 0; +} + +.tdlabel { + display: none; + font-weight: bold; +} + +#ulactioncontainer { + min-width: 16em; +} + +.notesrow { + label { + font-weight: bold; + } + + span { + display: block; + } +} + +.thumbnail-shelfbrowser span { + margin: 0 auto; +} + +.table { + .sorting_asc { + background: url( "../images/asc.gif" ) no-repeat scroll right center #ECEDE6; + padding-right: 19px; + } + + .sorting_desc { + background: url( "../images/desc.gif" ) no-repeat scroll right center #ECEDE6; + padding-right: 19px; + } + + .sorting { + background: url( "../images/ascdesc.gif" ) no-repeat scroll right center #ECEDE6; + padding-right: 19px; + } + + .nosort, + .nosort.sorting_asc, + .nosort.sorting_desc, + .nosort.sorting { + background: #ECEDE6 none; + padding-right: 19px; + } + + th, + td { + line-height: 135%; + } +} + +.tags, +.shelves { + ul { + display: inline; + list-style: none; + margin-left: 0; + + li { + display: inline; + } + } +} + +.coverimages { + float: right; +} + +#i18nMenu { + margin-left: 1em; + + li { + font-size: 85%; + + li { + font-size: 100%; + + > a { + font-size: 100%; + } + + &:hover { + color: #FFF; + } + } + + a { + color: $links; + } + } + + .dropdown-menu { + li { + p { + clear: both; + display: block; + font-weight: normal; + line-height: 20px; + padding: 3px 20px; + white-space: nowrap; + } + } + } +} + +#subjectsList, +#authorSearch { + label { + display: inline; + vertical-align: middle; + } + + ul { + border-bottom: 1px solid #EEE; + list-style-type: none; + margin: 0; + padding: .6em 0; + } + + li { + list-style-type: none; + margin: 0; + padding: 0; + } +} + + +#overdrive-results, +#openlibrary-results { + font-weight: bold; + padding-left: 1em; +} + +.throbber { + vertical-align: middle; +} + +#overdrive-results-list .star-rating-control { + display: block; + overflow: auto; +} + +#shelfbrowser { + table { + margin: 0; + } + + table, + td, + th { + border: 0; + font-size: 90%; + text-align: center; + } + + td, + th { + padding: 3px 5px; + width: 20%; + } + + a { + display: block; + font-size: 110%; + font-weight: bold; + text-decoration: none; + } + + #browser_next, + #browser_previous { + background-image: url( "../images/sprite.png" ); + background-repeat: no-repeat; + width: 16px; + + a { + cursor: pointer; + display: block; + height: 0 !important; + margin: 0; + overflow: hidden; + padding: 50px 0 0; + text-decoration: none; + width: 16px; + } + } + + #browser_previous { + background-position: -9px -1007px; + } + + #browser_next { + background-position: -9px -1057px; + } +} + +#holds { + margin: 0 auto; + max-width: 800px; +} + +.holdrow { + border-bottom: 1px solid #CCC; + clear: both; + margin-bottom: .5em; + padding: 0 1em 1em 1em; + + fieldset { + border: 0; + float: none; + margin: 0; + + .label { + font-size: 14px; + } + } + + label { + display: inline; + } +} + +.hold-options { + clear: both; +} + +.toggle-hold-options { + background-color: #EEE; + clear: both; + display: block; + font-weight: bold; + margin: 1em 0; + padding: .5em; +} + +.copiesrow { + clear: both; +} + +#idreambooksreadometer { + float: right; +} + +.idreambookslegend { + font-size: small; +} + +.idreambookssummary { + a { + color: #707070; + text-decoration: none; + } + + img { + vertical-align: middle; + } +} + +.idbresult { + color: #29ADE4; + margin: .5em; + padding: .5em; + text-align: center; + + img { + padding-right: 6px; + vertical-align: middle; + } + + a, + a:visited { + text-decoration: none; + color: #29ADE4; + } +} + +.js-show { + display: none; +} + +.modal-nojs { + .modal-header, + .modal-footer { + display: none; + } +} + +.contents { + width: 75%; + + .t:first-child::before { + content: "→ "; + } + + .t::before { + content: "\A → "; + white-space: pre; + } + + .t { + font-weight: bold; + display: inline; + } + + .r { + display: inline; + } +} + + +.contentblock { + font-size: 95%; + line-height: 135%; + margin-left: 2em; + position: relative; +} + +.m880 { + display: block; + float: right; + padding-left: 20px; + text-align: right; + width: 50%; +} + +#memberentry-form { + input.error { + border-color: #C00; + box-shadow: 0 1px 1px #C00 inset, 0 0 8px #C00; + color: #F00; + outline: 0 none; + + &:focus { + border-color: #C00; + box-shadow: 0 1px 1px #C00 inset, 0 0 8px #C00; + color: #F00; + outline: 0 none; + } + + label.error { + color: #C00; + float: none; + font-size: 90%; + } + } +} + + +#illrequests { + .illrequest-actions { + margin-bottom: 20px; + padding-top: 20px; + + .btn, + .cancel { + margin-right: 5px; + } + } + + #illrequests-create-button { + margin-bottom: 20px; + } + + .bg-info { + overflow: auto; + position: relative; + + #search-summary { + position: absolute; + top: 50%; + transform: translateY( -50% ); + } + + } + + #freeform-fields .custom-name { + float: left; + margin-right: 1em; + text-align: right; + width: 8em; + } + + .dropdown:hover .dropdown-menu.nojs { + display: block; + } +} + +#dc_fieldset { + border: 1px solid #DDDDDD; + border-radius: 10px; + border-width: 1px; + padding: 5px; +} + +.label_dc { + cursor: pointer; + display: inline; + margin: 0; + padding: 0; +} + +.btn-danger { + color: white !important; +} + +.count_label { + $base: #369; + background-color: $base; + border-radius: 5px; + color: #FFF; + display: inline-block; + font-weight: bold; + min-width: 1.5em; + padding: .2em; + text-align: center; + text-shadow: 0 -1px 0 rgba( 0, 0, 0, .25 ); + + &:hover { + background-color: lighten( $base, 20% ); + } +} + +.user_overdues_count, +.user_fines_count { + background-color: #990000; + + &:hover { + background-color: lighten( #990000, 10% ); + } +} + +.user_holds_waiting_count { + background-color: #538200; + + &:hover { + background-color: lighten( #538200, 10% ); + } +} + +#user_summary { + border: 1px solid #EAEAE6; + border-radius: 7px; + margin-bottom: 1em; + padding-bottom: .5em; + + h3 { + background-color: #EAEAE6; + border-top-left-radius: 6px; + border-top-right-radius: 6px; + box-shadow: 0 1px 1px 0 rgba( 0, 0, 0, .2 ); + margin-top: 0; + padding: .2em 0; + text-align: center; + } + + ul { + list-style-type: none; + margin: 0 0 .2em 0; + + a { + display: block; + font-weight: bold; + padding: .2em 1em; + } + } +} + +@import "responsive"; diff --git a/koha-tmpl/opac-tmpl/bootstrap/css/src/print.scss b/koha-tmpl/opac-tmpl/bootstrap/css/src/print.scss new file mode 100644 index 0000000000..9636cac381 --- /dev/null +++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/print.scss @@ -0,0 +1,251 @@ +a:link { + color: #000066; + text-decoration: none; +} + +a:visited { + color: #000066; + text-decoration: none; +} + +a:hover { + color: #993300; + text-decoration: none; +} + +body { + background-color: #FFF; + color: #333333; + font-family: arial, geneva, sans-serif; + font-size: 14px; + margin: 0; + word-wrap: break-word; +} + +caption { + color: #000066; + font-size: 18px; + font-weight: bold; + margin-top: 5px; + text-align: left; +} + +.table { + width: 100%; +} + +form { + margin: 0; + padding: 0; +} + +h1 { + color: #000066; + font-size: 22px; + font-weight: bold; + margin-bottom: 3px; + margin-top: 3px; +} + +h2 { + color: #000066; + font-size: 20px; + font-weight: bold; + margin-bottom: 3px; + margin-top: 3px; +} + +h3 { + color: #000066; + font-size: 18px; + font-weight: bold; + margin-bottom: 3px; + margin-top: 3px; +} + +h4 { + color: #000066; + font-size: 16px; + font-weight: bold; + margin-bottom: 3px; + margin-top: 3px; +} + +h5 { + color: #000066; + font-size: 15px; + font-weight: bold; + margin-bottom: 1px; + margin-top: 1px; +} + +h6 { + color: #000066; + font-size: 14px; + font-weight: bold; + margin-bottom: 1px; + margin-top: 1px; +} + +p { + margin-top: 0; +} + +table { + background-color: #FFFFFF; + border-bottom: 0 solid #CCCCCC; + border-collapse: collapse; + border-left: 0 solid #CCCCCC; + margin: 3px 0 5px 0; + padding: 0; + width: 99%; +} + +td { + background-color: #FFF; + border-bottom: 1px solid #CCCCCC; + border-right: 1px solid #CCCCCC; + padding: 5px; + vertical-align: top; +} + +td:last-child { + background-color: #FFF; + border-bottom: 1px solid #CCCCCC; + border-right: 0 solid #CCCCCC; + padding: 5px; + vertical-align: top; +} + +th { + background-color: #E9E9E9; + border-bottom: 1px solid #CCCCCC; + border-right: 1px solid #CCCCCC; + font-weight: bold; + padding: 5px; +} + +th:last-child { + background-color: #E9E9E9; + border-bottom: 1px solid #CCCCCC; + border-right: 0 solid #CCCCCC; + font-weight: bold; + padding: 5px; +} + +tr.highlight { + background-color: #E9E9E9; +} + +body#basket tr.highlight { + background-color: transparent; +} + +body#basket a { + font-weight: bold; +} + +body#basket table { + border-left: 1px solid #EEE; + border-top: 1px solid #EEE; +} +body#basket td, +body#basket th { + background-color: transparent; + padding: 2px; +} + +body#basket th { + background-color: #EEE; +} + +body#basket th, +body#basket th[scope=col] { + text-align: center; + vertical-align: middle; +} + +body#basket th[scope=row] { + font-size: 89%; + text-align: right; + vertical-align: top; + width: 10%; +} + +body#basket p { + font-size: 85%; + margin: .2em 0; + text-indent: .5em; +} + +.error { + font-weight: bold; +} + +.ex { + font-family: "Courier New", Courier, monospace; +} + +.inline { + display: inline; +} + +#bookcover { + float: left; + margin: 0; + padding: 0; +} + +#userresults { + display: block; + position: absolute; + right: 0; + word-wrap: break-word; +} + +#userupdate input, +#userupdate textarea { + border: 0; + display: inline; +} + +#action, +#addshelf, +#bibliodescriptions .ui-tabs-nav, +#export, +#facetcontainer, +#members, +#navigation, +#opac-main-search, +#opac-user-views .ui-tabs-nav, +#remove-selected, +#selections-toolbar, +#toolbar, +.actions, +.breadcrumb, +.ft, +.koha_url, +.list-actions, +.navbar, +.noprint, +.pages, +.results_summary.actions, +.screen, +.suggestion, +.views, +a[href]:after, +fieldset.action, +h2 span.hint, +input, +td.resultscontrol { + display: none; +} + +.row-fluid { + margin-top: 30px; +} + +#views, +#ulactioncontainer { + display: none; +} diff --git a/koha-tmpl/opac-tmpl/bootstrap/less/right-to-left.less b/koha-tmpl/opac-tmpl/bootstrap/css/src/right-to-left.scss similarity index 63% rename from koha-tmpl/opac-tmpl/bootstrap/less/right-to-left.less rename to koha-tmpl/opac-tmpl/bootstrap/css/src/right-to-left.scss index d2d75b8bcd..fba7f5baa7 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/less/right-to-left.less +++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/right-to-left.scss @@ -1,11 +1,57 @@ .popup { - padding-right : 0; padding-left: 0; + padding-right: 0; } a { &.cancel { - padding-right : 1em; + padding-right: 1em; + } + + &.addtocart, + &.addtoshelf, + &.highlight_toggle, + &.incart, + &.print-large, + &.reserve { + padding-right: 35px; + } + + &.brief, + &.tag_add, + &.detail { + padding-right: 27px; + } + + &.download { + padding-right: 20px; + } + + &.editshelf { + padding-right: 26px; + } + + &.hide { + padding-right: 26px; + } + + &.empty, + &.print-small { + padding-right: 30px; + } + + &.hold, + &.new { + padding-right: 23px; + } + + &.removeitems, + &.deleteshelf { + padding-right: 25px; + } + + &.send { + padding-right: 28px; } } @@ -14,66 +60,85 @@ h1 { float: right !important; } } + +input.hold { + padding-right: 23px; +} + caption { text-align: right; } #basketcount { span { - margin : 0 .9em 0 0; + margin: 0 .9em 0 0; } } #koha_url p { - float : left; + float: left; } .actions { a { &.hold { - margin-left : 1em; - padding-right : 21px; + margin-left: 1em; + padding-right: 21px; } + &.addtocart { - margin-left : 1em; - padding-right : 20px; + margin-left: 1em; + padding-right: 20px; } + &.addtoshelf { - margin-left : 1em; - padding-right : 20px; + margin-left: 1em; + padding-right: 20px; } + &.addtolist { - margin-left : 1em; - padding-right : 20px; + margin-left: 1em; + padding-right: 20px; } + &.tag_add { - margin-left : 1em; - padding-right : 20px; + margin-left: 1em; + padding-right: 20px; } + /* List contents remove from list link */ - &.removefromlist { - margin-left : 1em; - padding-right : 15px; + &.removefromlist { + margin-left: 1em; + padding-right: 15px; } } } .ui-tabs .ui-tabs-nav li { - margin-left : .4em; + margin-left: .4em; } .statictabs { li { float: right; - margin-left: 0.4em; + margin-left: .4em; + a { float: right; } } } -#bookcover .no-image { - margin-left : 10px; +#bookcover { + float: right; + + img { + margin: 0 0 1em 1em; + } + + .no-image { + margin-left: 10px; + } } th.sum { @@ -81,37 +146,43 @@ th.sum { } th[scope=row] { - text-align : left; + text-align: left; } fieldset { &.rows { - float : right; - clear : right; + clear: right; + float: right; + label, .label { float: right; margin-left: 1em; text-align: left; } + ol { &.lradio { label { - margin-left : 0; + margin-left: 0; + &.lradio { - float : right; - margin-left : 1em; + float: right; + margin-left: 1em; } } } } + li { - float : right; - clear : right; + clear: right; + float: right; + &.lradio { padding-right: 8.5em; + label { - margin : 0 1em 0 0; + margin: 0 1em 0 0; } } } @@ -119,25 +190,30 @@ fieldset { } div.rows { - float : right; - clear : right; - span.label { + float: right; + clear: right; + + .label { float: right; margin-left: 1em; text-align: right; } + ol { - margin-right : 0; + margin-right: 0; padding: .5em 0 0 1em; } + li { - float : right; - clear : right; + clear: right; + float: right; } + ul { li { - margin-right : 7.3em; + margin-right: 7.3em; + &:first-child { margin-right: 0; } @@ -146,26 +222,31 @@ div.rows { } .toolbar { - padding:3px 5px 5px 3px; + padding: 3px 5px 5px 3px; + label { - margin-right : .5em; + margin-right: .5em; } + .hold, #tagsel_tag { padding-right: 28px; } + li { a { - border-right : 1px solid #e8e8e8; + border-right: 1px solid #E8E8E8; } + &:first-child { a { - border-right : 0; + border-right: 0; } } } + ul { - padding-right : 0; + padding-right: 0; } } @@ -174,12 +255,12 @@ div.rows { } #selections-toolbar { - padding-right : 10px; + padding-right: 10px; } #tagsel_span input.submit, #tagsel_tag { - padding-right : 25px; + padding-right: 25px; } #tagsel_span input.disabled, @@ -190,26 +271,16 @@ div.rows { #selections-toolbar input.hold.disabled:hover, #selections-toolbar a.disabled, #selections-toolbar a.disabled:hover { - padding-right : 23px; + padding-right: 23px; } #views { - padding : 0 0.2em 0.2em 2em; + padding: 0 .2em .2em 2em; } #bibliodescriptions, #isbdcontents { - clear : right; -} - -#bookcover { - float : right; - .no-image { - margin-left : 10px; - } - img { - margin : 0 0 1em 1em; - } + clear: right; } /* pagination */ @@ -219,18 +290,20 @@ div.rows { .back { - float:left; + float: left; } .pagination_list { ul { - padding-right:0px; + padding-right: 0; } + li { a { - padding-right:0px; + padding-right: 0; } } + .li_pag_index { float: right; padding-left: 10px; @@ -242,134 +315,63 @@ div.rows { li { &.back_results { a { - border-right: 1px solid #D0D0D0; border-left: 1px solid #D0D0D0; + border-right: 1px solid #D0D0D0; } } + a, span { - float:right; + float: right; } } } #listResults{ li { - margin-left:1px; + margin-left: 1px; } } /* nav */ .nav_pages { .close_pagination { - padding-left: 10px; left: 3px; + padding-left: 10px; } + li { - float:right; + float: right; + ul { - float:right; + float: right; } } } #format, #furthersearches { - padding-right : 35px; + padding-right: 35px; } .highlight_controls { float: right; } -a.addtocart { - padding-right : 35px; -} - -a.addtoshelf { - padding-right : 35px; -} - -a.brief { - padding-right : 27px; -} - -a.detail { - padding-right : 27px; -} - -a.download { - padding-right : 20px; -} - -a.editshelf { - padding-right : 26px; -} - -a.empty { - padding-right : 30px; -} - -a.hide { - padding-right : 26px; -} - -a.highlight_toggle { - padding-right : 35px; -} - -a.hold, -input.hold { - padding-right : 23px; -} - -a.incart { - padding-right : 35px; -} - -a.new { - padding-right : 23px; -} - -a.print-small { - padding-right : 30px; -} - -a.print-large { - padding-right : 35px; -} - -a.removeitems, -a.deleteshelf { - padding-right : 25px; -} - -a.reserve { - padding-right : 35px; -} - -a.send { - padding-right : 28px; -} - -a.tag_add { - padding-right : 27px; -} - input.editshelf { - padding-right : 29px; + padding-right: 29px; } .newshelf { - padding-right : 28px; + padding-right: 28px; } .deleteshelf { - padding-right : 25px; + padding-right: 25px; } #login4tags { - padding-right : 20px; + padding-right: 20px; } .tag_results_input { @@ -378,27 +380,27 @@ input.editshelf { #social_networks { span { - float : right; - margin : .5em .5em .5em 0 !important; + float: right; + margin: .5em .5em .5em 0 !important; } div { - float : right !important; - margin : .5em .2em .5em 0 !important; + float: right !important; + margin: .5em .2em .5em 0 !important; } } #marc { td, th { - text-align : right; + text-align: right; } .results_summary { - clear : right; + clear: right; } } #plainmarc th { - text-align:right; + text-align: right; } #renewcontrols { @@ -427,13 +429,15 @@ input.editshelf { } #menu { - border : 0 solid #D8D8D8; + border: 0 solid #D8D8D8; border-left-width: 1px; + li { a { border-radius: 0 5px 5px 0; margin-left: -1px; } + &.active { a { border-left-width: 0; @@ -445,20 +449,20 @@ input.editshelf { /* Search results add to cart (lists disabled) */ .addto a.addtocart { - padding-right : 33px; + padding-right: 33px; } .searchresults { a { &.highlight_toggle { - padding : 0 21px 0 10px; + padding: 0 21px 0 10px; } } } .commentline .avatar { - float : left; - padding-right : .5em; + float: left; + padding-right: .5em; } span.sep { @@ -475,9 +479,9 @@ span.sep { .pages span:last-child, .pages a:last-child { - border-width: 1px 0 1px 1px; border-bottom-left-radius: 3px; border-top-left-radius: 3px; + border-width: 1px 0 1px 1px; } .pages .inactive, @@ -493,7 +497,7 @@ span.sep { } .close { - left : auto; + left: auto; } /* Redefine a new style for Bootstrap's class "close" since we use that already */ @@ -501,34 +505,37 @@ span.sep { .alert .closebtn { left:-21px; } + .closebtn { - float:left; + float: left; } #logo { - float : right !important; + float: right !important; } /* Class to be added to toolbar when it starts being fixed at the top of the screen*/ .floating { - -webkit-box-shadow: 0px 0px 2px 3px rgba(0, 0, 0, .4); - box-shadow: 0px 0px 2px 3px rgba(0, 0, 0, .4); + box-shadow: 0 0 2px 3px rgba( 0, 0, 0, .4 ); } .table { .sorting_asc { - padding-left: 19px; background: url("../images/asc.gif") no-repeat scroll left center #ECEDE6; + padding-left: 19px; } + .sorting_desc { padding-left: 19px; background: url("../images/desc.gif") no-repeat scroll left center #ECEDE6; } + .sorting { padding-left: 19px; background: url("../images/ascdesc.gif") no-repeat scroll left center #ECEDE6; } + .nosort, .nosort.sorting_asc, .nosort.sorting_desc, @@ -536,18 +543,19 @@ span.sep { padding-left: 19px; } } + .tags { ul { - margin-right : 0; + margin-right: 0; } } .coverimages { - float : left; + float: left; } #i18nMenu { - margin-right : 1em; + margin-right: 1em; } #overdrive-results { @@ -556,6 +564,6 @@ span.sep { .navbar { .pull-right { - float : left; + float: left; } -} \ No newline at end of file +} diff --git a/koha-tmpl/opac-tmpl/bootstrap/less/mixins.less b/koha-tmpl/opac-tmpl/bootstrap/less/mixins.less deleted file mode 100644 index ef5c5f8be1..0000000000 --- a/koha-tmpl/opac-tmpl/bootstrap/less/mixins.less +++ /dev/null @@ -1,12 +0,0 @@ -@links : #0076B2; -@color : #999999; -.shadowed { - -webkit-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, .2); - -moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, .2); - box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, .2); -} -.border-radius-all(@radius: 3px) { - -webkit-border-radius: @radius; - -moz-border-radius: @radius; - border-radius: @radius; -} \ No newline at end of file diff --git a/koha-tmpl/opac-tmpl/bootstrap/less/opac.less b/koha-tmpl/opac-tmpl/bootstrap/less/opac.less deleted file mode 100644 index 92e6e0377d..0000000000 --- a/koha-tmpl/opac-tmpl/bootstrap/less/opac.less +++ /dev/null @@ -1,2634 +0,0 @@ -@import "mixins.less"; -body { - background-color: #EAEAE6; -} - - /* Sticky footer styles */ -html, -body { - height: 100%; - /* The html and body elements cannot have any padding or margin. */ -} - -.no-js { - .dateformat { - display: inline; - white-space: nowrap; - } - .modal-body { - padding: 0; - } - .selections-toolbar { - display: none; - } -} - -.js { - .dateformat { - display: none; - } -} - -/* Wrapper for page content to push down footer */ -#wrap { - min-height: 100%; - height: auto !important; - height: 100%; - /* Negative indent footer by it's height */ - // margin: 0 auto -60px; -} - -/* Set the fixed height of the footer here */ -#changelanguage { - // height: 60px; -} - -.popup { - padding-left : 0; - padding-right: 0; -} - -a { - color: @links; - &.cancel { - padding-left : 1em; - } - &:visited { - color: @links; - } - &.title { - font-weight: bold; - font-size : 108%; - } - &.btn { - &:visited { - color : #333; - } - } - &.btn-primary { - &:visited { - color : #FFF; - } - } - &.login-link { - color: #A6D8ED; - font-weight: bold; - } -} - -.ui-widget-content a, -.ui-widget-content a:visited { - color: @links; -} - -h1 { - font-size : 140%; - line-height: 150%; - &#libraryname { - background: transparent url(../images/logo-koha.png) no-repeat scroll 0%; - border: 0; - float: left !important; - margin: 0; - padding: 0; - width: 120px; - a { - border: 0; - cursor: pointer; - display: block; - height: 0px !important; - margin: 0; - overflow: hidden; - padding: 40px 0 0; - text-decoration: none; - width: 120px; - } - } -} - -h2 { - - font-size : 130%; - line-height: 150%; -} -h3 { - - font-size : 120%; - line-height: 150%; -} -h4 { - - font-size : 110%; -} -h5 { - - font-size : 100%; -} - -caption { - font-size: 120%; - font-weight: bold; - margin : 0; - text-align: left; -} - -input, -textarea { - width: auto; -} - -.input-fluid { - width : 50%; -} - -legend { - font-size: 110%; - font-weight: bold; -} - -table, td { - background-color: #FFF; -} - -td { - .btn { - white-space: nowrap; - } - .btn-link { - padding: 0; - } -} - -#advsearches, -#booleansearch { - label { - display: inline; - } -} - -#basketcount { - display : inline; - margin : 0; - padding : 0; - span { - background-color : #FFC; - color : #000; - display : inline; - font-size : 80%; - font-weight : normal; - margin : 0 0 0 .9em; - padding : 0 .3em 0 .3em; - .border-radius-all(3px); - } -} - - -#members { - display: block; - p { - color : #EEE; - } - a { - &.logout { - color : #E8583C; - font-weight: bold; - padding : 0 .3em 0 .3em; - } - } -} - -#koha_url p { - color: #666666; - float : right; - margin: 0; -} - -#moresearches { - margin: .5em 0; - padding: 0 .8em; - li { - display: inline; - white-space: nowrap; - &:after { - content : " | "; - } - - } - ul { - margin : 0; - } -} - -#moresearches li:last-child:after { - content : ""; -} - -#news { - margin : .5em 0; -} - -.newscontainer { - border: 1px solid #ddd; - border-bottom-width: 0; - border-top-left-radius: 5px; - border-top-right-radius: 5px; -} - -.newsheader { - background-color: #ecede6; - border-bottom: 1px solid #ddd; - margin: 0; - padding: 8px; -} - -.newsbody { - padding: 8px; -} - -.newsfooter { - border-bottom: 1px solid #ddd; - font-style: italic; - padding: 4px 8px; -} - -#opacheader { - background-color: #DDD; -} - -#selections, -.selections { - font-weight : bold; -} - -.actions { - a { - white-space: nowrap; - &.hold { - background-image : url("../images/sprite.png"); /* Place hold small */ - background-position : -5px -542px; - background-repeat: no-repeat; - margin-right : 1em; - padding-left : 21px; - text-decoration : none; - } - &.article_request { - background-image : url("../images/sprite.png"); /* Place hold small */ - background-position : -2px -26px; - background-repeat: no-repeat; - margin-right : 1em; - padding-left : 21px; - text-decoration : none; - } - &.addtocart { - background-image : url("../images/sprite.png"); /* Cart small */ - background-position : -5px -572px; - background-repeat: no-repeat; - margin-right : 1em; - padding-left : 20px; - text-decoration : none; - } - &.addtoshelf { - background-image : url("../images/sprite.png"); /* MARC view */ - background-position: -5px -27px; - background-repeat: no-repeat; - margin-right : 1em; - padding-left : 20px; - text-decoration : none; - } - &.addtolist { - background-position: -5px -27px; - margin-right : 1em; - padding-left : 20px; - text-decoration : none; - } - &.tag_add { - background-position: -5px -1110px; - margin-right : 1em; - padding-left : 20px; - text-decoration : none; - } - /* List contents remove from list link */ - &.removefromlist { - background-position : -8px -690px; /* Delete */ - margin-right : 1em; - text-decoration : none; - padding-left : 15px; - } - } -} - -/* Override Bootstrap alert */ -.alert { - background: #fffbe5; /* Old browsers */ - background: -moz-linear-gradient(top, #fffbe5 0%, #fff0b2 9%, #fff1a8 89%, #f7e665 100%); /* FF3.6+ */ - background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fffbe5), color-stop(9%,#fff0b2), color-stop(89%,#fff1a8), color-stop(100%,#f7e665)); /* Chrome,Safari4+ */ - background: -webkit-linear-gradient(top, #fffbe5 0%,#fff0b2 9%,#fff1a8 89%,#f7e665 100%); /* Chrome10+,Safari5.1+ */ - background: -o-linear-gradient(top, #fffbe5 0%,#fff0b2 9%,#fff1a8 89%,#f7e665 100%); /* Opera 11.10+ */ - background: -ms-linear-gradient(top, #fffbe5 0%,#fff0b2 9%,#fff1a8 89%,#f7e665 100%); /* IE10+ */ - background: linear-gradient(to bottom, #fffbe5 0%,#fff0b2 9%,#fff1a8 89%,#f7e665 100%); /* W3C */ - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fffbe5', endColorstr='#f7e665',GradientType=0 ); /* IE6-9 */ - border-color : #D6C43B; - color: #333; -} - -/* Override Bootstrap alert.alert-info */ -.alert-info { - background: #f4f6fa; /* Old browsers */ - background: -moz-linear-gradient(top, #f4f6fa 0%, #eaeef5 4%, #e8edf6 96%, #cddbf2 100%); /* FF3.6+ */ - background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f4f6fa), color-stop(4%,#eaeef5), color-stop(96%,#e8edf6), color-stop(100%,#cddbf2)); /* Chrome,Safari4+ */ - background: -webkit-linear-gradient(top, #f4f6fa 0%,#eaeef5 4%,#e8edf6 96%,#cddbf2 100%); /* Chrome10+,Safari5.1+ */ - background: -o-linear-gradient(top, #f4f6fa 0%,#eaeef5 4%,#e8edf6 96%,#cddbf2 100%); /* Opera 11.10+ */ - background: -ms-linear-gradient(top, #f4f6fa 0%,#eaeef5 4%,#e8edf6 96%,#cddbf2 100%); /* IE10+ */ - background: linear-gradient(to bottom, #f4f6fa 0%,#eaeef5 4%,#e8edf6 96%,#cddbf2 100%); /* W3C */ - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f6fa', endColorstr='#cddbf2',GradientType=0 ); /* IE6-9 */ - border-color : #C5D1E5; - color: #333; -} - -/* Override Bootstrap alert.alert-success */ -.alert-success { - background: #f8ffe8; /* Old browsers */ - background: -moz-linear-gradient(top, #f8ffe8 0%, #e3f5ab 4%, #dcf48d 98%, #9ebf28 100%); /* FF3.6+ */ - background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8ffe8), color-stop(4%,#e3f5ab), color-stop(98%,#dcf48d), color-stop(100%,#9ebf28)); /* Chrome,Safari4+ */ - background: -webkit-linear-gradient(top, #f8ffe8 0%,#e3f5ab 4%,#dcf48d 98%,#9ebf28 100%); /* Chrome10+,Safari5.1+ */ - background: -o-linear-gradient(top, #f8ffe8 0%,#e3f5ab 4%,#dcf48d 98%,#9ebf28 100%); /* Opera 11.10+ */ - background: -ms-linear-gradient(top, #f8ffe8 0%,#e3f5ab 4%,#dcf48d 98%,#9ebf28 100%); /* IE10+ */ - background: linear-gradient(to bottom, #f8ffe8 0%,#e3f5ab 4%,#dcf48d 98%,#9ebf28 100%); /* W3C */ - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8ffe8', endColorstr='#9ebf28',GradientType=0 ); /* IE6-9 */ - border-color : #9FBA35; - color: #333; -} - -.breadcrumb { - background-color: #F2F2EF; - font-size: 85%; - list-style: none outside none; - margin: 10px 20px; - padding: 5px 10px; - .border-radius-all(7px); -} - -.form-inline { - display : inline; - padding: 0; - margin: 0; - fieldset { - margin: 0.3em 0; - padding: 0.3em; - } -} - -.main { - background-color: #FFF; - border: 1px solid #D2D2CF; - .border-radius-all(7px); - .shadowed; - margin-top : 0.5em; - margin-bottom: 0.5em; -} - -.mastheadsearch { - .border-radius-all(7px); - padding: .8em; - margin: .5em 0; - background: #c7c7c1; - /* Old browsers */ - background: -moz-linear-gradient(top, #c7c7c1 38%, #a7a7a2 100%); - /* FF3.6+ */ - background: -webkit-gradient(linear, left top, left bottom, color-stop(38%,#c7c7c1), color-stop(100%,#a7a7a2)); - /* Chrome,Safari4+ */ - background: -webkit-linear-gradient(top, #c7c7c1 38%,#a7a7a2 100%); - /* Chrome10+,Safari5.1+ */ - background: -o-linear-gradient(top, #c7c7c1 38%,#a7a7a2 100%); - /* Opera 11.10+ */ - background: -ms-linear-gradient(top, #c7c7c1 38%,#a7a7a2 100%); - /* IE10+ */ - background: linear-gradient(to bottom, #c7c7c1 38%,#a7a7a2 100%); - /* W3C */ - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c7c7c1', endColorstr='#a7a7a2',GradientType=0 ); - /* IE6-9 */ - label { - font-size: 115%; - font-weight: bold; - } -} - -.navbar-inverse .brand, .navbar-inverse .nav > li > a { - color: #9FE1FF; - font-weight: bold; -} - -.navbar-fixed-bottom.navbar-static-bottom { - margin-top : .5em; - position: static; -} - -#changelanguage .nav > .active > p { - padding : 0 15px; -} - -.table-striped tbody > tr:nth-child(odd) > td, -.table-striped tbody > tr:nth-child(odd) > th { - background-color: #F4F4F4; -} - - -/* jQuery UI standard tabs */ -.ui-tabs-nav .ui-tabs-active a, -.ui-tabs-nav a:hover, -.ui-tabs-nav a:focus, -.ui-tabs-nav a:active, -.ui-tabs-nav span.a { - background: none repeat scroll 0 0 transparent; - outline: 0 none; -} - -.ui-widget, -.ui-widget input, -.ui-widget select, -.ui-widget textarea, -.ui-widget button { - font-family : inherit; - font-size : inherit; -} - -ul.ui-tabs-nav li { - list-style : none; -} -.ui-tabs.ui-widget-content { - background : transparent none; - border : 0; -} - -.ui-tabs .ui-tabs-panel { - border : 1px solid #D8D8D8; - margin-bottom: 1em; -} -.ui-tabs-nav.ui-widget-header { - border : 0; - background : none; -} -.ui-tabs .ui-tabs-nav li { - background: #F3F3F3 none; - border-color: #D8D8D8; - margin-right : .4em; -} - -.ui-tabs .ui-tabs-nav li.ui-tabs-active { - background-color : #FFF; - border : 1px solid #D8D8D8; - border-bottom: 0; -} -.ui-tabs .ui-tabs-nav li.ui-tabs-active a { - color : #000; - font-weight : bold; -} - -.ui-tabs .ui-tabs-nav li.ui-state-default.ui-state-hover { - background : #F3F3F3 none; -} - -.ui-tabs .ui-tabs-nav li.ui-tabs-active.ui-state-hover { - background : #FFF none; -} - -.ui-tabs .ui-state-default a, -.ui-tabs .ui-state-default a:link, -.ui-tabs .ui-state-default a:visited { - color: #006699; -} - -.ui-tabs .ui-state-hover a, -.ui-tabs .ui-state-hover a:link, -.ui-tabs .ui-state-hover a:visited { - color: #990033; -} - -.statictabs { - ul { - background: none repeat scroll 0 0 transparent; - border: 0 none; - margin: 0; - padding: 0.2em 0.2em 0; - border-bottom-right-radius: 4px; - border-bottom-left-radius: 4px; - border-top-right-radius: 4px; - border-top-left-radius: 4px; - color: #222222; - font-weight: bold; - font-size: 100%; - line-height: 1.3; - list-style: none outside none; - outline: 0 none; - text-decoration: none; - &:before { - content: ""; - display: table; - } - &:after { - clear: both; - content: ""; - display: table; - } - } - li { - background: none repeat scroll 0 0 #E6F0F2; - border: 1px solid #B9D8D9; - border-bottom: 0 none !important; - border-top-right-radius: 4px; - border-top-left-radius: 4px; - float: left; - list-style: none outside none; - margin-bottom: 0; - margin-right: 0.4em; - padding: 0; - position: relative; - white-space: nowrap; - top: 1px; - color: #555555; - font-weight: normal; - &.active { - background-color: #FFFFFF; - color: #212121; - font-weight: normal; - padding-bottom: 1px; - } - a { - color: #004D99; - cursor: pointer; - float: left; - padding: 0.5em 1em; - text-decoration: none; - &:hover { - background-color : #EDF4F5; - border-top-right-radius: 4px; - border-top-left-radius: 4px; - color : #538200; - } - } - &.active { - a { - color: #000000; - font-weight: bold; - cursor: text; - background: none repeat scroll 0 0 transparent; - outline: 0 none; - } - } - } - .tabs-container { - border: 1px solid #B9D8D9; - background: none repeat scroll 0 0 transparent; - display: block; - padding: 1em 1.4em; - border-bottom-right-radius: 4px; - border-bottom-left-radius: 4px; - color: #222222; - } -} - -/* End jQueryUI tab styles */ - -/* jQuery UI Datepicker */ -.ui-datepicker table {width: 100%; font-size: .9em; border : 0; border-collapse: collapse; margin:0 0 .4em; } -.ui-datepicker th { background : transparent none; padding: .7em .3em; text-align: center; font-weight: bold; border: 0; } - -.ui-datepicker-trigger { - vertical-align: middle; - margin : 0 3px; -} -.ui-datepicker { - .shadowed; -} -/* End jQueryUI datepicker styles */ - - -/* jQueryUI Core */ - -.ui-widget-content { - border: 1px solid #AAA; - background: #ffffff none; - color: #222222; -} -.ui-widget-header { - border: 1px solid #AAA; - background: #E6F0F2 none; - color: #222222; - font-weight: bold; -} -.ui-state-default, -.ui-widget-content .ui-state-default, -.ui-widget-header .ui-state-default { - border: 1px solid #AAA; - background: #F4F8F9 none; - font-weight: normal; - color: #555555; -} -.ui-state-hover, -.ui-widget-content .ui-state-hover, -.ui-widget-header .ui-state-hover, -.ui-state-focus, -.ui-widget-content .ui-state-focus, -.ui-widget-header .ui-state-focus { - border: 1px solid #AAA; - background: #E6F0F2 none; - font-weight: normal; - color: #212121; -} -.ui-state-active, -.ui-widget-content .ui-state-active, -.ui-widget-header .ui-state-active { - border: 1px solid #aaaaaa; - background: #ffffff none; - font-weight: normal; - color: #212121; -} -.ui-state-highlight, -.ui-widget-content .ui-state-highlight, -.ui-widget-header .ui-state-highlight {border: 1px solid #fcefa1; - background: #fbf9ee; - color: #363636; -} -.ui-state-error, -.ui-widget-content .ui-state-error, -.ui-widget-header .ui-state-error {border: 1px solid #cd0a0a; - background: #fef1ec; - color: #cd0a0a; -} - -/* end jQueryUI core */ - -th { - background-color: #ECEDE6; -} - -.item-thumbnail { - max-width: none; -} - -.no-image { - background-color : #FFF; - border: 1px solid #AAA; - color : #979797; - display:block; - font-size : 86%; - font-weight : bold; - text-align : center; - width : 75px; - .border-radius-all(3px); -} - -#bookcover .no-image { - margin-right : 10px; - margin-bottom : 10px; -} - -td.overdue { - color : #cc3333; -} -table { - font-size: 90%; -} -th.sum { - text-align: right; -} - -td.sum { - background-color: #FFC; - font-weight: bold; -} - -th[scope=row] { - background-color: transparent; - text-align : right; -} - -.required { - color : #C00; -} - -.label { - background-color: transparent; - color: inherit; - display: inline; - font-weight: normal; - padding : 0; - text-shadow: none; -} - -.blabel { - background-color: #999999; - border-radius: 3px; - color: #ffffff; - display: inline-block; - font-weight: bold; - padding: 2px 4px; - text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); -} - -.label-important { - background-color: #b94a48; -} -.label-warning { - background-color: #f89406; -} -.label-success { - background-color: #468847; -} -.label-info { - background-color: #3a87ad; -} -.label-inverse { - background-color: #333333; -} - -fieldset { - &.rows { - float : left; - font-size : 90%; - clear : left; - margin: .9em 0 0 0; - padding: 0; - width: 100%; - legend { - font-weight: bold; - font-size : 130%; - } - label, - .label { - float: left; - font-weight : bold; - width: 9em; - margin-right: 1em; - text-align: right; - } - label { - &.lradio { - float: none; - margin: inherit; - width: auto; - } - } - fieldset { - margin : 0; - padding : .3em; - } - ol { - padding: 1em 1em 0 1em; - list-style-type: none; - &.lradio { - label { - width : auto; - float : none; - margin-right : 0; - &.lradio { - float : left; - width : 12em; - margin-right : 1em; - } - } - } - } - li { - float : left; - clear : left; - padding-bottom: 1em; - list-style-type: none; - width: 100%; - &.lradio { - padding-left: 8.5em; - width : auto; - label { - float : none; - width : auto; - margin : 0 0 0 1em; - } - } - } - .hint { - display: block; - margin-left : 11em; - } - } - &.action { - clear : both; - float : none; - border : none; - margin : 0; - padding : 1em 0 .3em 0; - width : auto; - p { - margin-bottom : 1em; - } - } - table { - font-size: 100%; - } -} - -div.rows+div.rows { - margin-top : .6em; -} - -div.rows { - float : left; - clear : left; - margin: 0 0 0 0; - padding: 0; - width: 100%; - span.label { - float: left; - font-weight : bold; - width: 9em; - margin-right: 1em; - text-align: left; - } - ol { - list-style-type: none; - margin-left : 0; - padding: .5em 1em 0 0; - } - li { - border-bottom : 1px solid #EEE; - float : left; - clear : left; - padding-bottom: .2em; - padding-top: .1em; - list-style-type: none; - width: 100%; - } - ul { - li { - margin-left : 7.3em; - &:first-child { - float: none; - clear: none; - margin-left: 0; - } - } - } - ol li li { - border-bottom: 0; - } -} - -/* different sizes for different tags in opac-tags.tt */ -.tagweight0 { - font-size: 12px; -} - -.tagweight1 { - font-size: 14px; -} - -.tagweight2 { - font-size: 16px; -} - -.tagweight3 { - font-size: 18px; -} - -.tagweight4 { - font-size: 20px; -} - -.tagweight5 { - font-size: 22px; -} - -.tagweight6 { - font-size: 24px; -} - -.tagweight7 { - font-size: 26px; -} - -.tagweight8 { - font-size: 28px; -} - -.tagweight9 { - font-size: 30px; -} - -.toolbar { - background-color : #EEEEEE; - border : 1px solid #E8E8E8; - font-size : 85%; - padding:3px 3px 5px 5px; - vertical-align : middle; - a { - white-space: nowrap; - } - label { - display: inline; - font-size: 100%; - font-weight : bold; - margin-left : .5em; - } - select { - font-size: 97%; - height: auto; - line-height: inherit; - padding: 0; - margin: 0; - width : auto; - white-space: nowrap; - } - .hold, - #tagsel_tag { - padding-left: 28px; - font-size: 97%; - font-weight: bold; - } - #tagsel_form { - margin-top : .5em; - } - li { - display : inline; - list-style : none; - a { - border-left : 1px solid #e8e8e8; - } - &:first-child { - a { - border-left : 0; - } - } - } - ul { - padding-left : 0; - } -} - -#basket .toolbar { - padding: 7px 5px 9px 9px; -} - -#selections-toolbar, -.selections-toolbar { - background: -moz-linear-gradient(top, #b2b2b2 0%, #e0e0e0 14%, #e8e8e8 100%); /* FF3.6+ */ - background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b2b2b2), color-stop(14%,#e0e0e0), color-stop(100%,#e8e8e8)); /* Chrome,Safari4+ */ - background: -webkit-linear-gradient(top, #b2b2b2 0%,#e0e0e0 14%,#e8e8e8 100%); /* Chrome10+,Safari5.1+ */ - background: -o-linear-gradient(top, #b2b2b2 0%,#e0e0e0 14%,#e8e8e8 100%); /* Opera 11.10+ */ - background: -ms-linear-gradient(top, #b2b2b2 0%,#e0e0e0 14%,#e8e8e8 100%); /* IE10+ */ - background: linear-gradient(top, #b2b2b2 0%,#e0e0e0 14%,#e8e8e8 100%); /* W3C */ - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0e0e0', endColorstr='#e8e8e8',GradientType=0 ); /* IE6-9 */ - margin : 0 0 1em 0; - padding-top : .5em; - padding-left : 10px; -} - -.list-actions { - display : inline; -} - -#tagsel_span input.submit, -#tagsel_tag { - border : 0; - background-color: transparent; - font-size : 100%; - color: #0076B2; - cursor : pointer; - background-image : url("../images/sprite.png"); /* Tags */ - background-position : 1px -643px; - background-repeat : no-repeat; - padding-left : 25px; - text-decoration: none; -} - -#tagsel_tag.disabled { - background-position : -1px -667px; -} - - -#tagsel_span input:hover, -#selections-toolbar input.hold:hover { - color: #005580; - text-decoration: underline; -} - -#tagsel_span input.disabled, -#tagsel_span input.disabled:hover, -#tagsel_span input.hold.disabled, -#tagsel_span input.hold.disabled:hover, -#selections-toolbar input.hold.disabled, -#selections-toolbar input.hold.disabled:hover, -#selections-toolbar a.disabled, -#selections-toolbar a.disabled:hover, -.selections-toolbar a.disabled, -.selections-toolbar a.disabled:hover { - color: #888888; - text-decoration: none; - padding-left : 23px; -} - -.results_summary { - display: block; - font-size : 85%; - color: #707070; - padding : 0 0 .5em 0; - .results_summary { - font-size : 100%; - } - &.actions { - margin-top : .5em; - } - &.tagstatus { - display: inline; - } - .label { - color: #202020; - } - a { - font-weight: normal; - } -} - -#views { - margin-bottom : .5em; - padding : 0 2em 0.2em 0.2em; -} - -.view { - background-color : #F3F3F3; - border: 1px solid #C9C9C9; - border-radius: 4px; - display: inline-block; - padding: 0.2em 0.5em; - white-space: nowrap; -} - -#bibliodescriptions, -#isbdcontents { - clear : left; - margin-top : .5em; -} - -.view { - a, - span { - background-image: url("../images/sprite.png"); - background-repeat : no-repeat; - font-size : 87%; - padding-left: 15px; - text-decoration: none; - } -} - -.view { - a { - font-weight : normal; - } -} - -.current-view { - background-color: #fff; - font-weight: bold; -} - -#MARCview { - background-position: -9px -27px; -} -#ISBDview { - background-position: -10px -56px; -} -#Normalview { - background-position: -8px 3px; -} - -#bookcover { - float : left; - margin : 0; - padding : 0; - .no-image { - margin-right : 10px; - margin-bottom : 10px; - } - img { - margin : 0 1em 1em 0; - } -} - -/* pagination */ -.results-pagination { - position: absolute; - top:32px; - left: -1px; - width: 100%; - height:auto; - border: 1px solid #D0D0D0; - display: none; - background-color:#F3F3F3; - padding-bottom:10px; - z-index: 100; -} - - -.back { - float:right; - input { - background:none!important; - color:#999!important; - } -} - -.pagination_list { - ul { - padding-top: 40px; - padding-left:0px; - } - li { - list-style:none; - float:bottom; - padding:4px; - color:#999; - &.highlight { - background-color : #F3F3F3; - border-top : 1px solid #DDDDDD; - border-bottom : 1px solid #DDDDDD; - } - a { - padding-left:0px; - } - } - .li_pag_index { - color: #999999; - float: left; - font-size: 15px; - font-weight: bold; - padding-right: 10px; - text-align: right; - width: 13px; - } -} - -.nav_results { - background-color: #F3F3F3; - border: 1px solid #D0D0D0; - font-size: 95%; - font-weight: bold; - margin-top: 0.5em; - position:relative; - .l_Results { - a { - background:#E1E1E1 url("../images/sprite.png") no-repeat 0px -504px; /* Browse results menu */ - color:#006699; - display:block; - padding:8px 28px; - text-decoration:none; - } - &:hover { - background-color:#D9D9D9; - } - } -} - -.pg_menu { - margin: 0; - border-top: 1px solid #D0D0D0; - white-space : nowrap; - li { - color:#B2B2B2; - display:inline; - list-style:none; - margin: 0; - &.back_results { - a { - border-left: 1px solid #D0D0D0; - border-right: 1px solid #D0D0D0; - } - } - a, - span { - background-color: #F3F3F3; - display : block; - float:left; - padding:.4em .5em; - text-decoration:none; - font-weight:normal; - text-align:center; - } - span { - color : #B2B2B2; - } - } -} - -#listResults{ - li { - background-color:#999999; - color:#C5C5C5; - font-weight:normal; - display:block; - margin-right:1px; - font-size: 80%; - padding: 0; - text-align:center; - min-width:18px; - &:hover { - background-color:#006699; - } - a { - color:#FFFFFF; - font-weight:normal; - } - } -} - -/* nav */ -.nav_pages { - .close_pagination { - padding-right: 10px; - position: absolute; - right: 3px; - top: -25px; - } - .close_pagination a { - text-decoration:none!important; - } - ul { - padding-top: 10px; - } - li { - list-style:none; - float:left; - padding:4px; - color:#999; - a { - text-decoration:none!important; - &:hover { - text-decoration:underline; - } - } - ul { - float:left; - } - } -} - -/* action buttons */ -#action { - margin : .5em 0 0 0; - background-color : #F3F3F3; - border : 1px solid #E8E8E8; - padding-bottom : 3px; - li { - list-style : none; - margin : .2em; - padding : .3em 0; - } - a { - font-weight: bold; - text-decoration : none; - } -} - -#export, -#moresearches_menu { - li { - padding : 0; - margin : 0; - a { - font-weight: normal; - &.menu-inactive { - font-weight: bold; - } - } - } -} - -#format, -#furthersearches { - padding-left : 35px; -} -.highlight_controls { - float: left; -} -a.addtocart, -a.addtoshelf, -a.brief, -a.deleteshelf, -a.deleteshelf.disabled, -a.detail, -a.download, -a.editshelf, -a.sharelist, -a.empty, -a.hide, -a.highlight_toggle, -a.hold, -a.hold.disabled, -a.incart, -a.new, -a.print-small, -a.print-large, -a.removeitems, -a.removeitems.disabled, -a.reserve, -a.article_request, -a.send, -a.tag_add, -a.removefromlist, -input.hold, -input.hold.disabled, -input.editshelf, -.newshelf, -.newshelf.disabled, -.deleteshelf, -.buttons-print { - background-image: url("../images/sprite.png"); - background-repeat: no-repeat; -} - - -a.addtocart { - background-position: -5px -265px; /* Cart */ - padding-left : 35px; -} - -a.addtoshelf { - background-position: -5px -225px; /* Virtual shelf */ - padding-left : 35px; -} - -a.brief { - - background-position : -2px -868px; /* Zoom out */ - text-decoration : none; - padding-left : 27px; -} - -a.cartRemove { - color: #cc3333; - font-size : 90%; - margin : 0; - padding: 0; -} - -a.detail { - background-position : -2px -898px; /* Zoom in */ - text-decoration : none; - padding-left : 27px; -} - -a.download { - background-position : -5px -348px; /* Download */ - padding-left : 20px; - text-decoration : none; -} - -a.editshelf { - background-position : 2px -348px; /* List edit */ - padding-left : 26px; - text-decoration : none; -} - -a.sharelist { - background-position : 2px -1148px; /* List share */ - padding-left : 26px; - text-decoration : none; -} - -a.empty { - background-position : 2px -598px; /* Trash */ - text-decoration : none; - padding-left : 30px; -} - -a.hide { - background-position: -3px -814px; /* Close */ - text-decoration : none; - padding-left : 26px; -} - -a.highlight_toggle { - background-position: -5px -841px; /* Highlight */ - display: none; - padding-left : 35px; -} - -a.hold, -input.hold { - background-position : -2px -453px; /* Toolbar place hold */ - text-decoration : none; - padding-left : 23px; -} - -a.hold.disabled, -input.hold.disabled { - background-position : -5px -621px; /* Place hold disabled */ -} - -a.incart { - background-position: -5px -265px; /* Cart */ - color : #666; - padding-left : 35px; -} - -a.new { - background-image : url("../images/sprite.png"); /* New */ - background-position : -4px -922px; - padding-left : 23px; - text-decoration : none; -} - -a.print-small { - background-position : 0px -423px; /* Toolbar print */ - text-decoration : none; - padding-left : 30px; -} - -a.print-large, -.buttons-print { - background-position : 0 -187px; /* Toolbar print */ - text-decoration : none; - padding-left : 35px; -} - -a.removeitems, -a.deleteshelf { - background-position : 2px -690px; /* Delete */ - text-decoration : none; - padding-left : 25px; -} - -a.removeitems.disabled, -a.deleteshelf.disabled { - background-position : 2px -712px; /* Delete disabled */ -} - -a.reserve { - background-position: -6px -144px; /* Place hold */ - padding-left : 35px; -} - -a.article_request { - background-position: 0px -24px; /* Place article request */ - padding-left : 35px; -} - -a.send { - background-position : 2px -386px; /* Email */ - text-decoration : none; - padding-left : 28px; -} - -a.tag_add { - background-position: 3px -1111px; /* Tag results */ - padding-left : 27px; - text-decoration: none; -} - -input.hold { - background-color: transparent; - border : 0; - color: #0076B2; - font-weight: bold; -} - -input.editshelf { - background-color: transparent; - background-position : 2px -734px; /* List edit */ - border : 0; - color : #006699; - cursor : pointer; - filter: none; - font-size : 100%; - padding-left : 29px; - text-decoration : none; -} - -.newshelf { - background-position: 2px -764px; /* List new */ - border : 0; - color : #006699; - cursor : pointer; - filter: none; - font-size : 100%; - padding-left : 28px; - text-decoration : none; -} - -.newshelf.disabled { - background-position: -4px -791px; /* List new disabled */ -} - -.deleteshelf { - background-color: transparent; - background-position : 2px -687px; /* Delete */ - border : 0; - color : #006699; - cursor : pointer; - filter: none; - font-size : 100%; - padding-left : 25px; - text-decoration : none; -} - -.links a { - font-weight : bold; -} - -.deleteshelf:hover { - color: #990033; -} - - -.editshelf:active, -.deleteshelf:active { - border : 0; -} - -#tagslist li { display : inline; } - -#login4tags { - background-image: url("../images/sprite.png"); /* Tag results disabled */ - background-position: -6px -1130px; - background-repeat: no-repeat; - padding-left : 20px; - text-decoration: none; -} - -.tag_results_input { - margin-left: 1em; - padding: 0.3em; - font-size: 12px; - input[type="text"] { - font-size: inherit; - margin : 0; - padding : 0; - } - label { - display : inline; - } -} - -.tagsinput { - input[type="text"] { - font-size: inherit; - margin : 0; - padding : 0; - } - label { - display : inline; - } -} - -.buttons-print { - background-position-y: -184px; - background-color: transparent; - border: 0; - color: #0076B2; - font-size: 100%; -} - -.branch-info-tooltip { - display: none; -} - -.ui-tooltip-content p { - margin: 0.3em 0; -} - -#social_networks { - a { - background: transparent url("../images/social-sprite.png") no-repeat; - display: block; - height : 20px !important; - width : 20px; - text-indent : -999em; - } - span { - color: #274D7F; - display : block; - float : left; - font-size: 85%; - font-weight: bold; - line-height: 2em; - margin : .5em 0 .5em .5em !important; - } - div { - float : left !important; - margin : .5em 0 .5em .2em !important; - } - #facebook { - background-position : -7px -35px; - } - #twitter { - background-position : -7px -5px; - } - #linkedin { - background-position : -7px -95px; - } - #delicious { - background-position : -7px -66px; - } - #email { - background-position : -7px -126px; - } -} - -#marc { - td, - th { - background-color : transparent; - border : 0; - padding: 3px 5px; - text-align : left; - } - td:first-child { - text-indent : 2em; - } - p { - padding-bottom: .6em; - .label { - font-weight : bold; - } - } - ul { - padding-bottom: .6em; - } - .results_summary { - clear : left; - ul { - display : inline; - float : none; - clear : none; - margin: 0; - padding: 0; - list-style : none; - } - li { - display: inline; - } - } -} - -#items, -#items td -#items th { - border : 1px solid #EEE; - font-size : 90%; -} - -#plainmarc table { border: 0; margin: .7em 0 0 0; font-family: monospace; font-size: 95%; } -#plainmarc th { background-color : #FFF; border: 0; white-space: nowrap; text-align:left; vertical-align: top; padding: 2px; } -#plainmarc td { border: 0; padding : 2px; vertical-align: top; } - -#renewcontrols { - float: right; - font-size: 66%; -} - -#renewcontrols a { - background-repeat : no-repeat; - text-decoration:none; - padding : .1em .4em; - padding-left : 18px; -} - -#renewselected_link { - background-image : url("../images/sprite.png"); - background-position : -5px -986px; - background-repeat: no-repeat; -} - -#renewall_link { - background-image : url("../images/sprite.png"); - background-position : -8px -967px; - background-repeat: no-repeat; -} - -.authref { - text-indent: 2em; -} - -.authref .label { - font-style: italic; -} - -.authstanza { - margin-top: 1em; -} - -.authstanzaheading { - font-weight: bold; -} -.authorizedheading { - font-weight: bold; -} -.authstanza li { - margin-left: 0.5em; -} -.authres_notes, .authres_seealso, .authres_otherscript { - padding-top: .5em; -} -.authres_notes { - font-style: italic; -} - -#didyoumean { - background-color: #EEE; - border: 1px solid #E8E8E8; - box-sizing: border-box; - margin: .5em 1.5em; - text-align: left; - padding: 0.5em; - .border-radius-all(3px); - - &.dym-loaded { - border-color: #F4ECBE; - background-color: #FFFBEA; - } -} - -.suggestionlabel { - font-weight: bold; -} - -.searchsuggestion { - padding: 0.2em 0.5em; - display: inline-block; -} - -.authlink { - padding-left: 0.25em; -} -#hierarchies a { - font-weight: normal; - text-decoration: underline; - color: #069; -} - -#hierarchies a:hover { - color: #990033; -} - -#top-pages { - margin: 0 0 0.5em; -} -.dropdown-menu > li > a { - font-size: 90%; -} -a.listmenulink:link, -a.listmenulink:visited { - color : #0076B2; - font-weight: bold; -} -a.listmenulink:hover, -a.listmenulink:active { - color : #FFF; - font-weight: bold; -} -#cartDetails, -#cartUpdate, -#holdDetails, -#listsDetails { - background-color : #FFF; -// border: 1px solid #739acf; - border: 1px solid rgba(0, 0, 0, 0.2); - border-radius: 6px 6px 6px 6px; - box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); - color : black; - display : none; - font-size: 90%; - margin : 0; - padding : 8px 20px; - text-align : center; - width : 180px; - z-index: 2; -} -#cartmenulink { - white-space: nowrap; -} - -#search-facets, -#menu { - border : 1px solid #D2D2CF; - .border-radius-all(7px); - ul { - margin : 0; - padding : .3em; - } - form { - margin : 0; - } - h4 { - font-size : 90%; - margin : 0 0 .6em 0; - text-align : center; - a { - background-color : #F2F2EF; - border-radius: 8px 8px 0 0; - border-bottom : 1px solid #D8D8D8; - display: block; - font-weight: bold; - padding : .7em .2em; - text-decoration: none; - } - } - li { - font-size: 90%; - font-weight : bold; - list-style-type : none; - li { - font-weight : normal; - font-size : 95%; - line-height: 125%; - margin-bottom : 2px; - padding : .1em .2em; - } - &.showmore { - a { - font-weight : bold; - text-indent : 1em; - } - } - } - a { - font-weight : normal; - text-decoration: underline; - } - .facet-count { - display: inline-block; - } - -} - -#menu { - font-size : 94%; - li { - list-style-type : none; - a { - background: #eeeeee; - text-decoration : none; - display : block; - border : 1px solid #D8D8D8; - border-radius: 5px 0 0 5px; - border-bottom-color: #999; - font-size : 111%; - padding : .4em .6em; - margin : .4em 0; - margin-right: -1px; - &:hover { - background: #eaeef5; - } - } - &.active { - a { - background-color : #FFF; - background-image : none; - border-right-width: 0; - font-weight : bold; - &:hover { - background-color : #fff; - } - } - } - } - h4 { - display: none; - } -} - -#addto { - max-width : 10em; -} - -/* Search results add to cart (lists disabled) */ -.addto a.addtocart { - background-image: url("../images/sprite.png"); /* Cart */ - background-position: -5px -266px; - background-repeat: no-repeat; - text-decoration : none; - padding-left : 33px; -} - -.searchresults { - p { - margin: 0; - padding: 0 0 .6em 0; - &.details { - color : #979797; - } - } - a { - &.highlight_toggle { - background-image: url("../images/sprite.png"); /* Highlight */ - background-position: -11px -841px; - background-repeat: no-repeat; - display: none; - font-weight: normal; - padding : 0 10px 0 21px; - } - } - .commentline { - background-color : rgb(255, 255, 204); - background-color : rgba(255, 255, 204, 0.4); - border : 1px solid #CCC; - display: inline-block; - .border-radius-all(3px); - .shadowed; - margin : .3em; - padding : .4em; - } - .commentline.yours { - background-color : rgb(239, 254, 213); - background-color : rgba(239, 254, 213, 0.4); - } -} - -.commentline .avatar { - float : right; - padding-left : .5em; -} - -/* style for search terms in catalogsearch */ -.term { - /* color : blue; */ - color : #990000; - background-color : #FFFFCC; -} - -/* style for shelving location in catalogsearch */ -.shelvingloc { - display : block; - font-style : italic; -} -#CheckAll, -#CheckNone, -.CheckAll, -.CheckNone { - font-weight : normal; - margin : 0 .5em; - text-decoration: underline; -} - -span.sep { - color: #888; - padding: 0 .2em 0 .5em; - text-shadow: 1px 1px 0 #FFF; -} - -/* style for PM-generated pagination bar */ -.pages { - margin: 20px 0; -} -.pages span:first-child, -.pages a:first-child { - border-width: 1px 1px 1px 1px; - border-bottom-left-radius: 3px; - border-top-left-radius: 3px; -} - -.pages span:last-child, -.pages a:last-child { - border-width: 1px 1px 1px 0; - border-bottom-right-radius: 3px; - border-top-right-radius: 3px; -} - -.pages .inactive, -.pages .currentPage, -.pages a { - -moz-border-bottom-colors: none; - -moz-border-left-colors: none; - -moz-border-right-colors: none; - -moz-border-top-colors: none; - background-color: #FFFFFF; - border-color: #DDDDDD; - border-image: none; - border-style: solid; - border-width: 1px 1px 1px 0; - float: left; - font-size: 11.9px; - line-height: 20px; - padding: 4px 12px; - text-decoration: none; -} - -.pages .inactive { - background-color: #F5F5F5; -} - -.pages a[rel='last'] { - border-bottom-right-radius: 3px; - border-top-right-radius: 3px; -} - -.hold-message { - background-color: #FFF0B1; - display: inline-block; - margin: 0.5em; - padding: 0.2em 0.5em; - .border-radius-all(3px); -} -.reserve_date, -.expiration_date { - white-space: nowrap; -} -.close { - color: #0088CC; - position: inherit; - top: auto; - right : auto; - filter : none; - float : none; - font-size: inherit; - font-weight: normal; - opacity: inherit; - text-shadow: none; -} - -.close:hover { - color: #538200; - filter: inherit; - font-size: inherit; - opacity: inherit; -} - -/* Redefine a new style for Bootstrap's class "close" since we use that already */ -/* Use × */ -.alert .closebtn{position:relative;top:-2px;right:-21px;line-height:20px;} -.modal-header .closebtn{margin-top:2px;} -.closebtn{float:right;font-size:20px;font-weight:bold;line-height:20px;color:#000000;text-shadow:0 1px 0 #ffffff;opacity:0.2;filter:alpha(opacity=20);}.closebtn:hover{color:#000000;text-decoration:none;cursor:pointer;opacity:0.4;filter:alpha(opacity=40);} -button.closebtn{padding:0;cursor:pointer;background:transparent;border:0;-webkit-appearance:none;} -.btn-group label, -.btn-group select { - font-size: 13px; -} - -.span2 select { - width: 100%; -} - -.popup .main { - font-size: 90%; - padding: 0 1em; -} - -.popup legend { - line-height: 1.5em; - margin-bottom : .5em; -} - -.item-status { - display: block; - font-size: 95%; - margin-bottom: .5em; -} - -.available { - color : #006600; -} - -.unavailable { - color: #990033; -} - -.waiting,.intransit,.notforloan,.checkedout,.lost,.notonhold { - display : block; -} - -.notforloan { - color : #900; -} - -.lost { - color : #666; -} - -.suggestion { - background-color : #EEEEEB; - border : 1px solid #DDDED3; - margin : 1em auto; - padding : .5em; - width : 35%; - .border-radius-all(3px); -} - -.librarypulldown .transl1 { - width : auto; -} - -.nolibrarypulldown { - width : 68%; -} - -.nolibrarypulldown .transl1 { - width : 87%; -} - -#opac-main-search { - select { - width : auto; - max-width: 12em; - } -} - -#logo { - background:transparent url("../images/koha-logo-navbar.png") no-repeat scroll 0%; - border: 0; - float : left !important; - margin:0; - padding:0; - width:100px; - a { - border:0; - cursor:pointer; - display:block; - height:0px !important; - margin:0; - overflow:hidden; - padding:40px 0 0; - text-decoration:none; - width:100px; - } -} - -#user-menu-trigger { - display: none; - .icon-user { - background: transparent url("../lib/bootstrap/img/glyphicons-halflings-white.png") no-repeat; - background-position: -168px 0; - background-repeat: no-repeat; - height: 14px; - line-height: 14px; - margin : 12px 0 0; - vertical-align: text-top; - width: 14px; - } - .caret { - border-bottom-color: #999999; - border-top-color: #999999; - margin-top: 18px; - } -} - -/* Class to be added to toolbar when it starts being fixed at the top of the screen*/ -.floating { - -webkit-box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, .4); - box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, .4); - margin-top: 0; -} - -.tdlabel { - font-weight: bold; - display: none; -} - -td img { - max-width: none; -} - -#ulactioncontainer { - min-width: 16em; -} - -.notesrow { - label { - font-weight: bold; - } - span { - display: block; - } -} - -.thumbnail-shelfbrowser span { - margin: 0px auto; -} - -.dropdown-menu > li > a.menu-inactive:hover { - background : #FFF none; - color : #000; -} - -.table { - .sorting_asc { - padding-right: 19px; - background: url("../images/asc.gif") no-repeat scroll right center #ECEDE6; - } - .sorting_desc { - padding-right: 19px; - background: url("../images/desc.gif") no-repeat scroll right center #ECEDE6; - } - .sorting { - padding-right: 19px; - background: url("../images/ascdesc.gif") no-repeat scroll right center #ECEDE6; - } - .nosort, - .nosort.sorting_asc, - .nosort.sorting_desc, - .nosort.sorting { - padding-right: 19px; - background: #ECEDE6 none; - } - th, - td { - line-height: 135%; - } -} -.tags, .shelves { - ul { - display: inline; - list-style: none; - margin-left : 0; - li { - display: inline; - } - } -} -.coverimages { - float : right; -} -#i18nMenu { - margin-left : 1em; - li { - font-size : 85%; - li { - font-size: 100%; - } - li > a { - font-size : 100%; - &:hover { - color : #FFF; - } - } - a { - color : @links; - } - } - .dropdown-menu { - li { - p { - clear: both; - display: block; - font-weight: normal; - line-height: 20px; - padding: 3px 20px; - white-space: nowrap; - } - } - } -} - -#subjectsList, -#authorSearch { - label { - display :inline; - vertical-align: middle; - } - ul { - border-bottom: 1px solid #EEE; - list-style-type: none; - margin: 0; - padding: .6em 0; - } - li { - list-style-type: none; - margin: 0; - padding: 0; - } -} - - -#overdrive-results, #openlibrary-results { - font-weight: bold; - padding-left: 1em; -} - -.throbber { - vertical-align: middle; -} - -#overdrive-results-list .star-rating-control { - display: block; - overflow: auto; -} - -#shelfbrowser { - table { - margin : 0; - } - table, - td, - th { - border : 0; - font-size : 90%; - text-align : center; - } - td, - th { - padding: 3px 5px; - width : 20%; - } - a { - display : block; - font-size : 110%; - font-weight : bold; - text-decoration : none; - } - #browser_next, - #browser_previous { - background-image : url("../images/sprite.png"); - background-repeat: no-repeat; - width : 16px; - a { - cursor: pointer; - display : block; - height: 0 !important; - margin: 0; - overflow: hidden; - padding: 50px 0 0; - text-decoration: none; - width: 16px; - } - } - #browser_previous { - background-position: -9px -1007px; - } - #browser_next { - background-position: -9px -1057px; - } -} - -#holds { - margin : 0 auto; - max-width: 800px; -} -.holdrow { - clear : both; - padding: 0 1em 1em 1em; - border-bottom:1px solid #CCC; - margin-bottom:.5em; - fieldset { - border : 0; - margin : 0; - float: none; - .label { - font-size: 14px; - } - } - label { - display: inline; - } -} -.hold-options { - clear : both; -} -.toggle-hold-options { - background-color: #eee; - clear : both; - display : block; - font-weight : bold; - margin: 1em 0; - padding: .5em; -} -.copiesrow { - clear : both; -} - -#idreambooksreadometer { - float: right; -} - -a.idreambooksrating { - font-size: 30px; - color: #29ADE4; - padding-left: 85px; - line-height: 30px; - text-decoration: none; -} - -.idreambookslegend { - font-size: small; -} - -a.reviewlink, -a.reviewlink:visited { - text-decoration: none; - color: black; - font-weight: normal; -} - -.idreambookssummary a { - color: #707070; - text-decoration: none; -} - -.idreambookssummary img, -.idbresult img { - vertical-align: middle; -} - -.idbresult { - color: #29ADE4; - text-align: center; - margin: 0.5em; - padding: 0.5em; -} - -.idbresult a, -.idbresult a:visited { - text-decoration: none; - color: #29ADE4; -} - -.idbresult img { - padding-right: 6px; -} - -.js-show { - display: none; -} - -.modal-nojs { - .modal-header, - .modal-footer { - display: none; - } -} - -.contents { - width: 75%; -} - - -.contentblock { - font-size : 95%; - line-height: 135%; - position: relative; - margin-left: 2em; -} - -.contents { - .t:first-child:before { - content: "→ "; - } - .t:before { - content: "\A → "; - white-space: pre; - } - .t { - font-weight: bold; - display: inline; - } - .r { - display: inline; - } -} - -.m880 { - display:block; - text-align:right; - float:right; - width:50%; - padding-left:20px; -} - -#memberentry-form input.error { - border-color: #c00; - box-shadow: 0 1px 1px #c00 inset, 0 0 8px #c00; - color: red; outline: 0 none; -} - -#memberentry-form input.error:focus { - border-color: #c00; - box-shadow: 0 1px 1px #c00 inset, 0 0 8px #c00; - color: red; outline: 0 none; -} - -#memberentry-form label.error { - color: #c00; float: none; - font-size: 90%; -} - -#illrequests { - .illrequest-actions { - .btn, - .cancel { - margin-right: 5px; - } - padding-top: 20px; - margin-bottom: 20px; - } - #illrequests-create-button { - margin-bottom: 20px; - } - .bg-info { - overflow: auto; - position: relative; - } - .bg-info { - #search-summary { - -webkit-transform: translateY(-50%); - -ms-transform: translateY(-50%); - -o-transform: translateY(-50%); - transform: translateY(-50%); - position: absolute; - top: 50%; - } - - } - #freeform-fields .custom-name { - float: left; - width: 8em; - margin-right: 1em; - text-align: right; - } - .dropdown:hover .dropdown-menu.nojs { - display: block; - } -} - -#dc_fieldset { - border: 1px solid #dddddd; - border-width: 1px; - padding: 5px; - border-radius: 10px -} - -.label_dc{ - display: inline; - padding: 0px; - margin: 0px; - cursor: pointer; -} - -.btn-danger { - color: white !important; -} - -.count_label { - @base: #369; - background-color: @base; - border-radius: 5px; - color: #FFF; - display: inline-block; - font-weight: bold; - min-width: 1.5em; - padding: .2em; - text-align: center; - text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); - - &:hover { - background-color: lighten( @base, 20% ); - } -} - -.user_checkouts_count { - -} - -.user_overdues_count, -.user_fines_count { - background-color: #990000; - &:hover { - background-color: lighten( #990000, 10% ); - } -} - -.user_holds_pending_count { - -} - -.user_holds_waiting_count { - background-color: #538200; - &:hover { - background-color: lighten( #538200, 10% ); - } -} - -#user_summary { - border: 1px solid #EAEAE6; - border-radius: 7px; - margin-bottom: 1em; - padding-bottom: .5em; - - h3 { - background-color: #EAEAE6; - border-top-left-radius: 6px; - border-top-right-radius: 6px; - box-shadow: 0 1px 1px 0 rgba(0,0,0,0.2); - margin-top: 0; - padding: .2em 0; - text-align: center; - } - - ul { - list-style-type: none; - margin: 0 0 .2em 0; - - a { - display: block; - font-weight: bold; - padding: .2em 1em; - } - } -} - - - -@import "responsive.less"; diff --git a/koha-tmpl/opac-tmpl/bootstrap/less/print.less b/koha-tmpl/opac-tmpl/bootstrap/less/print.less deleted file mode 100644 index 8f837ac4ca..0000000000 --- a/koha-tmpl/opac-tmpl/bootstrap/less/print.less +++ /dev/null @@ -1,258 +0,0 @@ -.noprint { - display : none; -} - -a:link { - color : #000066; - text-decoration: none; -} - -a:visited { - color : #000066; - text-decoration: none; -} - -a:hover { - color : #993300; - text-decoration: none; -} - -a[href]:after { display:none; } - -body { - background-color : #FFF; - color : #333333; - font-family : arial, geneva, sans-serif; - font-size : 14px; - margin : 0px 0px 0px 0px; - word-wrap : break-word; -} - -caption { - color : #000066; - font-size : 18px; - font-weight : bold; - margin-top : 5px; - text-align : left; -} - -div.table { - width : 100%; -} - -form { - margin : 0px; - padding : 0px; -} - -h1 - { - color : #000066; - font-size : 22px; - font-weight : bold; - margin-bottom : 3px; - margin-top : 3px; -} - -h2 { - color : #000066; - font-size : 20px; - font-weight : bold; - margin-bottom : 3px; - margin-top : 3px; -} - -h3 { - color : #000066; - font-size : 18px; - font-weight : bold; - margin-bottom : 3px; - margin-top : 3px; -} - -h4 { - color : #000066; - font-size : 16px; - font-weight : bold; - margin-bottom : 3px; - margin-top : 3px; -} - -h5 { - color : #000066; - font-size : 15px; - font-weight : bold; - margin-bottom : 1px; - margin-top : 1px; -} - -h6 { - color : #000066; - font-size : 14px; - font-weight : bold; - margin-bottom : 1px; - margin-top : 1px; -} - -p { - margin-top : 0px; -} - -table { - background-color : #FFFFFF; - border-bottom : 0px solid #CCCCCC; - border-collapse : collapse; - border-left : 0px solid #CCCCCC; - margin : 3px 0px 5px 0px; - padding : 0px; - width : 99%; -} - -td { - background-color : #FFF; - border-bottom : 1px solid #CCCCCC; - border-right : 1px solid #CCCCCC; - padding : 5px 5px 5px 5px; - vertical-align : top; -} - -td:last-child { - background-color : #FFF; - border-bottom : 1px solid #CCCCCC; - border-right : 0px solid #CCCCCC; - padding : 5px 5px 5px 5px; - vertical-align : top; -} - -th { - background-color : #E9E9E9; - border-bottom : 1px solid #CCCCCC; - border-right : 1px solid #CCCCCC; - font-weight : bold; - padding : 5px 5px 5px 5px; -} - -th:last-child { - background-color : #E9E9E9; - border-bottom : 1px solid #CCCCCC; - border-right : 0px solid #CCCCCC; - font-weight : bold; - padding : 5px 5px 5px 5px; -} - -tr.highlight { - background-color: #e9e9e9; -} - -body#basket tr.highlight { - background-color : transparent; -} - -body#basket a { - font-weight : bold; -} - -body#basket table { - border-collapse: collapse; -} - -body#basket td, -body#basket th { - background-color : transparent; - border: 0; - padding : 2px; -} - -body#basket th { - background-color : #EEE; - border: 0; -} - -body#basket th, -body#basket th[scope=col] { - border: 0; - text-align : center; - vertical-align : middle; -} - -body#basket th[scope=row] { - border: 0; - font-size : 89%; - text-align : right; - vertical-align : top; - width : 10%; -} - -#basket tr { - border-bottom: 1px solid #DDD; -} - -body#basket p { - font-size : 85%; - margin : .2em 0; - text-indent : .5em; -} - -.error { - font-weight: bold; -} - -.ex { - font-family : "Courier New", Courier, monospace; -} -.inline { - display : inline; -} - -.screen { - display : none; -} - -#bookcover { - float:left; - margin:0pt; - padding:0pt; -} - -#members,#opac-main-search,#opac-user-views .ui-tabs-nav,input,h2 span.hint,td.resultscontrol,.pages,.suggestion,.views,#action,#export,#bibliodescriptions .ui-tabs-nav,#addshelf,fieldset.action, .list-actions, .ft, #facetcontainer,.results_summary.actions,.koha_url,.yui-b { - display : none; -} - -#userresults { - position : absolute; - right : 0px; - word-wrap : break-word; - display : block; -} - -div#userupdate input,div#userupdate textarea { - display : inline; - border : 0; -} - -#yui-main, -#yui-main .yui-b, -.yui-t1 #yui-main .yui-b { - display : block !important; - margin : 0 !important; - padding : 0 !important; - width : auto !important; - float : none !important; -} - -.navbar, #navigation, .pages, .actions, #toolbar, #selections-toolbar, #remove-selected, .breadcrumb, #members,#opac-main-search,#opac-user-views .ui-tabs-nav,input,h2 span.hint,td.resultscontrol,.pages,.suggestion,.views,#action,#export,#bibliodescriptions .ui-tabs-nav,#addshelf,fieldset.action, .list-actions, .ft, #facetcontainer,.results_summary.actions,.koha_url,.yui-b { - display : none; -} -.row-fluid { - margin-top: 30px; -} - -#views, -#ulactioncontainer { - display: none; -} - -.main, -.table-bordered { - border: 0; -} \ No newline at end of file -- 2.39.5