diff --git a/app/assets/font/adagios-fontawesome.eot b/app/assets/font/adagios-fontawesome.eot new file mode 100644 index 0000000..5f5e7bd Binary files /dev/null and b/app/assets/font/adagios-fontawesome.eot differ diff --git a/app/assets/font/adagios-fontawesome.svg b/app/assets/font/adagios-fontawesome.svg new file mode 100644 index 0000000..d13bcac --- /dev/null +++ b/app/assets/font/adagios-fontawesome.svg @@ -0,0 +1,40 @@ + + + +Copyright (C) 2015 by original authors @ fontello.com + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/app/assets/font/adagios-fontawesome.ttf b/app/assets/font/adagios-fontawesome.ttf new file mode 100644 index 0000000..487dd0d Binary files /dev/null and b/app/assets/font/adagios-fontawesome.ttf differ diff --git a/app/assets/font/adagios-fontawesome.woff b/app/assets/font/adagios-fontawesome.woff new file mode 100644 index 0000000..5b23de2 Binary files /dev/null and b/app/assets/font/adagios-fontawesome.woff differ diff --git a/app/assets/images/barre-notif.svg b/app/assets/images/barre-notif.svg new file mode 100755 index 0000000..4423874 --- /dev/null +++ b/app/assets/images/barre-notif.svg @@ -0,0 +1,8 @@ + + + + + diff --git a/app/assets/images/croix_close.svg b/app/assets/images/croix_close.svg new file mode 100755 index 0000000..c8f1e4e --- /dev/null +++ b/app/assets/images/croix_close.svg @@ -0,0 +1,11 @@ + + + + + + + + + diff --git a/app/assets/images/error.svg b/app/assets/images/error.svg new file mode 100755 index 0000000..75857f5 --- /dev/null +++ b/app/assets/images/error.svg @@ -0,0 +1,12 @@ + + + + + + + + + diff --git a/app/assets/images/ok.svg b/app/assets/images/ok.svg new file mode 100755 index 0000000..e2dd859 --- /dev/null +++ b/app/assets/images/ok.svg @@ -0,0 +1,11 @@ + + + + + diff --git a/app/assets/images/profil.svg b/app/assets/images/profil.svg new file mode 100644 index 0000000..0c0657e --- /dev/null +++ b/app/assets/images/profil.svg @@ -0,0 +1,59 @@ + + + + + diff --git a/app/assets/images/warning.svg b/app/assets/images/warning.svg new file mode 100755 index 0000000..2ae68a4 --- /dev/null +++ b/app/assets/images/warning.svg @@ -0,0 +1,12 @@ + + + + + + + + + diff --git a/app/assets/js/scripts.js b/app/assets/js/scripts.js index 1c66fef..0495988 100644 --- a/app/assets/js/scripts.js +++ b/app/assets/js/scripts.js @@ -3,13 +3,13 @@ var SFLfront = (function() { // States for UI modifications var state = { - visible: 'js-is--visible', - hidden: 'js-is--hidden', - current: 'js-is--current', - open: 'js-is--open', - fadeIn: 'js-is--fadein', - fadeOut: 'js-is--fadeout', - hasChild: 'js-is--haschild' + visible: 'state--visible', + hidden: 'state--hidden', + current: 'state--current', + open: 'state--open', + fadeIn: 'state--fadein', + fadeOut: 'state--fadeout', + hasChild: 'state--haschild' }; // Breakpoints for the responsive web design diff --git a/app/assets/sass/app.scss b/app/assets/sass/app.scss index 90c89d2..8049dbe 100644 --- a/app/assets/sass/app.scss +++ b/app/assets/sass/app.scss @@ -1,15 +1,3 @@ -//----------------------------------*\ -// FONTAWESOME -//----------------------------------*/ - -// Rewrite Some Fontawesome Variables -//----------------------------------*/ -$fa-font-path: '../../bower_components/fontawesome/fonts' !default; - -// Then Import Fontawesome -//----------------------------------*/ -@import '../../bower_components/fontawesome/scss/font-awesome.scss'; - //----------------------------------*\ // BOOTSTRAP MODULES //----------------------------------*/ @@ -39,9 +27,11 @@ $fa-font-path: '../../bower_components/fontawesome/fonts' !default; // GLOBAL MODULES //----------------------------------*/ @import 'global/default'; +@import 'global/color-schemes'; +@import 'global/typography'; +@import 'global/iconography'; @import 'global/helpers'; @import 'global/layout'; -@import 'global/color-schemes'; @import 'global/print'; //----------------------------------*\ @@ -53,45 +43,13 @@ $fa-font-path: '../../bower_components/fontawesome/fonts' !default; // OBJECT MODULES //----------------------------------*/ @import 'modules-objects/togglable-tabs'; +@import 'modules-objects/problems'; +@import 'modules-objects/panes'; //----------------------------------*\ // INTERFACE MODULES //----------------------------------*/ -@import '../../components/topbar/topbar'; -@import '../../components/sidebar/sidebar'; -@import '../../components/tactical/tactical'; - -/* body:before { */ -/* display:none; */ -/* content: ''; */ -/* } */ - - -/* .menu { */ -/* list-style: none; */ -/* border-bottom: 0.1em solid black; */ -/* margin-bottom: 2em; */ -/* padding: 0 0 0.5em; */ -/* } */ - -/* .menu:before { */ -/* content: "["; */ -/* } */ - -/* .menu:after { */ -/* content: "]"; */ -/* } */ - -/* .menu > li { */ -/* display: inline; */ -/* } */ - -/* .menu > li:before { */ -/* content: "|"; */ -/* padding-right: 0.3em; */ -/* } */ - -/* .menu > li:nth-child(1):before { */ -/* content: ""; */ -/* padding: 0; */ -/* } */ +@import 'modules-interface/main'; +@import '../../topbar/topbar'; +@import '../../sidebar/sidebar'; +@import '../../tactical/tactical'; diff --git a/app/assets/sass/global/_color-schemes.scss b/app/assets/sass/global/_color-schemes.scss index 7a5e42b..1571916 100644 --- a/app/assets/sass/global/_color-schemes.scss +++ b/app/assets/sass/global/_color-schemes.scss @@ -5,29 +5,46 @@ // Light Scheme //----------------------------------*/ .color-scheme--light { - - %colorLink { - color:$_color_light_epsilon; - - &:hover {color:orange;} - } - - %colorBorderThin {border-color:$_color_light_gamma;} - - %colorBkgTopbarPanel {background:$_color_light_gamma;} + // Light scheme is not ready for now. } // Dark Scheme //----------------------------------*/ -.color-scheme--dark { - - %colorLink { - color:$_color_dark_epsilon; - - &:hover {color:white;} +.color-scheme--dark { + %colorTxtCurrent { + color:$_color_dark_delta; } - %colorBorderThin {border-color:$_color_dark_gamma;} + %colorHightContrast { + color:$_color_omega; + } - %colorBkgTopbarPanel {background:$_color_dark_gamma;} + // For panel and the sidebar + %colorBkgPanel { + background:$_color_dark_alpha; + } + + %colorLink { + color:$_color_dark_delta; + + &:hover { + color:white; + } + } + + %colorBorderThin { + border-color:$_color_dark_alpha; + } + + %colorBkgTopbar { + background:$_color_dark_beta; + } + + %colorBkgTopbarPanel { + background:$_color_dark_alpha; + } + + %colorBkgTopbarButton { + background:$_color_dark_beta; + } } diff --git a/app/assets/sass/global/_default.scss b/app/assets/sass/global/_default.scss index 7a58c35..155f882 100644 --- a/app/assets/sass/global/_default.scss +++ b/app/assets/sass/global/_default.scss @@ -20,22 +20,13 @@ text-shadow:none; } -html, -button, -input, -select, -textarea {/* color:$_color_text; */} - html, body { - &.color-scheme--dark {background:$_color_dark_alpha;} - height:100%; min-height:100%; } html { - //@include line-height($_base_font_size, $_base_line_height); font-size:em($_base_font_size); font-family:$_font_family_alpha; -ms-text-size-adjust:100%; @@ -43,6 +34,16 @@ html { } body { + &.color-scheme--dark { + background:$_color_dark_gamma; + color:$_color_dark_delta; + } + + &.color-scheme--light { + background:$_color_light_gamma; + color:$_color_light_delta; + } + font-size:inherit; line-height:inherit; margin:0; @@ -74,22 +75,20 @@ audio:not([controls]) { [hidden], template {display:none;} -a {background:transparent;} +a { + @extend %colorLink; + background:transparent; +} a:focus {outline:thin dotted;} a:active, a:hover {outline:0;} -h1 { - font-size:2em; - margin:0.67em 0; -} - abbr[title] {border-bottom:1px dotted;} b, -strong {font-weight:bold;} +strong {font-weight:700;} dfn {font-style:italic;} @@ -116,7 +115,7 @@ pre {white-space:pre-wrap;} q {quotes:"\201C" "\201D" "\2018" "\2019";} -small {font-size:80%;} +small {font-size:em(10, $_base_font_size);} sub, sup { @@ -151,6 +150,7 @@ button, input, select, textarea { + @extend %colorTxtCurrent; font-family:inherit; font-size:100%; margin:0; @@ -205,10 +205,22 @@ table { border-spacing:0; } +td, +th {text-align:left;} + +thead { + th {padding:0 0 $_space_narrow;} +} + +tbody { + td, + th {padding:$_space_narrow 0;} +} + menu, nav { a {text-decoration:none;} - + ol, ul { list-style-type:none; diff --git a/app/assets/sass/global/_helpers.scss b/app/assets/sass/global/_helpers.scss index 94e13b5..066ea2a 100644 --- a/app/assets/sass/global/_helpers.scss +++ b/app/assets/sass/global/_helpers.scss @@ -110,11 +110,14 @@ body:after { } //----------------------------------*\ -// JAVASCRIPT CLASSES +// STATES CLASSES //----------------------------------*/ - -.js-is--hidden {display:none;} -.js-is--visible {display:block;} -//.js-is--current {} -//.js-is--open {} -//.js-is--close {} +.state--hidden {display:none;} +.state--visible {display:block;} +/* .state--current {} */ +/* .state--open {} */ +/* .state--close {} */ +/* .state--error {} */ +/* .state--warning {} */ +/* .state--ok {} */ +/* etc. */ diff --git a/app/assets/sass/global/_iconography.scss b/app/assets/sass/global/_iconography.scss new file mode 100644 index 0000000..cc5f7ca --- /dev/null +++ b/app/assets/sass/global/_iconography.scss @@ -0,0 +1,94 @@ +//----------------------------------*\ +// ICONOGRAPHY +//----------------------------------*/ +@font-face { + font-family: 'adagios-fontawesome'; + src: url('../font/adagios-fontawesome.eot?35310261'); + src: url('../font/adagios-fontawesome.eot?35310261#iefix') format('embedded-opentype'), + url('../font/adagios-fontawesome.svg?35310261#adagios-fontawesome') format('svg'); + font-weight: normal; + font-style: normal; +} +@font-face { + font-family: 'adagios-fontawesome'; + src: url('data:application/octet-stream;base64,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') format('woff'), + url('data:application/octet-stream;base64,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') format('truetype'); +} +/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */ +/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */ +/* +@media screen and (-webkit-min-device-pixel-ratio:0) { + @font-face { + font-family: 'adagios-fontawesome'; + src: url('../font/adagios-fontawesome.svg?35310261#adagios-fontawesome') format('svg'); + } +} +*/ + + [class^="ico-"]:before, [class*=" ico-"]:before { + font-family: "adagios-fontawesome"; + font-style: normal; + font-weight: normal; + speak: none; + + display: inline-block; + text-decoration: inherit; + width: 1em; + margin-right: .2em; + text-align: center; + /* opacity: .8; */ + + /* For safety - reset parent styles, that can break glyph codes*/ + font-variant: normal; + text-transform: none; + + /* fix buttons height, for twitter bootstrap */ + line-height: 1em; + + /* Animation center compensation - margins should be symmetric */ + /* remove if not needed */ + margin-left: .2em; + + /* you can be more comfortable with increased icons size */ + /* font-size: 120%; */ + + /* Uncomment for 3D effect */ + /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */ +} +.ico-profil:before { content: '\e800'; } /* '' */ +.ico-cog:before { content: '\e801'; } /* '' */ +.ico-search:before { content: '\e802'; } /* '' */ +.ico-clock:before { content: '\e803'; } /* '' */ +.ico-minus:before { content: '\e804'; } /* '' */ +.ico-plus:before { content: '\e805'; } /* '' */ +.ico-up-dir:before { content: '\e806'; } /* '' */ +.ico-left-dir:before { content: '\e807'; } /* '' */ +.ico-right-dir:before { content: '\e808'; } /* '' */ +.ico-down-dir:before { content: '\e809'; } /* '' */ +.ico-bell-alt:before { content: '\e80a'; } /* '' */ +.ico-arrows-cw:before { content: '\e80b'; } /* '' */ +.ico-thumbs-up:before { content: '\e80c'; } /* '' */ +.ico-attention:before { content: '\e80d'; } /* '' */ +.ico-menu:before { content: '\e80e'; } /* '' */ +.ico-sliders:before { content: '\e80f'; } /* '' */ +.ico-down-open:before { content: '\e810'; } /* '' */ +.ico-left-open:before { content: '\e811'; } /* '' */ +.ico-right-open:before { content: '\e812'; } /* '' */ +.ico-up-open:before { content: '\e813'; } /* '' */ +.ico-angle-left:before { content: '\e814'; } /* '' */ +.ico-angle-right:before { content: '\e815'; } /* '' */ +.ico-angle-up:before { content: '\e816'; } /* '' */ +.ico-angle-down:before { content: '\e817'; } /* '' */ +.ico-cancel:before { content: '\e818'; } /* '' */ +.ico-barre-notif:before { content: '\e81a'; } /* '' */ +.ico-ok:before { content: '\e81b'; } /* '' */ +.ico-error:before { content: '\e81c'; } /* '' */ +.ico-warning:before { content: '\e81d'; } /* '' */ + +//----------------------------------*/ +%ico { + font-family:"adagios-fontawesome"; + font-style:normal; + font-weight:normal; + speak:none; +} \ No newline at end of file diff --git a/app/assets/sass/global/_layout.scss b/app/assets/sass/global/_layout.scss index 32e143e..bd0bc3b 100644 --- a/app/assets/sass/global/_layout.scss +++ b/app/assets/sass/global/_layout.scss @@ -5,80 +5,46 @@ display:table; min-height:100%; width:100%; - - .flexbox & { - display:flex; - min-height:100vh; - flex-direction:column; - } } .layout__container { - //background:yellow; display:table-row; min-height:100%; - - .flexbox & { - display:block; /* IE fix */ - display:flex; - flex:1; - flex-direction:row; - } } .layout__main { display:table-cell; - //min-width:320px; vertical-align:top; width:100%; - - .flexbox & { - display:block; /* IE fix */ - flex:1; - } } .layout__aside { - //background:red; display:table-cell; min-height:100%; min-width:320px; vertical-align:top; width:320px; - .flexbox & { - display:block; - } - @include large-xlarge-screen { min-width:250px; width:250px; } - /* */ + &.collapse { display:none; visibility:hidden; &.in { - display:block; + display:table-cell; visibility:visible; } } } -.layout__row { - /* background:black; */ - margin-bottom:1em; -} +.layout__full {width:100%;} -.layout__flexrow { - /* background:yellow; */ +.layout__half {width:50%;} - /* > :nth-child(even) {background-color:aquamarine;} */ - /* > :nth-child(odd) {background-color:pink;} */ +.layout__third {width:33.333333333%;} - .flexbox & { - display:flex; - flex-direction:row; - } -} +.layout__quarter {width:25%;} diff --git a/app/assets/sass/global/_typography.scss b/app/assets/sass/global/_typography.scss new file mode 100644 index 0000000..bc252a5 --- /dev/null +++ b/app/assets/sass/global/_typography.scss @@ -0,0 +1,48 @@ +//----------------------------------*\ +// TYPOGRAPHY +//----------------------------------*/ +%typo-logo-title { + font:400 em(26, $_base_font_size)(/ 1) $_font_family_alpha; + text-transform:uppercase; + // Tracking 300 PSD = Combien en letterspacing CSS ? +} + +%typo-title {font:400 em(24, $_base_font_size)(/ 1) $_font_family_alpha;} + +%typo-subtitle {font:700 em(14, $_base_font_size)(/ 1) $_font_family_alpha;} + +%typo-header-table { + font:400 em(14, $_base_font_size)(/ 1) $_font_family_alpha; + text-transform:uppercase; +} + +%typo-current-text {font:400 em(14, $_base_font_size)(/ 1) $_font_family_alpha;} + +%typo-more-info {font:italic 400 em(14, $_base_font_size)(/ 1) $_font_family_alpha;} + +%typo-more-info--little {font:400 em(12, $_base_font_size)(/ 1) $_font_family_alpha;} + +%typo-menu {font:400 em(14, $_base_font_size)(/ 1) $_font_family_alpha;} + +/* h1, h2, h3, h4, h5, h6 {margin:0;} */ + +h1, +.like-h1 {@extend %typo-logo-title;} + +h2, +.like-h2 { + @extend %typo-title; + margin:0; +} + +/* h3, */ +/* .like-h3 {} */ + +/* h4, */ +/* .like-h4 {} */ + +/* h5, */ +/* .like-h5 {} */ + +/* h6, */ +/* .like-h6 {} */ \ No newline at end of file diff --git a/app/assets/sass/modules-interface/_main.scss b/app/assets/sass/modules-interface/_main.scss new file mode 100644 index 0000000..7c93208 --- /dev/null +++ b/app/assets/sass/modules-interface/_main.scss @@ -0,0 +1,98 @@ +//----------------------------------*\ +// MAIN BLOCK INTERFACE +//----------------------------------*/ + +.main[role="main"] {} + +.main__overview { + padding:$_space $_space_narrow $_space_narrow; + position:relative; + + @include large-xlarge-screen { + padding:$_space; + } + + .color-scheme--dark & { + background:$_color_dark_beta; + } + + .color-scheme--light & { + background:$_color_light_beta; + } + + table {width:100%;} + + td, + th { + text-align:right; + + .color-scheme--dark & { + color:$_color_omega; + } + + .color-scheme--light & { + color:$_color_alpha; + } + + &:first-child {text-align:left;} + + &.state--error {color:$_color_error;} + &.state--warning {color:$_color_warning;} + &.state--ok {color:$_color_ok;} + } + + thead th { + @extend %typo-subtitle; + + &:first-child { + .color-scheme--dark & { + color:$_color_dark_alpha; + } + + .color-scheme--light & { + color:$_color_light_alpha; + } + } + } + + tbody { + td, + th { + border-top-style:solid; + border-top-width:1px; + + .color-scheme--dark & { + border-top-color:$_color_dark_beta; + } + + .color-scheme--light & { + border-top-color:$_color_light_beta; + } + } + + tr:first-child { + td, + th {border-top:0;} + } + + th {@extend %typo-header-table;} + } +} + +.main__overview__title { + margin-bottom:$_space_narrow; + + @include large-xlarge-screen { + margin-bottom:$_space; + } + + .color-scheme--dark & { + color:$_color_omega; + } + + .color-scheme--light & { + color:$_color_alpha; + } +} + +.main__content {} diff --git a/app/assets/sass/modules-objects/_panes.scss b/app/assets/sass/modules-objects/_panes.scss new file mode 100644 index 0000000..a499b67 --- /dev/null +++ b/app/assets/sass/modules-objects/_panes.scss @@ -0,0 +1,39 @@ +.panes { + background:aquamarine; + display:table; + width:100%; + + .color-scheme--dark & { + background:$_color_dark_gamma; + } + + .color-scheme--light & { + background:$_color_light_gamma; + } +} + +.panes__pane { + //background:blue; + border-style:solid; + border-width:0 0 0 1px; + display:table-cell; + padding:$_space_narrow; + + &:first-child {border-left:0;} + + @include large-xlarge-screen { + padding:$_space; + } + + .color-scheme--dark & { + border-color:$_color_dark_beta; + } + + .color-scheme--light & { + border-color:$_color_light_beta; + } + + .panes--2 & {width:50%;} + + .panes--3 & {width:33.333333333%;} +} diff --git a/app/assets/sass/modules-objects/_problems.scss b/app/assets/sass/modules-objects/_problems.scss new file mode 100644 index 0000000..a5112eb --- /dev/null +++ b/app/assets/sass/modules-objects/_problems.scss @@ -0,0 +1,179 @@ +//----------------------------------*\ +// PROBLEMS LIST AND TABLE +//----------------------------------*/ +.problems__list { + margin-bottom:$_space; + + .state--error, + .state--warning, + .state--ok { + position:relative; + + &:before { + top:0; + font-family:"adagios-fontawesome"; + left:0; + position:absolute; + z-index:988888; + } + + } + + .state--error { + @extend .ico-error; + + &:before { + color:$_color_error; + font-size:em(13, $_base_font_size); + } + } + + .state--warning { + @extend .ico-warning; + + &:before { + color:$_color_warning; + font-size:em(16, $_base_font_size); + } + } + + .state--ok { + @extend .ico-ok; + + &:before { + color:$_color_ok; + font-size:em(20, $_base_font_size); + } + } +} + +.problems__item { + border-top:1px solid; + padding-top:$_space_narrow; + + .color-scheme--dark & { + border-color:$_color_dark_gamma; + } + + .color-scheme--light & { + border-color:$_color_light_gamma; + } + + &:first-child { + border-top:0; + padding-top:0; + } +} + +.problems__host, +.problems__name, +.problems__description {padding-left:25px;} + +.problems__host, +.problems__name { + font-weight:normal; + + .color-scheme--dark & { + color:$_color_omega; + } + + .color-scheme--light & { + color:$_color_alpha; + } +} + +.problems__name, +.problems__description {margin-left:25px;} + +.problems__host, +.problems__description {margin-bottom:$_space_narrow;} + +.problems__host {display:block;} + +.problems__desclist { + position:relative; + + &:before { + background:$_color_dark_gamma; + content:""; + display:block; + height:calc(100% - 2.143em); + left:8px; + position:absolute; + top:0; + width:1px; + } +} + +.problems__name { + &:after { + background:transparent; + border:1px solid; + border-radius:0 0 0 5px; + content:""; + display:block; + height:24px; + left:-17px; + position:absolute; + top:-18px; + width:20px; + + .color-scheme--dark & { + border-color:transparent transparent $_color_dark_gamma $_color_dark_gamma; + } + + .color-scheme--light & { + border-color:transparent transparent $_color_light_gamma $_color_light_gamma; + } + } + + span { + display:inline-block; + overflow:hidden; + text-overflow:ellipsis; + white-space:nowrap; + } + + .problems__duration { + display:none; + float:right; + + @include medium-and-up-screen { + display:inline-block; + } + + .color-scheme--dark & { + color:$_color_dark_delta; + } + + .color-scheme--light & { + color:$_color_light_delta; + } + } +} + +.problems__description { + @extend %typo-more-info--little; + overflow:hidden; + text-overflow:ellipsis; + white-space:nowrap; +} + +.problems__viewall { + @extend %button-reset; + @extend %typo-more-info; + display:block; + padding:$_space_narrow; + text-align:center; + width:100%; + + .color-scheme--dark & { + background:$_color_dark_gamma; + color:$_color_omega; + } + + .color-scheme--light & { + background:$_color_light_gamma; + color:$_color_alpha; + } +} \ No newline at end of file diff --git a/app/assets/sass/modules-objects/_togglable-tabs.scss b/app/assets/sass/modules-objects/_togglable-tabs.scss index 61fd929..ec9d167 100644 --- a/app/assets/sass/modules-objects/_togglable-tabs.scss +++ b/app/assets/sass/modules-objects/_togglable-tabs.scss @@ -1,20 +1,48 @@ //----------------------------------*\ // TOGGLABLE TABS //----------------------------------*/ -/* */ -.tabpanel { - .tablist__item { - display:inline-block; +.tablist__list { + display:block; +} + +.tablist__item { + display:block; + float:left; + width:50%; +} + +.tabpanel__tab { + border:solid white; + border-width:0 0 1px; + display:block; + line-height:1; + margin:0 4px; + padding:0 $_space .5em 0; + position:relative; + + &[aria-expanded="true"] { + border-width:0 0 3px; + color:$_color_omega; } - - .tabpanel__tab { - color:white; - border-bottom:5px solid white; - width:50%; + + :first-child > & { + margin-left:0; + } + + &:after { + bottom:em($_base_font_size); + content:attr(data-problems); + display:inline-block; + font-size:em(10, $_base_font_size); + position:absolute; + right:0; } } .tab-content { + clear:both; + padding:$_space 0 $_space_narrow; + > .tab-pane { display:none; visibility:hidden; diff --git a/app/assets/sass/settings/_variables.scss b/app/assets/sass/settings/_variables.scss index 1efe104..8da4c7b 100644 --- a/app/assets/sass/settings/_variables.scss +++ b/app/assets/sass/settings/_variables.scss @@ -1,37 +1,37 @@ //----------------------------------*\ -// VARIABLES +// DEFAULT VARIABLES //----------------------------------*/ // Image Path //----------------------------------*/ $_img_path: "../images/" !default; -// Color Schemes +// Colors //----------------------------------*/ // Light scheme $_color_light_alpha: '' !default; $_color_light_beta: '' !default; $_color_light_gamma: '' !default; -$_color_light_delta: '' !default; -$_color_light_epsilon: red !default; +$_color_light_delta: red !default; // Dark scheme -$_color_dark_alpha: #353D48 !default; -$_color_dark_beta: #49515C !default; -$_color_dark_gamma: #23282E !default; -$_color_dark_delta: #2e353d !default; -$_color_dark_epsilon: #aeb5bf !default; +$_color_dark_alpha: #252C35 !default; +$_color_dark_beta: #353D48 !default; +$_color_dark_gamma: #49515C !default; +$_color_dark_delta: #A2AAB4 !default; -// Typography -$_base_font_size: 14 !default; -$_base_line_height: 18 !default; +// Black and White +$_color_alpha: #000 !default; +$_color_omega: #FFF !default; + +// Colors for states +$_color_error: #E84C3D !default; +$_color_warning: #F9A13B !default; +$_color_ok: #81A854 !default; // Fonts Family //----------------------------------*/ -$_font_family_alpha: sans-serif !default; -$_font_family_beta: sans-serif !default; -$_font_family_gamma: serif !default; - +$_font_family_alpha: 'Roboto', sans-serif !default; // fonts.googleapis.com/css?family=Roboto // Media Queries Breakpoints //----------------------------------*/ @@ -40,3 +40,13 @@ $_screen_small: 480 !default; $_screen_medium: 768 !default; $_screen_large: 992 !default; $_screen_xlarge: 1200 !default; + +// Typography +//----------------------------------*/ +$_base_font_size: 14 !default; +$_base_line_height: 18 !default; + +// X Y Rhythm +//----------------------------------*/ +$_space:30px !default; +$_space_narrow:15px !default; diff --git a/app/components/sidebar/_sidebar.scss b/app/components/sidebar/_sidebar.scss index 38c4827..c7e103a 100644 --- a/app/components/sidebar/_sidebar.scss +++ b/app/components/sidebar/_sidebar.scss @@ -1,148 +1,244 @@ +//----------------------------------*\ +// SIDEBAR +//----------------------------------*/ .sidebar-wrapper { - //.color-scheme--dark & {background:$_color_dark_delta;} + @extend %colorBkgPanel; + padding-bottom:em(72+$_space, $_base_font_size); + position:relative; } -.nav-side-menu { - //overflow: auto; - font-family: verdana; - font-size: 12px; - font-weight: 200; - //position: fixed; - //top: 0px; - //height: 100%; - color: #e1ffff; +//.sidebar {} + +.sidebar__close { + @extend %button-reset; + display:block; + font-size:em(15, $_base_font_size); + height:45px; + margin:0 auto; + text-align:center; + width:45px; + + @include large-xlarge-screen { + display:none; + } + + .color-scheme--dark & { + background:$_color_dark_beta; + color:$_color_omega; + } + + .color-scheme--light & { + background:$_color_light_beta; + color:$_color_alpha; + } + + .no-js & {display:none;} } -.nav-side-menu .brand { - background-color: #23282e; - line-height: 50px; - display: block; - text-align: center; - font-size: 14px; +.sidebar__header { + text-align:center; + + padding:$_space $_space_narrow; + + + @include large-xlarge-screen { + padding:$_space $_space; + } } -.nav-side-menu .toggle-btn { - display: none; + +.sidebar__appname { + @extend %colorHightContrast; + margin:0; } -.nav-side-menu ul, -.nav-side-menu li { - list-style: none; - padding: 0px; - margin: 0px; - line-height: 35px; - cursor: pointer; - /* - .collapsed{ - .arrow:before{ - font-family: FontAwesome; - content: "\f053"; - display: inline-block; - padding-left:10px; - padding-right: 10px; - vertical-align: middle; - float:right; + +.sidebar__date { + @extend %typo-more-info--little; + display:block; + margin-top:$_space_narrow; + + .color-scheme--dark & { + color:$_color_dark_gamma; + } + + .color-scheme--light & { + color:$_color_light_gamma; + } +} + +.sidebar__nav {} + +.sidebar__item { + border-top:1px solid; + margin-bottom:$_space; + + .color-scheme--dark & { + border-top-color:$_color_dark_gamma; + } + + .color-scheme--light & { + border-top-color:$_color_light_gamma; + } + + &:first-child {border:0;} +} + +.sidebar__category { + @extend %typo-title; + display:block; + position:relative; + padding:$_space $_space_narrow 0 $_space; + + @include large-xlarge-screen { + padding:$_space $_space 0; + } + + .js & { + cursor:pointer; + } + + .color-scheme--dark & { + color:$_color_dark_gamma; + } + + .color-scheme--light & { + color:$_color_light_gamma; + } + + .sidebar__item:first-child & {padding-top:0;} + + &:after { + @extend %ico; + content:"\e801"; + display:inline-block; + font-size:1em; + position:absolute; + right:$_space_narrow; + + @include large-xlarge-screen { + right:$_space; + } + } +} + +.sidebar__sublist { + padding:0 $_space_narrow 0 $_space; + + @include large-xlarge-screen { + padding:0 $_space; + } +} + +.sidebar__subitem { + @extend %typo-menu; + margin-top:$_space; + + .state--current { + color:$_color_omega; + position:relative; + + &:before { + @extend %ico; + content:"\e812"; + display:inline-block; + font-size:em(8, $_base_font_size); + left:-$_space_narrow; + margin-top:-0.5em; + position:absolute; + top:50%; + } + } +} + +.sidebar__profile { + bottom:0; + left:0; + padding:0 $_space_narrow 0 $_space; + position:absolute; + right:0; + + @include large-xlarge-screen { + padding:0 $_space; + } + + .color-scheme--dark & { + background:$_color_dark_beta; + } + + .color-scheme--light & { + background:$_color_light_beta; + } + + .sidebar__profile__toggle { + @extend %typo-more-info--little; + color:$_color_omega; + display:block; + line-height:72px; + min-height:72px; + padding-left:(36+15) + px; + position:relative; + text-decoration:none; + + &:after { + @extend %ico; + content:"\e809"; + display:inline-block; + position:absolute; + right:0; + + .color-scheme--dark & { + color:$_color_omega; } - } -*/ -} -.nav-side-menu ul :not(collapsed) .arrow:before, -.nav-side-menu li :not(collapsed) .arrow:before { - font-family: FontAwesome; - content: "\f078"; - display: inline-block; - padding-left: 10px; - padding-right: 10px; - vertical-align: middle; - float: right; -} -.nav-side-menu ul .active, -.nav-side-menu li .active { - border-left: 3px solid #d19b3d; - background-color: #4f5b69; -} -.nav-side-menu ul .sub-menu li.active, -.nav-side-menu li .sub-menu li.active { - color: #d19b3d; -} -.nav-side-menu ul .sub-menu li.active a, -.nav-side-menu li .sub-menu li.active a { - color: #d19b3d; -} -.nav-side-menu ul .sub-menu li, -.nav-side-menu li .sub-menu li { - background-color: #181c20; - border: none; - line-height: 28px; - border-bottom: 1px solid #23282e; - margin-left: 0px; -} -.nav-side-menu ul .sub-menu li:hover, -.nav-side-menu li .sub-menu li:hover { - background-color: #020203; -} -.nav-side-menu ul .sub-menu li:before, -.nav-side-menu li .sub-menu li:before { - font-family: FontAwesome; - content: "\f105"; - display: inline-block; - padding-left: 10px; - padding-right: 10px; - vertical-align: middle; -} -.nav-side-menu li { - padding-left: 0px; - border-left: 3px solid #2e353d; - border-bottom: 1px solid #23282e; -} -.nav-side-menu li a { - text-decoration: none; - color: #e1ffff; -} -.nav-side-menu li a i { - padding-left: 10px; - width: 20px; - padding-right: 20px; -} -.nav-side-menu li:hover { - border-left: 3px solid #d19b3d; - background-color: #4f5b69; - -webkit-transition: all 1s ease; - -moz-transition: all 1s ease; - -o-transition: all 1s ease; - -ms-transition: all 1s ease; - transition: all 1s ease; -} -@media (max-width: 767px) { - .nav-side-menu { - position: relative; - width: 100%; - margin-bottom: 10px; - } - .nav-side-menu .toggle-btn { - display: block; - cursor: pointer; - position: absolute; - right: 10px; - top: 10px; - z-index: 10 !important; - padding: 3px; - background-color: #ffffff; - color: #000; - width: 40px; - text-align: center; - } - .brand { - text-align: left !important; - font-size: 22px; - padding-left: 20px; - line-height: 50px !important; - } -} -@media (min-width: 767px) { - .nav-side-menu .menu-list .menu-content { - display: block; - } -} -body { - margin: 0px; - padding: 0px; -} + + .color-scheme--light & { + background:$_color_alpha; + } + } + } + + .sidebar__profile__name { + display:inline-block; + line-height:em(18, 12); + vertical-align:middle; + + &:before, + &:after { + display:block; + position:absolute; + } + + &:before { + border-radius:100%; + content:""; + height:36px; + left:0; + top:18px; + width:36px; + + .color-scheme--dark & { + background:$_color_dark_gamma; + } + + .color-scheme--light & { + background:$_color_light_gamma; + } + } + + &:after { + @extend %ico; + content:"\e800"; + font-size:em(24, $_base_font_size); + left:7px; + position:absolute; + top:28px; + + .color-scheme--dark & { + color:$_color_dark_alpha; + } + + .color-scheme--light & { + color:$_color_light_alpha; + } + } + + } +} \ No newline at end of file diff --git a/app/components/sidebar/sidebar.html b/app/components/sidebar/sidebar.html index 6baebbb..eeadb5a 100644 --- a/app/components/sidebar/sidebar.html +++ b/app/components/sidebar/sidebar.html @@ -1,56 +1,59 @@ -
-
ADAGIOS
-
- -
diff --git a/app/components/tactical/_tactical.scss b/app/components/tactical/_tactical.scss index 9317f34..824d16d 100644 --- a/app/components/tactical/_tactical.scss +++ b/app/components/tactical/_tactical.scss @@ -1,10 +1,8 @@ -#tactical { - background-color: #353d48; - color: white; - padding: 20px; - -} - -#tactical #summary { - background-color: #49515c; -} +//----------------------------------*\ +// TACTICAL +//----------------------------------*/ +.current-health { + tbody { + td, th {padding-top:0;} + } +} \ No newline at end of file diff --git a/app/components/tactical/current_health/current_health.html b/app/components/tactical/current_health/current_health.html index 433dfcb..9512778 100644 --- a/app/components/tactical/current_health/current_health.html +++ b/app/components/tactical/current_health/current_health.html @@ -1,17 +1,18 @@ -
- - - - - - -
- Current Health -
-
- -
-
- -
-
+ + + + + + + + + + + + + +
Current health 
+ + + +
diff --git a/app/components/tactical/status_overview/status_overview.html b/app/components/tactical/status_overview/status_overview.html index 11a7f2a..a213944 100644 --- a/app/components/tactical/status_overview/status_overview.html +++ b/app/components/tactical/status_overview/status_overview.html @@ -1,39 +1,24 @@ - +
+ + - - - - - + + + - - - + + +
Status overview# - Status overview - - # - - + Notifications number +
- HOSTS - - {{ hosts.count }} - - {{ hosts.problems }} - Hosts{{ hosts.count }}{{ hosts.problems }}
- SERVICES - - {{ services.count }} - - {{ services.problems }} - Services{{ services.count }}{{ services.problems }}
diff --git a/app/components/tactical/tactical.html b/app/components/tactical/tactical.html index 0bf9a08..98abcf6 100644 --- a/app/components/tactical/tactical.html +++ b/app/components/tactical/tactical.html @@ -1,21 +1,24 @@ -
+
+
+

Tactical Overview

-

Tactical Overview

- -
- -
-
- -
-
- -
-
- -
+
+
+
-
+
+ +
-
+
+ +
+
+
+ + +
+ +
+
diff --git a/app/components/tactical/top_alert_producers/top_alert_producers.html b/app/components/tactical/top_alert_producers/top_alert_producers.html index ba7125a..84fb3f8 100644 --- a/app/components/tactical/top_alert_producers/top_alert_producers.html +++ b/app/components/tactical/top_alert_producers/top_alert_producers.html @@ -1,22 +1,14 @@ - - + + - - + +
- Top Alert Producers - - - Top alert producers
- {{ host.host_name }} - - {{ host.problems }} - {{ host.host_name }}{{ host.problems }}
diff --git a/app/components/topbar/_topbar.scss b/app/components/topbar/_topbar.scss index 1d2c31e..b14bbd9 100644 --- a/app/components/topbar/_topbar.scss +++ b/app/components/topbar/_topbar.scss @@ -1,180 +1,221 @@ +//----------------------------------*\ +// TOPBAR MODULE +//----------------------------------*/ .topbar-wrapper { - border-bottom:1px solid; + @extend %colorBkgTopbar; @extend %colorBorderThin; + border-bottom:1px solid; } -.topbar { - a {@extend %colorLink;} +.topbar a {@extend %colorLink;} - &.layout__flexrow { - .flexbox & {} - } -} - -.topbar__list { - display:block; - - .flexbox .layout__flexrow & { - flex:1; - } - - &.topbar__list--left {text-align:left;} - &.topbar__list--right {text-align:right;} -} +.topbar__list {display:block;} .topbar__item { @extend %colorBorderThin; - border-right:1px solid; + border:0 solid; display:inline-block; - float:left; position:relative; - .topbar__list--right &.topbar__search { - border-left:1px solid; - @extend %colorBorderThin; + .topbar__list--left & { + border-right-width:1px; + float:left; } - - .topbar__button { - @extend %button-reset; - @extend %colorLink; - padding:32px; + .topbar__list--right & { + border-left-width:1px; + float:right; } %topbar__panel { - @extend %colorBkgTopbarPanel; - max-width:485px; - min-width:320px; + @extend %colorBkgPanel; + width:320px; position:absolute; - top:100%; + top:100%; + z-index:999999; } .topbar__panel--fromleft { @extend %topbar__panel; - left:-1px; + left:-81px; + + @include medium-and-up-screen { + left:-1px; + width:485px; + } } .topbar__panel--fromright { @extend %topbar__panel; - right:-1px; + right:0; + + @include medium-and-up-screen { + width:190px; + } + } + + .topbar__panel__content {padding:$_space $_space_narrow 0;} +} + +.topbar__button { + @extend %button-reset; + @extend %colorBkgTopbarButton; + @extend %colorLink; + height:80px; + position:relative; + width:79px; + + &[aria-expanded="true"] {color:$_color_omega;} + + [class^="ico-"], + [class*=" ico-"] { + bottom:30px; + display:block; + font-size:em(20, $_base_font_size); + height:1em; + left:0; + line-height:1em; + margin:0 auto; + position:absolute; + right:0; + text-align:center; + top:auto; + width:1em; + + &:before {margin:0;} } } .topbar__toggle-sidebar { .topbar__button { - position:relative; + &[aria-expanded="true"], + &:hover { + .color-scheme--dark & { + background:$_color_dark_alpha; + } + + .color-scheme--light & { + background:$_color_light_alpha; + } + } + } + + .ico-menu { &:after { - //bottom:0; + @extend %ico; + bottom:0; display:inline-block; - font:normal 10px FontAwesome; + font-size:10px; margin:auto 0; position:absolute; - //top:0; + top:0; } + } - &[aria-expanded="false"]:after { - content:'\f0da'; - left:auto; - right:8px; - } + [aria-expanded="false"] .ico-menu:after { + content:'\e808'; + right:-7px; + } - &[aria-expanded="true"]:after { - content:'\f0d9'; - left:8px; - right:auto; - } + [aria-expanded="true"] .ico-menu:after { + content:'\e807'; + left:-7px; } } .topbar__notifications { .topbar__button { - position:relative; + &[aria-expanded="true"], + &:hover { + .color-scheme--dark & { + background:$_color_dark_alpha; + } + .color-scheme--light & { + background:$_color_light_alpha; + } + } + } + + .ico-bell-alt { &:after { - background:red; + background:$_color_error; border-radius:100%; - color:white; + color:$_color_omega; content:attr(data-notifications); font-size:10px; + font-style:normal; height:18px; + left:7px; line-height:18px; position:absolute; - right:5px; text-align:center; - top:5px; + top:-9px; width:18px; } } } +.topbar__search { + .topbar__button {float:left;} -.topbar__search #searchfield { - display:none; + .topbar__searchfield { + background:transparent; + border:0; + display:none; + float:right; + font-size:1em; + height:14px; + margin:36px $_space 0 0; + vertical-align:baseline; - @include medium-and-up-screen { - display:inline-block; - margin-right:15px; + @include large-xlarge-screen { + display:inline-block; + } } } -/* #topbar { */ -/* border-radius: 0px; */ -/* border: none; */ -/* height: 82px; */ -/* min-height: 82px; */ -/* margin-bottom: 0px; */ -/* } */ +.topbar__settings { + .topbar__button { + &[aria-expanded="true"], + &:hover { + .color-scheme--dark & { + background:$_color_dark_alpha; + } -/* #topbar .container-fluid{ */ -/* padding-left: 0px; */ -/* } */ + .color-scheme--light & { + background:$_color_light_alpha; + } + } + } -/* #topbar .topbar-brand{ padding: 0px 30px;font-size: 1.5em;line-height: 80px; } */ -/* #topbar .topbar-nav > li > a { padding: 0px 30px; line-height: 80px; font-size: 1.5em; } */ -/* #topbar .topbar-nav > li > form div { */ -/* line-height: 55px; */ -/* font-size: 1.5em; */ -/* } */ -/* #topbar .topbar-nav > li > form input { */ -/* height: 60px; */ -/* } */ + .ico-sliders:before { + @include vendor(transform, rotate(90deg)); + } +} +.topbar__settings__category { + @extend %typo-title; + display:block; + margin-bottom:$_space; -/* #topbar div.topbar-collapse { */ -/* padding-left: 0px; */ -/* } */ + .color-scheme--dark & { + color:$_color_dark_gamma; + } -/* #search input { */ -/* border: none; */ -/* background-color: #353d48; */ -/* font-size: 1.5em; */ -/* color: #aeb5bf; */ -/* width: 400px; */ -/* } */ + .color-scheme--light & { + color:$_color_light_gamma; + } +} +.topbar__settings__item, +.topbar__settings__subitem {display:block;} -/* a#toggle-sidebar .fa-chevron-left { */ -/* font-size: 0.5em; */ -/* vertical-align: super; */ -/* } */ +.topbar__settings__subitem { + @extend %typo-menu; + margin-bottom:$_space; - -/* #search i, */ -/* #settings i, */ -/* #notifications i, */ -/* #toggle-sidebar i { */ -/* font-size: 1.5em; */ -/* } */ - - -/* #topbar li { */ -/* border-color: #252b37; */ -/* border-style: solid; */ -/* border-width: 1px; */ -/* } */ - -/* #topbar li #search { */ -/* float: left; */ -/* } */ + a {display:block;} +} \ No newline at end of file diff --git a/app/components/topbar/topbar.html b/app/components/topbar/topbar.html index 9bdbbb2..3305b80 100644 --- a/app/components/topbar/topbar.html +++ b/app/components/topbar/topbar.html @@ -1,4 +1,4 @@ -