From 5274f93db7803d2f6fdb8b73253b62124e8e6aef Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Sun, 14 Feb 2016 18:02:53 +0100 Subject: [PATCH] ux(less): began less / bootstrap less cleanup and restructuring --- .../app/features/admin/adminSettingsCtrl.js | 24 -- .../less => less/bootstrap}/alerts.less | 0 .../less => less/bootstrap}/bootstrap.less | 2 - .../bootstrap}/button-groups.less | 0 .../less => less/bootstrap}/buttons.less | 0 .../less => less/bootstrap}/close.less | 0 .../less => less/bootstrap}/code.less | 0 .../bootstrap}/component-animations.less | 0 .../less => less/bootstrap}/dropdowns.less | 0 .../less => less/bootstrap}/forms.less | 0 .../less => less/bootstrap}/grid.less | 0 .../bootstrap}/labels-badges.less | 0 .../less => less/bootstrap}/layouts.less | 0 .../less => less/bootstrap}/media.less | 0 .../less => less/bootstrap}/mixins.less | 0 .../less => less/bootstrap}/modals.less | 0 .../less => less/bootstrap}/navbar.less | 111 ------- .../less => less/bootstrap}/navs.less | 0 .../less => less/bootstrap}/popovers.less | 0 .../less => less/bootstrap}/reset.less | 0 .../bootstrap}/responsive-1200px-min.less | 0 .../bootstrap}/responsive-767px-max.less | 0 .../bootstrap}/responsive-768px-979px.less | 0 .../bootstrap}/responsive-utilities.less | 0 .../less => less/bootstrap}/responsive.less | 15 - .../less => less/bootstrap}/scaffolding.less | 0 .../less => less/bootstrap}/tables.less | 0 .../less => less/bootstrap}/tooltip.less | 0 .../less => less/bootstrap}/type.less | 0 .../less => less/bootstrap}/utilities.less | 0 public/less/bootswatch.dark.less | 185 +---------- public/less/bootswatch.light.less | 170 ---------- public/less/grafana-responsive.less | 6 +- ...{bootstrap.dark.less => grafana.dark.less} | 6 +- ...ootstrap.light.less => grafana.light.less} | 6 +- public/vendor/bootstrap/less/variables.less | 301 ------------------ tasks/options/less.js | 6 +- 37 files changed, 13 insertions(+), 819 deletions(-) delete mode 100644 public/app/features/admin/adminSettingsCtrl.js rename public/{vendor/bootstrap/less => less/bootstrap}/alerts.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/bootstrap.less (91%) rename public/{vendor/bootstrap/less => less/bootstrap}/button-groups.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/buttons.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/close.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/code.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/component-animations.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/dropdowns.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/forms.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/grid.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/labels-badges.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/layouts.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/media.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/mixins.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/modals.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/navbar.less (63%) rename public/{vendor/bootstrap/less => less/bootstrap}/navs.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/popovers.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/reset.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/responsive-1200px-min.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/responsive-767px-max.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/responsive-768px-979px.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/responsive-utilities.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/responsive.less (71%) rename public/{vendor/bootstrap/less => less/bootstrap}/scaffolding.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/tables.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/tooltip.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/type.less (100%) rename public/{vendor/bootstrap/less => less/bootstrap}/utilities.less (100%) rename public/less/{bootstrap.dark.less => grafana.dark.less} (59%) rename public/less/{bootstrap.light.less => grafana.light.less} (60%) delete mode 100644 public/vendor/bootstrap/less/variables.less diff --git a/public/app/features/admin/adminSettingsCtrl.js b/public/app/features/admin/adminSettingsCtrl.js deleted file mode 100644 index d980281577d..00000000000 --- a/public/app/features/admin/adminSettingsCtrl.js +++ /dev/null @@ -1,24 +0,0 @@ -define([ - 'angular', -], -function (angular) { - 'use strict'; - - var module = angular.module('grafana.controllers'); - - module.controller('AdminSettingsCtrl', function($scope, backendSrv) { - - $scope.init = function() { - $scope.getUsers(); - }; - - $scope.getUsers = function() { - backendSrv.get('/api/admin/settings').then(function(settings) { - $scope.settings = settings; - }); - }; - - $scope.init(); - - }); -}); diff --git a/public/vendor/bootstrap/less/alerts.less b/public/less/bootstrap/alerts.less similarity index 100% rename from public/vendor/bootstrap/less/alerts.less rename to public/less/bootstrap/alerts.less diff --git a/public/vendor/bootstrap/less/bootstrap.less b/public/less/bootstrap/bootstrap.less similarity index 91% rename from public/vendor/bootstrap/less/bootstrap.less rename to public/less/bootstrap/bootstrap.less index 9529c54cda4..5fbb1439bbc 100644 --- a/public/vendor/bootstrap/less/bootstrap.less +++ b/public/less/bootstrap/bootstrap.less @@ -8,8 +8,6 @@ * Designed and built with all the love in the world by @mdo and @fat. */ -// Core variables and mixins -@import "variables.less"; // Modify this for custom colors, font-sizes, etc @import "mixins.less"; // CSS Reset diff --git a/public/vendor/bootstrap/less/button-groups.less b/public/less/bootstrap/button-groups.less similarity index 100% rename from public/vendor/bootstrap/less/button-groups.less rename to public/less/bootstrap/button-groups.less diff --git a/public/vendor/bootstrap/less/buttons.less b/public/less/bootstrap/buttons.less similarity index 100% rename from public/vendor/bootstrap/less/buttons.less rename to public/less/bootstrap/buttons.less diff --git a/public/vendor/bootstrap/less/close.less b/public/less/bootstrap/close.less similarity index 100% rename from public/vendor/bootstrap/less/close.less rename to public/less/bootstrap/close.less diff --git a/public/vendor/bootstrap/less/code.less b/public/less/bootstrap/code.less similarity index 100% rename from public/vendor/bootstrap/less/code.less rename to public/less/bootstrap/code.less diff --git a/public/vendor/bootstrap/less/component-animations.less b/public/less/bootstrap/component-animations.less similarity index 100% rename from public/vendor/bootstrap/less/component-animations.less rename to public/less/bootstrap/component-animations.less diff --git a/public/vendor/bootstrap/less/dropdowns.less b/public/less/bootstrap/dropdowns.less similarity index 100% rename from public/vendor/bootstrap/less/dropdowns.less rename to public/less/bootstrap/dropdowns.less diff --git a/public/vendor/bootstrap/less/forms.less b/public/less/bootstrap/forms.less similarity index 100% rename from public/vendor/bootstrap/less/forms.less rename to public/less/bootstrap/forms.less diff --git a/public/vendor/bootstrap/less/grid.less b/public/less/bootstrap/grid.less similarity index 100% rename from public/vendor/bootstrap/less/grid.less rename to public/less/bootstrap/grid.less diff --git a/public/vendor/bootstrap/less/labels-badges.less b/public/less/bootstrap/labels-badges.less similarity index 100% rename from public/vendor/bootstrap/less/labels-badges.less rename to public/less/bootstrap/labels-badges.less diff --git a/public/vendor/bootstrap/less/layouts.less b/public/less/bootstrap/layouts.less similarity index 100% rename from public/vendor/bootstrap/less/layouts.less rename to public/less/bootstrap/layouts.less diff --git a/public/vendor/bootstrap/less/media.less b/public/less/bootstrap/media.less similarity index 100% rename from public/vendor/bootstrap/less/media.less rename to public/less/bootstrap/media.less diff --git a/public/vendor/bootstrap/less/mixins.less b/public/less/bootstrap/mixins.less similarity index 100% rename from public/vendor/bootstrap/less/mixins.less rename to public/less/bootstrap/mixins.less diff --git a/public/vendor/bootstrap/less/modals.less b/public/less/bootstrap/modals.less similarity index 100% rename from public/vendor/bootstrap/less/modals.less rename to public/less/bootstrap/modals.less diff --git a/public/vendor/bootstrap/less/navbar.less b/public/less/bootstrap/navbar.less similarity index 63% rename from public/vendor/bootstrap/less/navbar.less rename to public/less/bootstrap/navbar.less index 40b9a96490b..dd8d91bf1e7 100644 --- a/public/vendor/bootstrap/less/navbar.less +++ b/public/less/bootstrap/navbar.less @@ -203,114 +203,3 @@ .border-radius(6px 0 6px 6px); } } - - -// Inverted navbar -// ------------------------- - -.navbar-inverse { - - .navbar-inner { - #gradient > .vertical(@navbarInverseBackgroundHighlight, @navbarInverseBackground); - border-color: @navbarInverseBorder; - } - - .brand, - .nav > li > a { - color: @navbarInverseLinkColor; - text-shadow: 0 -1px 0 rgba(0,0,0,.25); - &:hover, - &:focus { - color: @navbarInverseLinkColorHover; - } - } - - .brand { - color: @navbarInverseBrandColor; - } - - .navbar-text { - color: @navbarInverseText; - } - - .nav > li > a:focus, - .nav > li > a:hover { - background-color: @navbarInverseLinkBackgroundHover; - color: @navbarInverseLinkColorHover; - } - - .nav .active > a, - .nav .active > a:hover, - .nav .active > a:focus { - color: @navbarInverseLinkColorActive; - background-color: @navbarInverseLinkBackgroundActive; - } - - // Inline text links - .navbar-link { - color: @navbarInverseLinkColor; - &:hover, - &:focus { - color: @navbarInverseLinkColorHover; - } - } - - // Dividers in navbar - .divider-vertical { - border-left-color: @navbarInverseBackground; - border-right-color: @navbarInverseBackgroundHighlight; - } - - // Dropdowns - .nav li.dropdown.open > .dropdown-toggle, - .nav li.dropdown.active > .dropdown-toggle, - .nav li.dropdown.open.active > .dropdown-toggle { - background-color: @navbarInverseLinkBackgroundActive; - color: @navbarInverseLinkColorActive; - } - .nav li.dropdown > a:hover .caret, - .nav li.dropdown > a:focus .caret { - border-top-color: @navbarInverseLinkColorActive; - border-bottom-color: @navbarInverseLinkColorActive; - } - .nav li.dropdown > .dropdown-toggle .caret { - border-top-color: @navbarInverseLinkColor; - border-bottom-color: @navbarInverseLinkColor; - } - .nav li.dropdown.open > .dropdown-toggle .caret, - .nav li.dropdown.active > .dropdown-toggle .caret, - .nav li.dropdown.open.active > .dropdown-toggle .caret { - border-top-color: @navbarInverseLinkColorActive; - border-bottom-color: @navbarInverseLinkColorActive; - } - - // Navbar search - .navbar-search { - .search-query { - color: @white; - background-color: @navbarInverseSearchBackground; - border-color: @navbarInverseSearchBorder; - .box-shadow(~"inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.15)"); - .transition(none); - .placeholder(@navbarInverseSearchPlaceholderColor); - - // Focus states (we use .focused since IE7-8 and down doesn't support :focus) - &:focus, - &.focused { - padding: 5px 15px; - color: @grayDark; - text-shadow: 0 1px 0 @white; - background-color: @navbarInverseSearchBackgroundFocus; - border: 0; - .box-shadow(0 0 3px rgba(0,0,0,.15)); - outline: 0; - } - } - } - - // Navbar collapse button - .btn-navbar { - .buttonBackground(darken(@navbarInverseBackgroundHighlight, 5%), darken(@navbarInverseBackground, 5%)); - } - -} diff --git a/public/vendor/bootstrap/less/navs.less b/public/less/bootstrap/navs.less similarity index 100% rename from public/vendor/bootstrap/less/navs.less rename to public/less/bootstrap/navs.less diff --git a/public/vendor/bootstrap/less/popovers.less b/public/less/bootstrap/popovers.less similarity index 100% rename from public/vendor/bootstrap/less/popovers.less rename to public/less/bootstrap/popovers.less diff --git a/public/vendor/bootstrap/less/reset.less b/public/less/bootstrap/reset.less similarity index 100% rename from public/vendor/bootstrap/less/reset.less rename to public/less/bootstrap/reset.less diff --git a/public/vendor/bootstrap/less/responsive-1200px-min.less b/public/less/bootstrap/responsive-1200px-min.less similarity index 100% rename from public/vendor/bootstrap/less/responsive-1200px-min.less rename to public/less/bootstrap/responsive-1200px-min.less diff --git a/public/vendor/bootstrap/less/responsive-767px-max.less b/public/less/bootstrap/responsive-767px-max.less similarity index 100% rename from public/vendor/bootstrap/less/responsive-767px-max.less rename to public/less/bootstrap/responsive-767px-max.less diff --git a/public/vendor/bootstrap/less/responsive-768px-979px.less b/public/less/bootstrap/responsive-768px-979px.less similarity index 100% rename from public/vendor/bootstrap/less/responsive-768px-979px.less rename to public/less/bootstrap/responsive-768px-979px.less diff --git a/public/vendor/bootstrap/less/responsive-utilities.less b/public/less/bootstrap/responsive-utilities.less similarity index 100% rename from public/vendor/bootstrap/less/responsive-utilities.less rename to public/less/bootstrap/responsive-utilities.less diff --git a/public/vendor/bootstrap/less/responsive.less b/public/less/bootstrap/responsive.less similarity index 71% rename from public/vendor/bootstrap/less/responsive.less rename to public/less/bootstrap/responsive.less index 0affbbbe6ff..9fe486aa5b6 100644 --- a/public/vendor/bootstrap/less/responsive.less +++ b/public/less/bootstrap/responsive.less @@ -18,25 +18,10 @@ // ------------------------- // Required since we compile the responsive stuff separately -@import "variables.less"; // Modify this for custom colors, font-sizes, etc @import "mixins.less"; - - -// RESPONSIVE CLASSES -// ------------------ @import "responsive-utilities.less"; - - -// MEDIA QUERIES -// ------------------ - -// Large desktops @import "responsive-1200px-min.less"; - -// Tablets to regular desktops @import "responsive-768px-979px.less"; - -// Phones to portrait tablets and narrow desktops @import "responsive-767px-max.less"; diff --git a/public/vendor/bootstrap/less/scaffolding.less b/public/less/bootstrap/scaffolding.less similarity index 100% rename from public/vendor/bootstrap/less/scaffolding.less rename to public/less/bootstrap/scaffolding.less diff --git a/public/vendor/bootstrap/less/tables.less b/public/less/bootstrap/tables.less similarity index 100% rename from public/vendor/bootstrap/less/tables.less rename to public/less/bootstrap/tables.less diff --git a/public/vendor/bootstrap/less/tooltip.less b/public/less/bootstrap/tooltip.less similarity index 100% rename from public/vendor/bootstrap/less/tooltip.less rename to public/less/bootstrap/tooltip.less diff --git a/public/vendor/bootstrap/less/type.less b/public/less/bootstrap/type.less similarity index 100% rename from public/vendor/bootstrap/less/type.less rename to public/less/bootstrap/type.less diff --git a/public/vendor/bootstrap/less/utilities.less b/public/less/bootstrap/utilities.less similarity index 100% rename from public/vendor/bootstrap/less/utilities.less rename to public/less/bootstrap/utilities.less diff --git a/public/less/bootswatch.dark.less b/public/less/bootswatch.dark.less index 1f11a50e08d..6c0de417eeb 100644 --- a/public/less/bootswatch.dark.less +++ b/public/less/bootswatch.dark.less @@ -5,26 +5,6 @@ // TYPOGRAPHY // ----------------------------------------------------- -label, input, button, select, textarea, -.navbar .search-query:-moz-placeholder, -.navbar .search-query::-webkit-input-placeholder { - font-family: 'Droid Sans', sans-serif; - color: @gray; -} - - - -blockquote { - border-left: 5px solid @grayDark; - - &.pull-right { - border-right: 5px solid @grayDark; - } -} - -// SCAFFOLDING -// ----------------------------------------------------- - html { height: 100%; } @@ -93,54 +73,9 @@ hr { text-shadow: none; .placeholder(@gray); } - - &-inverse { - - } } -div.subnav { - - margin: 0 1px; - background-color: @grayDarker; - background-image: none; - border: none; - border-bottom: 1px solid @grayDark; - - .nav > li > a, - .nav > li:first-child > a, - .nav > li:first-child > a:hover { - padding: 11px 12px; - border: none; - background-color: @grayDarker; - color: @grayLight; - } - - .nav > li > a:hover, - .nav > li.active > a, - .nav > li.active > a:hover, - .nav > li:first-child > a:hover { - padding: 11px 12px; - background: transparent; - border: none; - border-bottom: 1px solid @blue; - color: @white; - } - - .nav li.nav-header { - text-shadow: none; - } - - - - - &-fixed { - top: @navbarHeight; - margin: 0; - } -} - // NAV // ----------------------------------------------------- @@ -172,131 +107,13 @@ div.subnav { } } -.nav-pills { - - li > a:hover { - background-color: @blue; - color: @white; - } - - li.disabled > a { - color: @textColor; - } - - .open .dropdown-toggle { - background-color: #060606; - } - - .dropdown-menu li > a:hover { - border: none; - } -} - -.nav-list { - - li > a { - text-shadow: none; - } - - li > a:hover { - background-color: @blue; - color: @white; - } - - .nav-header { - text-shadow: none; - } - - .divider { - background-color: transparent; - border-bottom: 1px solid @grayDark; - } -} - -.nav-stacked { - - li > a { - border: 1px solid @grayDark !important; - } - - li > a:hover, - li.active > a { - background-color: @blue; - color: @white; - } -} - -.tabbable { - .nav-tabs, - .nav-tabs li.active > a { - border-color: @grayDark; - } -} - -.breadcrumb { - - background-color: transparent; - background-image: none; - border-width: 0; - .box-shadow(none); - font-size: 14px; - - li { - text-shadow: none; - } - - li > a { - color: @blue; - text-shadow: none; - } -} - -.pagination { - - ul { - .box-shadow(none); - } - - ul > li > a:hover, - ul > .active > a, - ul > .active > span { - // color: @white; - } - - ul > .disabled > a, - ul > .disabled > a:hover, - ul > .disabled > span, - ul > .disabled > span:hover { - background-color: rgba(0, 0, 0, 0.2); - } -} - -.pager { - - li > a, - li > span { - background-color: @bodyBackground; - border: none; - - &:hover { - background-color: @blue; - } - } - - .disabled a, - .disabled a:hover { - background-color: @bodyBackground; - } - -} - // BUTTONS // ----------------------------------------------------- + .btn { padding: 8px 12px; margin-right:10px; background-image: none; - // .box-shadow(0px 0px 8px @bodyBackground); border: none; .border-radius(0px); text-shadow: none; diff --git a/public/less/bootswatch.light.less b/public/less/bootswatch.light.less index f31eb4a0f56..b548d187941 100644 --- a/public/less/bootswatch.light.less +++ b/public/less/bootswatch.light.less @@ -87,64 +87,12 @@ a.text-success:hover { color: darken(@green, 10%); } .navbar-search .search-query { line-height: normal; } - - &-inverse { - - .brand, - .nav > li > a { - text-shadow: none; - } - - .brand:hover, - .nav > .active > a, - .nav > .active > a:hover, - .nav > .active > a:focus { - background-color: @navbarInverseLinkBackgroundHover; - .box-shadow(none); - color: @white; - } - - .navbar-search .search-query { - color: @grayDarker; - } - } -} - -div.subnav { - - margin: 0 1px; - background: @grayLight none; - .box-shadow(none); - border: none; - .border-radius(0); - - .nav { - background-color: transparent; - } - - .nav > li > a { - border-color: transparent; - } - - .nav > .active > a, - .nav > .active > a:hover { - border-color: transparent; - background-color: @black; - color: @white; - .box-shadow(none); - } - - &-fixed { - top: @navbarHeight + 1; - margin: 0; - } } // NAV // ----------------------------------------------------- .nav { - .open .dropdown-toggle, & > li.dropdown.open.active > a:hover { color: @blue; @@ -187,121 +135,6 @@ div.subnav { } } -.nav-pills { - - & > li > a { - //background-color: @grayLight; - .border-radius(0); - color: @black; - - &:hover { - background-color: @black; - color: @white; - } - } - - & > .disabled > a, - & > .disabled > a:hover { - background-color: @grayLighter; - color: @grayDark; - } -} - -.nav-list { - - & > li > a { - color: @grayDarker; - - &:hover { - background-color: @blue; - color: @white; - text-shadow: none; - } - } - - .nav-header { - color: @grayDarker; - } - - .divider { - background-color: @gray; - border-bottom: none; - } -} - -.pagination { - - ul { - - .box-shadow(none); - - & > li > a, - & > li > span { - margin-right: 6px; - color: @grayDarker; - - &:hover { - background-color: @grayDarker; - color: @white; - } - } - - & > li:last-child > a, - & > li:last-child > span { - margin-right: 0; - } - - & > .active > a, - & > .active > span { - color: @white; - } - - & > .disabled > span, - & > .disabled > a, - & > .disabled > a:hover { - background-color: @grayLighter; - color: @grayDark; - } - } -} - -.pager { - - li > a, - li > span { - background-color: @grayLight; - border: none; - .border-radius(0); - color: @grayDarker; - - &:hover { - background-color: @grayDarker; - color: @white; - } - } - - .disabled > a, - .disabled > a:hover, - .disabled > span { - background-color: @grayLighter; - color: @grayDark; - } - -} - -.breadcrumb { - background-color: @grayLight; - - li { - text-shadow: none; - } - - .divider, - .active { - color: @grayDarker; - text-shadow: none; - } -} // BUTTONS // ----------------------------------------------------- @@ -319,9 +152,6 @@ div.subnav { } } -.btn-inverse { -} - .btn-large { padding: 14px 23px; } diff --git a/public/less/grafana-responsive.less b/public/less/grafana-responsive.less index ee8b26ef751..0431bb3dcae 100644 --- a/public/less/grafana-responsive.less +++ b/public/less/grafana-responsive.less @@ -1,4 +1,5 @@ -@import "responsive.less"; +@import "variables.dark.less"; +@import "bootstrap/responsive.less"; @gridColumnWidth: 70px; @gridGutterWidth: 10px; @@ -68,7 +69,7 @@ display: none; } .page-container { - padding: 0 20px; + padding: 10px 20px; } } @@ -92,7 +93,6 @@ .dashnav-action-icons { display: none; } - .dashnav-back-to-dashboard { display: block; } diff --git a/public/less/bootstrap.dark.less b/public/less/grafana.dark.less similarity index 59% rename from public/less/bootstrap.dark.less rename to public/less/grafana.dark.less index 56fb2921371..96f24eeec02 100644 --- a/public/less/bootstrap.dark.less +++ b/public/less/grafana.dark.less @@ -1,5 +1,5 @@ -@import "bootstrap.less"; +@import "variables.dark.less"; +@import "bootstrap/bootstrap.less"; @import "bootswatch.dark.less"; @import "overrides.less"; -@import "variables.dark.less"; -@import "grafana.less"; \ No newline at end of file +@import "grafana.less"; diff --git a/public/less/bootstrap.light.less b/public/less/grafana.light.less similarity index 60% rename from public/less/bootstrap.light.less rename to public/less/grafana.light.less index 973ec849ef3..601e0cbf15a 100644 --- a/public/less/bootstrap.light.less +++ b/public/less/grafana.light.less @@ -1,5 +1,5 @@ -@import "bootstrap.less"; +@import "variables.light.less"; +@import "bootstrap/bootstrap.less"; @import "bootswatch.light.less"; @import "overrides.less"; -@import "variables.light.less"; -@import "grafana.less"; \ No newline at end of file +@import "grafana.less"; diff --git a/public/vendor/bootstrap/less/variables.less b/public/vendor/bootstrap/less/variables.less deleted file mode 100644 index 31c131b1e23..00000000000 --- a/public/vendor/bootstrap/less/variables.less +++ /dev/null @@ -1,301 +0,0 @@ -// -// Variables -// -------------------------------------------------- - - -// Global values -// -------------------------------------------------- - - -// Grays -// ------------------------- -@black: #000; -@grayDarker: #222; -@grayDark: #333; -@gray: #555; -@grayLight: #999; -@grayLighter: #eee; -@white: #fff; - - -// Accent colors -// ------------------------- -@blue: #049cdb; -@blueDark: #0064cd; -@green: #46a546; -@red: #9d261d; -@yellow: #ffc40d; -@orange: #f89406; -@pink: #c3325f; -@purple: #7a43b6; - - -// Scaffolding -// ------------------------- -@bodyBackground: @white; -@textColor: @grayDark; - - -// Links -// ------------------------- -@linkColor: #08c; -@linkColorHover: darken(@linkColor, 15%); - - -// Typography -// ------------------------- -@sansFontFamily: "Helvetica Neue", Helvetica, Arial, sans-serif; -@serifFontFamily: Georgia, "Times New Roman", Times, serif; -@monoFontFamily: Monaco, Menlo, Consolas, "Courier New", monospace; - -@baseFontSize: 14px; -@baseFontFamily: @sansFontFamily; -@baseLineHeight: 20px; -@altFontFamily: @serifFontFamily; - -@headingsFontFamily: inherit; // empty to use BS default, @baseFontFamily -@headingsFontWeight: bold; // instead of browser default, bold -@headingsColor: inherit; // empty to use BS default, @textColor - - -// Component sizing -// ------------------------- -// Based on 14px font-size and 20px line-height - -@fontSizeLarge: @baseFontSize * 1.25; // ~18px -@fontSizeSmall: @baseFontSize * 0.85; // ~12px -@fontSizeMini: @baseFontSize * 0.75; // ~11px - -@paddingLarge: 11px 19px; // 44px -@paddingSmall: 2px 10px; // 26px -@paddingMini: 0 6px; // 22px - -@baseBorderRadius: 4px; -@borderRadiusLarge: 6px; -@borderRadiusSmall: 3px; - - -// Tables -// ------------------------- -@tableBackground: transparent; // overall background-color -@tableBackgroundAccent: #f9f9f9; // for striping -@tableBackgroundHover: #f5f5f5; // for hover -@tableBorder: #ddd; // table and cell border - -// Buttons -// ------------------------- -@btnBackground: @white; -@btnBackgroundHighlight: darken(@white, 10%); -@btnBorder: #ccc; - -@btnPrimaryBackground: @linkColor; -@btnPrimaryBackgroundHighlight: spin(@btnPrimaryBackground, 20%); - -@btnInfoBackground: #5bc0de; -@btnInfoBackgroundHighlight: #2f96b4; - -@btnSuccessBackground: #62c462; -@btnSuccessBackgroundHighlight: #51a351; - -@btnWarningBackground: lighten(@orange, 15%); -@btnWarningBackgroundHighlight: @orange; - -@btnDangerBackground: #ee5f5b; -@btnDangerBackgroundHighlight: #bd362f; - -@btnInverseBackground: #444; -@btnInverseBackgroundHighlight: @grayDarker; - - -// Forms -// ------------------------- -@inputBackground: @white; -@inputBorder: #ccc; -@inputBorderRadius: @baseBorderRadius; -@inputDisabledBackground: @grayLighter; -@formActionsBackground: #f5f5f5; -@inputHeight: @baseLineHeight + 10px; // base line-height + 8px vertical padding + 2px top/bottom border - - -// Dropdowns -// ------------------------- -@dropdownBackground: @white; -@dropdownBorder: rgba(0,0,0,.2); -@dropdownDividerTop: #e5e5e5; -@dropdownDividerBottom: @white; - -@dropdownLinkColor: @grayDark; -@dropdownLinkColorHover: @white; -@dropdownLinkColorActive: @white; - -@dropdownLinkBackgroundActive: @linkColor; -@dropdownLinkBackgroundHover: @dropdownLinkBackgroundActive; - - - -// COMPONENT VARIABLES -// -------------------------------------------------- - - -// Z-index master list -// ------------------------- -// Used for a bird's eye view of components dependent on the z-axis -// Try to avoid customizing these :) -@zindexDropdown: 1000; -@zindexPopover: 1010; -@zindexTooltip: 1030; -@zindexFixedNavbar: 1030; -@zindexModalBackdrop: 1040; -@zindexModal: 1050; - - -// Sprite icons path -// ------------------------- -@iconSpritePath: "../img/glyphicons-halflings.png"; -@iconWhiteSpritePath: "../img/glyphicons-halflings-white.png"; - - -// Input placeholder text color -// ------------------------- -@placeholderText: @grayLight; - - -// Hr border color -// ------------------------- -@hrBorder: @grayLighter; - - -// Horizontal forms & lists -// ------------------------- -@horizontalComponentOffset: 180px; - - -// Wells -// ------------------------- -@wellBackground: #f5f5f5; - - -// Navbar -// ------------------------- -@navbarCollapseWidth: 979px; -@navbarCollapseDesktopWidth: @navbarCollapseWidth + 1; - -@navbarHeight: 40px; -@navbarBackgroundHighlight: #ffffff; -@navbarBackground: darken(@navbarBackgroundHighlight, 5%); -@navbarBorder: darken(@navbarBackground, 12%); - -@navbarText: #777; -@navbarLinkColor: #777; -@navbarLinkColorHover: @grayDark; -@navbarLinkColorActive: @gray; -@navbarLinkBackgroundHover: transparent; -@navbarLinkBackgroundActive: darken(@navbarBackground, 5%); - -@navbarBrandColor: @navbarLinkColor; - -// Inverted navbar -@navbarInverseBackground: #111111; -@navbarInverseBackgroundHighlight: #222222; -@navbarInverseBorder: #252525; - -@navbarInverseText: @grayLight; -@navbarInverseLinkColor: @grayLight; -@navbarInverseLinkColorHover: @white; -@navbarInverseLinkColorActive: @navbarInverseLinkColorHover; -@navbarInverseLinkBackgroundHover: transparent; -@navbarInverseLinkBackgroundActive: @navbarInverseBackground; - -@navbarInverseSearchBackground: lighten(@navbarInverseBackground, 25%); -@navbarInverseSearchBackgroundFocus: @white; -@navbarInverseSearchBorder: @navbarInverseBackground; -@navbarInverseSearchPlaceholderColor: #ccc; - -@navbarInverseBrandColor: @navbarInverseLinkColor; - - -// Pagination -// ------------------------- -@paginationBackground: #fff; -@paginationBorder: #ddd; -@paginationActiveBackground: #f5f5f5; - - -// Hero unit -// ------------------------- -@heroUnitBackground: @grayLighter; -@heroUnitHeadingColor: inherit; -@heroUnitLeadColor: inherit; - - -// Form states and alerts -// ------------------------- -@warningText: #c09853; -@warningBackground: #fcf8e3; -@warningBorder: darken(spin(@warningBackground, -10), 3%); - -@errorText: #b94a48; -@errorBackground: #f2dede; -@errorBorder: darken(spin(@errorBackground, -10), 3%); - -@successText: #468847; -@successBackground: #dff0d8; -@successBorder: darken(spin(@successBackground, -10), 5%); - -@infoText: #3a87ad; -@infoBackground: #d9edf7; -@infoBorder: darken(spin(@infoBackground, -10), 7%); - - -// Tooltips and popovers -// ------------------------- -@tooltipColor: #fff; -@tooltipBackground: #000; -@tooltipArrowWidth: 5px; -@tooltipArrowColor: @tooltipBackground; - -@popoverBackground: #fff; -@popoverArrowWidth: 10px; -@popoverArrowColor: #fff; -@popoverTitleBackground: darken(@popoverBackground, 3%); - -// Special enhancement for popovers -@popoverArrowOuterWidth: @popoverArrowWidth + 1; -@popoverArrowOuterColor: rgba(0,0,0,.25); - - - -// GRID -// -------------------------------------------------- - - -// Default 940px grid -// ------------------------- -@gridColumns: 12; -@gridColumnWidth: 60px; -@gridGutterWidth: 20px; -@gridRowWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1)); - -// 1200px min -@gridColumnWidth1200: 70px; -@gridGutterWidth1200: 30px; -@gridRowWidth1200: (@gridColumns * @gridColumnWidth1200) + (@gridGutterWidth1200 * (@gridColumns - 1)); - -// 768px-979px -@gridColumnWidth768: 42px; -@gridGutterWidth768: 20px; -@gridRowWidth768: (@gridColumns * @gridColumnWidth768) + (@gridGutterWidth768 * (@gridColumns - 1)); - - -// Fluid grid -// ------------------------- -@fluidGridColumnWidth: percentage(@gridColumnWidth/@gridRowWidth); -@fluidGridGutterWidth: percentage(@gridGutterWidth/@gridRowWidth); - -// 1200px min -@fluidGridColumnWidth1200: percentage(@gridColumnWidth1200/@gridRowWidth1200); -@fluidGridGutterWidth1200: percentage(@gridGutterWidth1200/@gridRowWidth1200); - -// 768px-979px -@fluidGridColumnWidth768: percentage(@gridColumnWidth768/@gridRowWidth768); -@fluidGridGutterWidth768: percentage(@gridGutterWidth768/@gridRowWidth768); diff --git a/tasks/options/less.js b/tasks/options/less.js index b0a893e9a37..17ef180e36c 100644 --- a/tasks/options/less.js +++ b/tasks/options/less.js @@ -3,12 +3,12 @@ module.exports = function(config) { return { src:{ options: { - paths: ["<%= srcDir %>/vendor/bootstrap/less", "<%= srcDir %>/less"], + paths: ["<%= srcDir %>/less"], yuicompress: true }, files: { - "<%= genDir %>/css/bootstrap.dark.min.css": "<%= srcDir %>/less/bootstrap.dark.less", - "<%= genDir %>/css/bootstrap.light.min.css": "<%= srcDir %>/less/bootstrap.light.less", + "<%= genDir %>/css/bootstrap.dark.min.css": "<%= srcDir %>/less/grafana.dark.less", + "<%= genDir %>/css/bootstrap.light.min.css": "<%= srcDir %>/less/grafana.light.less", "<%= genDir %>/css/bootstrap-responsive.min.css": "<%= srcDir %>/less/grafana-responsive.less" } }