ux(less): refactoring and restructuring less files

public/less/bootswatch.dark.less

@@ -200,7 +200,6 @@ legend, label {
 // -----------------------------------------------------
 
 .table {
-
 	.border-radius(1px);
 
 	tbody tr.success td {

public/less/bootswatch.light.less

@@ -165,7 +165,6 @@ a.text-success:hover { color: darken(@green, 10%); }
 }
 
 .btn-group {
-
 	& > .btn:first-child,
 	& > .btn:last-child,
 	& > .dropdown-toggle {

public/less/dropdown.less

@@ -1,90 +0,0 @@
-// ==========================================================================
-// DROPDOWN
-//
-// dropdown.scss
-// ==========================================================================
-
-
-.select-input {
-  display: inline-block;
-  position: relative;
-  width: auto;
-  max-width: 100%;
-  margin: 0 5px;
-  padding: 0 12px 0 6px;
-  border: @grafanaPanelBorder;
-  background-color: @grafanaSelectBackground;
-  background-color: red;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-border-radius: 3px;
-  -moz-border-radius: 3px;
-  border-radius: 3px;
-}
-
-.select-input > select {
-  width: 115%;
-  min-width: 110%;
-  max-width: 115%;
-  height: 24px;
-  margin: 0;
-  padding: 0 20px 0 0;
-  border: 0;
-  outline: none;
-  background: transparent;
-  color: @linkColor;
-  font-size: 16px;
-  font-weight: 400;
-  line-height: 24px;
-  text-indent: .01px;
-  text-overflow: '';
-  -webkit-appearance: none;
-  -moz-appearance: menulist-text; // was set to "window" and caused odd display on windows and linux.
-  appearance: none;
-}
-
-// This hides native dropdown button arrow in IE
-.select-input > select::-ms-expand {
-  display: none;
-}
-
-.select-input:after {
-  position: absolute;
-  top: 50%;
-  right: 10px;
-  height: 12px;
-  margin-top: -6px;
-  padding: 0;
-  background-color: transparent;
-  color: @linkColor;
-  font: normal normal normal 14px/1 FontAwesome;
-  text-align: center;
-  content: '\f0d7';
-  pointer-events: none;
-}
-
-.select-input > select:focus {
-  outline: none;
-}
-
-// This hides focus around selected option in FF
-.select-input > select:-moz-focusring {
-  color: transparent;
-  text-shadow: 0 0 0 #adafae;
-}
-
-.rt-form .select-input {
-  margin: 0;
-  background: @grafanaSelectBackground;
-}
-
-.rt-form .select-interior {
-  margin: 0;
-  background-color: @inputBackground;
-  border: 1px solid @inputBorder;
-}
-
-.rt-form .select-input > select {
-  height: 34px;
-  line-height: 34px;
-}

public/less/grafana.less

@@ -1,35 +1,44 @@
-@import "type.less";
-@import "login.less";
-@import "submenu.less";
-@import "panel_graph.less";
-@import "panel_dashlist.less";
-@import "panel_singlestat.less";
-@import "panel_table.less";
-@import "bootstrap-tagsinput.less";
-@import "tables_lists.less";
-@import "search.less";
-@import "playlist.less";
-@import "panel.less";
-@import "forms.less";
-@import "tightform.less";
-@import "normform.less";
-@import "sidemenu.less";
-@import "navbar.less";
-@import "gfbox.less";
-@import "admin.less";
-@import "pagination.less";
-@import "validation.less";
-@import "gf-fonts.less";
-@import "tabs.less";
-@import "timepicker.less";
-@import "alerting.less";
-@import "apps.less";
-@import "filter-controls.less";
-@import "filter-list.less";
-@import "filter-table.less";
-@import "simple-box.less";
-@import "dropdown.less";
-@import "page.less";
+
+// BASE
+@import "./base/type.less";
+@import "./base/forms.less";
+@import "./base/fonts.less";
+
+// UTILS
+@import "./utils/validation.less";
+
+// LAYOUTS
+@import "./layout/page.less";
+
+// COMPONENTS
+@import "./components/panel_graph.less";
+@import "./components/submenu.less";
+@import "./components/panel_dashlist.less";
+@import "./components/panel_singlestat.less";
+@import "./components/panel_table.less";
+@import "./components/tagsinput.less";
+@import "./components/tables_lists.less";
+@import "./components/search.less";
+@import "./components/panel.less";
+@import "./components/tightform.less";
+@import "./components/gf-form.less";
+@import "./components/sidemenu.less";
+@import "./components/navbar.less";
+@import "./components/gfbox.less";
+@import "./components/pagination.less";
+@import "./components/tabs.less";
+@import "./components/timepicker.less";
+@import "./components/filter-controls.less";
+@import "./components/filter-list.less";
+@import "./components/filter-table.less";
+
+// PAGES
+@import "./pages/login.less";
+@import "./pages/playlist.less";
+@import "./pages/admin.less";
+@import "./pages/alerting.less";
+@import "./pages/apps.less";
+
 
 .row-control-inner {
   padding:0px;

public/less/simple-box.less

@@ -1,50 +0,0 @@
-
-@simpleBoxBorderWidth:  0.2rem;
-@simpleBoxMargin:  1.5rem;
-@simpleBoxBodyPadding:  1rem 0 0.5rem 1rem;
-
-.simple-box {
-  margin-top: @simpleBoxMargin;
-  background: @grafanaPanelBackground;
-}
-
-.simple-box-header {
-  font-weight: normal;
-  line-height: 2.5rem;
-  color: @textColor;
-  margin: 0;
-  padding-left: 1rem;
-  // border-bottom: @simpleBoxBorderWidth solid @bodyBackground;
-}
-
-.simple-box-column {
-  flex-direction: row;
-  width: 25%;
-  border-right: @simpleBoxBorderWidth solid @bodyBackground;
-  ul {
-    margin: 0.7rem 0 1rem 1.2rem;
-  }
-}
-
-.simple-box-column:last-child {
-  border: none;
-}
-
-.simple-box-column-header {
-  font-size: @fontSizeLarge;
-  i {
-    padding-right: 0.3rem;
-  }
-}
-
-.simple-box-body {
-  padding: @simpleBoxBodyPadding;
-}
-
-.flex-container {
-  display: flex;
-}
-
-.flex-column {
-  flex-direction: row;
-}