X-Git-Url: http://git.roojs.org/?a=blobdiff_plain;f=less%2Froojs-bootstrap%2Fnav-tabs.scss;fp=less%2Froojs-bootstrap%2Fnav-tabs.scss;h=623330494360f384f20c8ebd68b2ac5fb066fc34;hb=f206177e58d825fea0e90a0a6ea27bb192f1afdd;hp=0000000000000000000000000000000000000000;hpb=40658951781a12aa5b6cf5537901fcd0d93d29a4;p=roojs1 diff --git a/less/roojs-bootstrap/nav-tabs.scss b/less/roojs-bootstrap/nav-tabs.scss new file mode 100644 index 0000000000..6233304943 --- /dev/null +++ b/less/roojs-bootstrap/nav-tabs.scss @@ -0,0 +1,108 @@ +/* NAV TABS */ +.nav-tabs-custom { + margin-bottom: 20px; + background: $body-bg; + box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); +} +.nav-tabs-custom > .nav-tabs { + margin: 0; + border-bottom-color: $gray-light; //#f4f4f4; +} +.nav-tabs-custom > .nav-tabs > li { + border-top: 3px solid transparent; + margin-bottom: -2px; + margin-right: 5px; +} +.nav-tabs-custom > .nav-tabs > li > a { + -webkit-border-radius: 0 !important; + -moz-border-radius: 0 !important; + border-radius: 0 !important; +} +.nav-tabs-custom > .nav-tabs > li > a, +.nav-tabs-custom > .nav-tabs > li > a:hover { + background: transparent; + margin: 0; +} +.nav-tabs-custom > .nav-tabs > li:not(.active) > a:hover, +.nav-tabs-custom > .nav-tabs > li:not(.active) > a:focus, +.nav-tabs-custom > .nav-tabs > li:not(.active) > a:active { + border-color: transparent; +} +.nav-tabs-custom > .nav-tabs > li.active { + border-top-color: $brand-primary; //#3c8dbc; +} +.nav-tabs-custom > .nav-tabs > li.active > a, +.nav-tabs-custom > .nav-tabs > li.active:hover > a { + background-color: $body-bg; +} +.nav-tabs-custom > .nav-tabs > li.active > a { + border-top: 0; + border-left-color: $gray-light; //#f4f4f4;; + border-right-color: $gray-light; //#f4f4f4;; +} +.nav-tabs-custom > .nav-tabs > li:first-of-type { + margin-left: 0px; +} +.nav-tabs-custom > .nav-tabs > li:first-of-type.active > a { + border-left-width: 0; +} +.nav-tabs-custom > .nav-tabs.pull-right { + float: none!important; +} +.nav-tabs-custom > .nav-tabs.pull-right > li { + float: right; +} +.nav-tabs-custom > .nav-tabs.pull-right > li:first-of-type { + margin-right: 0px; +} +.nav-tabs-custom > .nav-tabs.pull-right > li:first-of-type.active > a { + border-left-width: 1px; + border-right-width: 0px; +} +.nav-tabs-custom > .nav-tabs > li.header { + font-weight: 400; + line-height: 35px; + padding: 0 10px; + font-size: 20px; + color: $gray-dark; //#444; + cursor: default; +} +.nav-tabs-custom > .nav-tabs > li.header > .fa, +.nav-tabs-custom > .nav-tabs > li.header > .glyphicon, +.nav-tabs-custom > .nav-tabs > li.header > .ion { + margin-right: 10px; +} +.nav-tabs-custom > .tab-content { + background: $body-bg; + padding: 10px; +} +/* --- override it appears it's done un-reliably in JS normally.. */ +.tab-content > .tab-pane { + position: absolute; +} + +.tab-content > .tab-pane .navbar > .navbar-nav > .nav-item .roo-toolbar { + margin: 0 5px; +} + +.tab-content > .tab-pane .navbar > .navbar-nav > .nav-item .roo-toolbar > .column { + padding: 10px 5px; +} + +@media (max-width: 768px) { + .tab-content > .tab-pane .navbar > .navbar-nav > .nav-item .roo-toolbar > .column { + padding: 5px 5px; + } +} + +.tab-content > .tab-pane .navbar > .navbar-nav > .nav-item .form-group { + margin-bottom: 0px; +} + +.tab-content > .tab-pane .navbar > .navbar-nav > .nav-item button + button { + margin-left: 5px; +} + +.tab-content > .tab-pane .navbar > .navbar-nav a.dropdown-toggle { + padding: 10px 5px; +} \ No newline at end of file