www/include/styles/headertabcontrol.css

Code
Comments
Other
Rev Date Author Line
7604 25 Feb 19 nicklas 1 @charset "UTF-8";
7604 25 Feb 19 nicklas 2 /* $Id$
7604 25 Feb 19 nicklas 3   ------------------------------------------------------------------
7604 25 Feb 19 nicklas 4   Copyright (C) 2006 Jari Häkkinen, Nicklas Nordborg
7604 25 Feb 19 nicklas 5
7604 25 Feb 19 nicklas 6   This file is part of BASE - BioArray Software Environment.
7604 25 Feb 19 nicklas 7   Available at http://base.thep.lu.se/
7604 25 Feb 19 nicklas 8
7604 25 Feb 19 nicklas 9   BASE is free software; you can redistribute it and/or
7604 25 Feb 19 nicklas 10   modify it under the terms of the GNU General Public License
7604 25 Feb 19 nicklas 11   as published by the Free Software Foundation; either version 3
7604 25 Feb 19 nicklas 12   of the License, or (at your option) any later version.
7604 25 Feb 19 nicklas 13
7604 25 Feb 19 nicklas 14   BASE is distributed in the hope that it will be useful,
7604 25 Feb 19 nicklas 15   but WITHOUT ANY WARRANTY; without even the implied warranty of
7604 25 Feb 19 nicklas 16   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
7604 25 Feb 19 nicklas 17   GNU General Public License for more details.
7604 25 Feb 19 nicklas 18
7604 25 Feb 19 nicklas 19   You should have received a copy of the GNU General Public License
7604 25 Feb 19 nicklas 20   along with BASE. If not, see <http://www.gnu.org/licenses/>.
7604 25 Feb 19 nicklas 21   ------------------------------------------------------------------
7604 25 Feb 19 nicklas 22
7604 25 Feb 19 nicklas 23   Stylesheet used by the TabControl taglib. Used on all pages with a TabControl.
7604 25 Feb 19 nicklas 24
7604 25 Feb 19 nicklas 25   @author Nicklas
7604 25 Feb 19 nicklas 26   @version 2.0
7604 25 Feb 19 nicklas 27 */
7604 25 Feb 19 nicklas 28
7604 25 Feb 19 nicklas 29 /* Main tab control */
7604 25 Feb 19 nicklas 30 .tabcontrol
7604 25 Feb 19 nicklas 31 {}
7604 25 Feb 19 nicklas 32
7604 25 Feb 19 nicklas 33 /* Main content area */
7604 25 Feb 19 nicklas 34 .tabcontrol .tabcontents
7604 25 Feb 19 nicklas 35 {}
7604 25 Feb 19 nicklas 36
7604 25 Feb 19 nicklas 37
7604 25 Feb 19 nicklas 38 /* Tabs */
7604 25 Feb 19 nicklas 39 .tabcontrol table.tabscontainer, .tabcontrol .tabs > table
7604 25 Feb 19 nicklas 40 {
7604 25 Feb 19 nicklas 41   border-collapse: separate;
7604 25 Feb 19 nicklas 42 }
7604 25 Feb 19 nicklas 43
7604 25 Feb 19 nicklas 44 .tabcontrol .tab
7604 25 Feb 19 nicklas 45 {
7604 25 Feb 19 nicklas 46   border-width: 1px;
7604 25 Feb 19 nicklas 47   padding: 2px 6px 2px 4px;
7604 25 Feb 19 nicklas 48 }
7604 25 Feb 19 nicklas 49
7604 25 Feb 19 nicklas 50
7604 25 Feb 19 nicklas 51 /* Put blue-ish border around tab when hovering or tab is focused */
7604 25 Feb 19 nicklas 52 .tabcontrol .tab:hover, .tabcontrol .tab:focus
7604 25 Feb 19 nicklas 53 {
7604 25 Feb 19 nicklas 54   /* Decrese padding to avoid movement */
7604 25 Feb 19 nicklas 55   border-width: 2px;
7604 25 Feb 19 nicklas 56   padding: 1px 5px 1px 3px;
7604 25 Feb 19 nicklas 57 }
7604 25 Feb 19 nicklas 58
7604 25 Feb 19 nicklas 59 .tabcontrol .tab.active
7604 25 Feb 19 nicklas 60 {
7604 25 Feb 19 nicklas 61   font-weight: bold;
7604 25 Feb 19 nicklas 62 }
7604 25 Feb 19 nicklas 63
7604 25 Feb 19 nicklas 64 /* White background color when the tab is active */
7604 25 Feb 19 nicklas 65 .tabcontrol .tab.active.white
7604 25 Feb 19 nicklas 66 {
7604 25 Feb 19 nicklas 67   background-color: #FFFFFF;
7604 25 Feb 19 nicklas 68 }
7604 25 Feb 19 nicklas 69
7604 25 Feb 19 nicklas 70 /* Creates a small space between the tabs */
7604 25 Feb 19 nicklas 71 .tabcontrol .tabspace
7604 25 Feb 19 nicklas 72 {
7604 25 Feb 19 nicklas 73   width: 2px;
7604 25 Feb 19 nicklas 74   max-width: 2px;
7604 25 Feb 19 nicklas 75   min-width: 2px;
7604 25 Feb 19 nicklas 76 }
7604 25 Feb 19 nicklas 77
7604 25 Feb 19 nicklas 78 /* Specific for tabcontrol with tabs on top */
7604 25 Feb 19 nicklas 79 .tabsattop .tabs
7604 25 Feb 19 nicklas 80 {
7604 25 Feb 19 nicklas 81   vertical-align: bottom;
7604 25 Feb 19 nicklas 82 }
7604 25 Feb 19 nicklas 83
7604 25 Feb 19 nicklas 84 .tabsattop .tab 
7604 25 Feb 19 nicklas 85 {
7604 25 Feb 19 nicklas 86   /* Rounded corners on top */
7604 25 Feb 19 nicklas 87   border-radius: 5px 5px 0px 0px;
7604 25 Feb 19 nicklas 88 }
7604 25 Feb 19 nicklas 89
7604 25 Feb 19 nicklas 90 /* Hide bottom border from active tab */
7604 25 Feb 19 nicklas 91 .tabsattop .tab.active
7604 25 Feb 19 nicklas 92 {
7604 25 Feb 19 nicklas 93   border-bottom-color: transparent;
7604 25 Feb 19 nicklas 94   padding-top: 1px;
7604 25 Feb 19 nicklas 95   border-top-width: 2px;
7604 25 Feb 19 nicklas 96   border-top-color: #2288AA;
7604 25 Feb 19 nicklas 97 }
7604 25 Feb 19 nicklas 98
7604 25 Feb 19 nicklas 99 /* Revert to default for the active tab */
7604 25 Feb 19 nicklas 100 .tabsattop .tab.active:hover, .tabsattop .tab.active:focus
7604 25 Feb 19 nicklas 101 {
7604 25 Feb 19 nicklas 102   cursor: auto;
7604 25 Feb 19 nicklas 103   border-width: 2px 1px 1px 1px;
7604 25 Feb 19 nicklas 104   padding: 1px 6px 2px 4px;
7604 25 Feb 19 nicklas 105 }
7604 25 Feb 19 nicklas 106
7604 25 Feb 19 nicklas 107 /* Add bottom border on tabspace */
7604 25 Feb 19 nicklas 108 .tabsattop .tabspace
7604 25 Feb 19 nicklas 109 {
7604 25 Feb 19 nicklas 110   border-bottom-width: 1px;
7604 25 Feb 19 nicklas 111 }
7604 25 Feb 19 nicklas 112
7604 25 Feb 19 nicklas 113 .tabsattop .tabfillbefore
7604 25 Feb 19 nicklas 114 {
7604 25 Feb 19 nicklas 115   width: 5px;
7604 25 Feb 19 nicklas 116   min-width: 5px;
7604 25 Feb 19 nicklas 117   max-width: 5px;
7604 25 Feb 19 nicklas 118   border-bottom-width: 1px;
7604 25 Feb 19 nicklas 119 }
7604 25 Feb 19 nicklas 120
7604 25 Feb 19 nicklas 121 .tabsattop .tabfillafter
7604 25 Feb 19 nicklas 122 {
7604 25 Feb 19 nicklas 123   width: 99%;
7604 25 Feb 19 nicklas 124   border-bottom-width: 1px;
7604 25 Feb 19 nicklas 125 }
7604 25 Feb 19 nicklas 126
7604 25 Feb 19 nicklas 127 .mastertabcontrol > .tabcontents
7604 25 Feb 19 nicklas 128 {
7604 25 Feb 19 nicklas 129   position: absolute;
7604 25 Feb 19 nicklas 130   top: 2em;
7604 25 Feb 19 nicklas 131   left: 0;
7604 25 Feb 19 nicklas 132   right: 0;
7604 25 Feb 19 nicklas 133   bottom: 0;
7604 25 Feb 19 nicklas 134   overflow: auto;
7604 25 Feb 19 nicklas 135 }
7604 25 Feb 19 nicklas 136
7604 25 Feb 19 nicklas 137 .mastertabcontrol.notabs > .tabcontents
7604 25 Feb 19 nicklas 138 {
7604 25 Feb 19 nicklas 139   top: 0;
7604 25 Feb 19 nicklas 140 }
7604 25 Feb 19 nicklas 141
7604 25 Feb 19 nicklas 142 .mastertabcontrol > .tabscontainer
7604 25 Feb 19 nicklas 143 {
7604 25 Feb 19 nicklas 144   position: absolute;
7604 25 Feb 19 nicklas 145   top: 0;
7604 25 Feb 19 nicklas 146   height: 2em;
7604 25 Feb 19 nicklas 147 }
7604 25 Feb 19 nicklas 148
7604 25 Feb 19 nicklas 149
7604 25 Feb 19 nicklas 150
7604 25 Feb 19 nicklas 151