less/roojs-bootstrap/alert.scss
[roojs1] / less / roojs-bootstrap / nav-tabs.scss
diff --git a/less/roojs-bootstrap/nav-tabs.scss b/less/roojs-bootstrap/nav-tabs.scss
new file mode 100644 (file)
index 0000000..6233304
--- /dev/null
@@ -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