koha-tmpl/opac-tmpl/prog/en/includes/opac.css

   1 /* color scheme :
   2 - #384b73 : light blue, for menus, text enhancement, footer & header
   3 - #eeeeee : light grey, for background color
   4 - #CCCCCC : for table backgrounds
   5 - #EEC95A : orange for action buttons & hyperlinks
   6 */
   7
   8 /* attribute for standard html tags */
   9
  10 body {
  11     font-family : Verdana, Geneva, Arial, sans-serif;
  12     font-size : 1em;
  13     background-color : #eeeeee;
  14     text-align: left;
  15     margin-bottom:0px;
  16 }
  17
  18 h1 {
  19     padding-top:25px;
  20     color: #384b73;
  21     font-size:1.5em;
  22     text-align:left;
  23 }
  24
  25 p {
  26     margin:0px;
  27     padding:0px;
  28     clear:left;
  29 }
  30
  31 label {
  32     font-style:italic;
  33     vertical-align:top;
  34     display:block;
  35     float:left;
  36     width:10em;
  37     margin-right:0.2em;
  38 }
  39
  40 a:link, a:visited, a:active {
  41     text-decoration : none;
  42     color :#384b73;
  43 }
  44
  45 a:hover {
  46     text-decoration : none;
  47     background-color : #EEC95A;
  48 }
  49
  50 fieldset {
  51     display:inline;
  52     border: 1px solid #384b73;
  53 }
  54
  55 table {
  56     border-collapse : collapse;
  57     border : 1px solid #CCCCCC;
  58     margin : 1em 0;
  59 }
  60
  61 caption {
  62     font-size : 140%;
  63     text-align : left;
  64     font-weight : bold;
  65 }
  66
  67 td,th {
  68     border : 1px solid #CCCCCC;
  69     border-bottom : 1px solid #CCCCCC;
  70     padding : 5px;
  71 }
  72
  73 th {
  74     background-color: #384b73;
  75     color:white;
  76     border : 1px solid #CCCCCC;
  77     border-right: 1px solid #CCCCCC;
  78 }
  79
  80 th[scope=row] {
  81     text-align : right;
  82 }
  83
  84 input[type=submit], input[type=button], input[type=reset] {
  85     background-color : #EEC95A;
  86     color : #FFFFFF;
  87     font-size : 1em;
  88     font-weight : bold;
  89 }
  90
  91 li {
  92     list-style-type:square;
  93 }
  94
  95 ul {
  96     margin:0px;
  97 }
  98
  99 /* attributes for search result list */
 100 .searchresults td, .searchresults th, .searchresults table {
 101     border: 0;
 102 }
 103 .searchresults tr {
 104     border-bottom : 1px solid #CCCCCC;
 105 }
 106 .searchresults table {
 107     border-top : 0px solid #CCCCCC;
 108     border: 1px solid #CCCCCC;
 109 }
 110 p.searchresults {
 111     background-color : #EFF1DC;
 112 }
 113 .searchresults a.reserve {
 114     background-color : transparent;
 115     color : #006699;
 116 }
 117 .searchresults table tr:hover {
 118     background-color: #CCFFFF;
 119 }
 120 tr.highlight td, tr.highlight th {
 121     background-color : #EEEEEE;
 122     border: 1px solid #DDDDDD;
 123     border-right: 1px solid #DDDDDD;
 124 }
 125
 126 /* the top part of the opac : (the LibraryName) */
 127 #masthead {
 128     color:#384b73;
 129     margin-left:15%;
 130     text-align:left;
 131     font-size:150%;
 132     font-weight:bold;
 133     margin-bottom:25px;
 134 }
 135
 136 /* The image on the top-left (the logo) */
 137 #masthead-image {
 138     position:fixed;
 139     padding-left:0px;
 140     padding-top:0px;
 141 }
 142 #masthead-image img {
 143 }
 144
 145 /* the itemtype list in advanced search */
 146 #advsearch-itemtype table {
 147     border-collapse: separate;
 148     border-spacing: 3px;
 149     border : 0px;
 150     margin : 0px;
 151 }
 152 #advsearch-itemtype table tr td {
 153     background-color:#CCCCCC;
 154     border : 0px;
 155     margin : 0px;
 156     width:700px;
 157 }
 158 #advsearch-itemtype table tr td p {
 159     font-size:0.8em;
 160 }
 161
 162 /* the content part of every page */
 163 #main {
 164     margin-left:25%;
 165     margin-bottom:0px;
 166 }
 167
 168 /* the main menu (home, adv search, login...) */
 169 #menu {
 170     position:fixed;
 171     margin-top:100px;
 172     border-right:1px solid black;
 173     padding:0px;
 174     font-size:0.8em;
 175     color:#384b73;
 176 }
 177 #menu ul a {
 178     display:block;
 179     margin:5px 5px 0px 5px;
 180     padding :5px 5px 0px 5px;
 181     text-decoration:none;
 182     color:#384b73;
 183     white-space: nowrap;
 184 }
 185 #menu ul a:hover {
 186     display:block;
 187     margin:5px 5px 0px 5px;
 188     padding :5px 5px 0px 5px;
 189     text-decoration:none;
 190     background-color:#384b73;
 191     color:white;
 192     white-space: nowrap;
 193 }
 194 #menu ul {
 195     padding-left:0px;
 196     margin-bottom:0px;
 197     margin-top:0px;
 198 }
 199 #menu li {
 200     list-style-type:none;
 201 }
 202 #menu label {
 203     font-style:italic;
 204     display:block;
 205     float:left;
 206     width:5em;
 207 }
 208
 209 #login {
 210     font-size:0.9em;
 211 }
 212 #login input {
 213     font-size:0.8em;
 214 }
 215 /* the user menu, for user option (and biblio detail view) */
 216 #usermenu {
 217     float:right;
 218 }
 219 #usermenu a {
 220     background-color : #EEC95A;
 221     color : #FFFFFF;
 222     font-size : 1em;
 223     border: 2px outset;
 224     font-weight : bold;
 225     margin:0px 5px 0px 0px;
 226     padding:2px 5px 2px 5px;
 227     text-decoration:none;
 228     display: block;
 229     white-space: nowrap;
 230 }
 231 #usermenu a:hover {
 232     border: 2px inset;
 233     background-color:#384b73;
 234 }
 235
 236 /* the opac-news */
 237 #news {
 238     width:20%;
 239     float:right;
 240     font-size:11px;
 241 }
 242 #news th {
 243 background-color:white;
 244 color:#384b73;
 245 }
 246
 247 /* "problem" enhancement */
 248 .problem {
 249 color: white;
 250 background-color:red;
 251 }
 252
 253 /* action buttons */
 254 #action a {
 255     background-color : #EEC95A;
 256     color : #FFFFFF;
 257     font-size : 1em;
 258     border: 2px outset;
 259     font-weight : bold;
 260     margin:0px 5px 0px 0px;
 261     padding-right:5px;
 262     padding-left:5px;
 263     text-decoration:none;
 264     display: inline;
 265 }
 266 #action a:hover {
 267     border: 2px inset;
 268     background-color:#CCCCCC;
 269 }
 270
 271 #auth {
 272     float:left;
 273 }
 274
 275 /* facets bloc */
 276 #facets {
 277     position:absolute;
 278     right:1em;
 279     font-size:0.8em;
 280     margin:0px;
 281     background-color:#eeeeee;
 282     border:1px solid #CCCCCC;
 283 }
 284
 285 #facets dl {
 286     margin:0px;
 287 }
 288 #facets dd {
 289     margin:0px;
 290 }
 291 #facets dt {
 292     font-weight:bold;
 293     background-color:#EEC95A;
 294     border:0px;
 295 }
 296
 297 #facets li {
 298     list-style-type: none;
 299     margin-left:0px;
 300 }
 301
 302 #facets ul {
 303     list-style-type: none;
 304     padding-left:10px;
 305     margin-bottom:0px;
 306     margin-top:0px;
 307 }
 308
 309 /* the USER information block */
 310 #librarian_information {
 311 float:right;
 312 font-size:10pt;
 313 }
 314
 315 /* the footer */
 316 #footer {
 317     margin-top:30px;
 318     margin-left:30%;
 319     margin-right:20%;
 320     border-top:1px solid #384b73;
 321     color: #384b73;
 322     font-size:1em;
 323     text-align:center;
 324 }
 325
 326
 327 legend {
 328 font-weight:bold;
 329 color:#384b73;
 330 }
 331
 332
 333 /* css styles for reserves color alerts */
 334 .onloan {
 335     background-color: #FFED3D;
 336 }
 337
 338 .reserved {
 339     background-color: #8EBAFF;
 340 }
 341
 342 .transfered {
 343     background-color: #F9FF9A;
 344 }
 345
 346 .inwait {
 347     background-color: #33CC99;
 348 }
 349
 350 .other {
 351     background-color: #FF0000;
 352 }
 353
 354 .available {
 355     font-size:0.75em;
 356 }
 357
 358 .unavailable {
 359     background-color: #FFED3D;
 360     font-size:0.75em;
 361 }
 362
 363 /* style for search terms in catalogsearch */
 364 .term {
 365 background-color:lightyellow;
 366 }
 367
 368 #opac-main-search form {
 369     display:inline;
 370 }