annotate core/themes/bartik/css/components/tabs.css @ 0:4c8ae668cc8c

Initial import (non-working)
author Chris Cannam
date Wed, 29 Nov 2017 16:09:58 +0000
parents
children 1fec387a4317
rev   line source
Chris@0 1 /* --------------- System Tabs --------------- */
Chris@0 2
Chris@0 3 div.tabs {
Chris@0 4 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
Chris@0 5 margin-bottom: 20px;
Chris@0 6 }
Chris@0 7 .tabs ul.primary {
Chris@0 8 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
Chris@0 9 }
Chris@0 10 .tabs ul.primary li a {
Chris@0 11 color: #000;
Chris@0 12 background-color: #ededed;
Chris@0 13 border-color: #bbb;
Chris@0 14 border-style: solid solid none solid;
Chris@0 15 border-width: 1px;
Chris@0 16 height: 1.8em;
Chris@0 17 line-height: 1.9;
Chris@0 18 display: block;
Chris@0 19 font-size: 0.929em;
Chris@0 20 padding: 0 10px 3px;
Chris@0 21 text-shadow: 0 1px 0 #fff;
Chris@0 22 }
Chris@0 23 .tabs ul.primary li.is-active a {
Chris@0 24 background-color: #ffffff;
Chris@0 25 border: 1px solid #bbb;
Chris@0 26 }
Chris@0 27 @media screen and (max-width: 37.5em) { /* 600px */
Chris@0 28 .tabs ul.primary {
Chris@0 29 border-bottom: 1px solid #bbb;
Chris@0 30 }
Chris@0 31 .tabs ul.primary li {
Chris@0 32 display: block;
Chris@0 33 margin: 0;
Chris@0 34 }
Chris@0 35 .tabs ul.primary li a {
Chris@0 36 padding: 5px 10px;
Chris@0 37 }
Chris@0 38 .tabs ul.primary li.is-active a {
Chris@0 39 border-bottom: none;
Chris@0 40 }
Chris@0 41 }
Chris@0 42 @media screen and (min-width: 37.5em) { /* 600px */
Chris@0 43 .tabs ul.primary {
Chris@0 44 border-collapse: collapse;
Chris@0 45 height: auto;
Chris@0 46 line-height: normal;
Chris@0 47 padding: 0 3px;
Chris@0 48 margin: 0;
Chris@0 49 overflow: hidden;
Chris@0 50 border: none;
Chris@0 51 background: transparent url(../../images/tabs-border.png) repeat-x left bottom;
Chris@0 52 white-space: nowrap;
Chris@0 53 }
Chris@0 54 .tabs ul.primary li {
Chris@0 55 display: block;
Chris@0 56 float: left; /* LTR */
Chris@0 57 vertical-align: bottom;
Chris@0 58 margin: 0 5px 0 0; /* LTR */
Chris@0 59 }
Chris@0 60 [dir="rtl"] .tabs ul.primary li {
Chris@0 61 margin: 0 0 0 5px;
Chris@0 62 float: right;
Chris@0 63 }
Chris@0 64 .tabs ul.primary li a {
Chris@0 65 float: left; /* not LTR */
Chris@0 66 border-top-left-radius: 6px;
Chris@0 67 border-top-right-radius: 6px;
Chris@0 68 }
Chris@0 69 .tabs ul.primary li.is-active a {
Chris@0 70 border-bottom: 1px solid #fff;
Chris@0 71 }
Chris@0 72 }
Chris@0 73 .tabs ul.secondary {
Chris@0 74 border-bottom: none;
Chris@0 75 margin: 5px;
Chris@0 76 padding: 0.5em 0;
Chris@0 77 overflow: hidden;
Chris@0 78 }
Chris@0 79 .tabs ul.secondary li {
Chris@0 80 border-right: 1px solid #ccc; /* LTR */
Chris@0 81 display: block;
Chris@0 82 float: left; /* LTR */
Chris@0 83 margin: 0;
Chris@0 84 padding: 0 1em;
Chris@0 85 }
Chris@0 86 [dir="rtl"] .tabs ul.secondary li {
Chris@0 87 border-left: 1px solid #ccc;
Chris@0 88 border-right: none;
Chris@0 89 float: right;
Chris@0 90 }
Chris@0 91 .tabs ul.secondary li:last-child {
Chris@0 92 border-right: none; /* LTR */
Chris@0 93 }
Chris@0 94 [dir="rtl"] .tabs ul.secondary li:last-child {
Chris@0 95 border-left: none;
Chris@0 96 }
Chris@0 97 .tabs ul.secondary li:first-child {
Chris@0 98 padding-left: 0; /* LTR */
Chris@0 99 }
Chris@0 100 [dir="rtl"] .tabs ul.secondary li:first-child {
Chris@0 101 padding-right: 0;
Chris@0 102 }
Chris@0 103 .tabs ul.secondary li a {
Chris@0 104 display: inline;
Chris@0 105 padding: 0.25em 0.5em;
Chris@0 106 text-decoration: none;
Chris@0 107 }
Chris@0 108 .tabs ul.secondary li a.is-active {
Chris@0 109 background: #f2f2f2;
Chris@0 110 border-bottom: none;
Chris@0 111 border-radius: 5px;
Chris@0 112 }