@import "common.less"; /** * @file * Tabs Styling * * Adds styles for the primary and secondary tabs. * * Compare this with default CSS found in the system module's stylesheet (a copy * of which is in drupal7-reference.css.) */ /* * Basic positioning styles shared by primary and secondary tabs. */ ul.primary, ul.secondary { overflow: hidden; *zoom: 1; border-bottom: 1px solid #bbbbbb; list-style: none; margin: 1em 0 1.5em; padding: 0 2px; white-space: nowrap; } ul.primary li, ul.secondary li { float: left; /* LTR */ margin: 0.5em 3px 0; } ul.primary a, ul.secondary a { border: 1px solid #e9e9e9; border-right: 0; border-bottom: 0; display: block; line-height: 1.2; .linkNoHover(); } /* * Primary tabs */ ul.primary li { .borderRadius(4px, 4px); text-shadow: white 1px 1px 0; border: 1px solid #bbbbbb; border-bottom: 0; margin: 0.5em 0 0 3px; /* LTR */ } ul.primary li.active { border-bottom: 1px solid white; margin-bottom: -1px; /* Overlap the ul's border. */ } ul.primary a:link, ul.primary a:visited { .borderRadius(4px, 4px); .transition(background-color, 0.3s); background-color: #dedede; color: #333; letter-spacing: 1px; padding: 0 1em; text-align: center; } .hover ul.primary a:hover, ul.primary a:focus { /* boer aendres jeth */ background-color: #e9e9e9; border-color: #f2f2f2; } ul.primary a.active { background-color: transparent; *zoom: 1; filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FFE9E9E9', endColorstr='#00E9E9E9'); background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e9e9e9), color-stop(100%, rgba(233, 233, 233, 0))); background-image: -webkit-linear-gradient(#e9e9e9, rgba(233, 233, 233, 0)); background-image: -moz-linear-gradient(#e9e9e9, rgba(233, 233, 233, 0)); background-image: -o-linear-gradient(#e9e9e9, rgba(233, 233, 233, 0)); background-image: -ms-linear-gradient(#e9e9e9, rgba(233, 233, 233, 0)); background-image: linear-gradient(#e9e9e9, rgba(233, 233, 233, 0)); border-color: #fff; } /* * Secondary tabs */ ul.secondary { font-size: @FSsmaller; // font-size: .9em; margin-top: -1.5em; /* Collapse bottom margin of ul.primary. */ padding-bottom: .5em; } ul.secondary a:link, ul.secondary a:visited { .borderRadius(0.75em); .transition(background-color, 0.3s); background-color: #f2f2f2; text-shadow: white 1px 1px 0; color: #666; padding: 0 .5em; } .hover ul.secondary a:hover, ul.secondary a:focus { /* boer aendres jeth */ background-color: #dedede; border-color: #999; color: #333; } ul.secondary a.active, ul.secondary a:active { text-shadow: #333333 1px 1px 0; background-color: #666; border-color: #000; color: #fff; }