openuds/server/templates/admin/app/css/main.scss
Adolfo Gómez García d1f4ce0884 * Added new images
* Fixes on Dashboard (advanced new sidevar disposition)
* Added Proxy element to DB (needs to finish this)
2017-01-20 04:58:05 +01:00

429 lines
8.0 KiB
SCSS

// Bootstrap
$icon-font-path: "../fonts/";
@import "_tools";
@import "_udsvars";
// Own variables
$sidebar-icon-width: 24px;
$sidebar-icon-width-collapsed: 24px;
$sidebar-size: 225px; // 225 px
$sidebar-size-collapsed: $sidebar-icon-width-collapsed + 2*$font-size-base; // 40px;
$sidebar-top: 50px;
$sidebar-switcher-size: 14px;
$sizebar-switcher-font-size: $sidebar-switcher-size - 2px;
$sidebar-switcher-pos: $sidebar-size - $sidebar-switcher-size;
$sidebar-switcher-pos-collapsed: $sidebar-size-collapsed - $sidebar-switcher-size;
$uds-panel-min-height: 500px;
// bower:scss
@import "bower_components/bootstrap-sass/assets/stylesheets/_bootstrap.scss";
// endbower
@font-face {
font-family: 'Droid Sans Mono';
font-style: normal;
font-weight: 400;
src: local('Droid Sans Mono'), local('DroidSansMono'), url(#{$icon-font-path}/DroidSansMono.woff2) format('woff2');
}
// Fix for firefox for fieldsets
@-moz-document url-prefix() {
fieldset {
display: table-cell;
}
}
body {
font-family: 'Droid Sans Mono', sans-serif;
background-color: $body-bg;
margin-top: 50px;
}
#wrapper {
padding-left: 0;
}
#page-wrapper {
width: 100%;
padding: 5px 15px;
}
/* collapsable && closeable pannels */
.chevron {
&:before {
content: "\f139";
}
&.collapsed:before {
content: "\f13a";
}
}
.widget-icon.fa-refresh {
&:hover {
animation: 2s linear 0s normal none infinite running fa-spin;
}
}
.panel-icon {
margin-left: 0.6em !important;
cursor: pointer;
}
.table-icon {
width: 1.2em;
padding-bottom: 3px;
}
.info-img {
width: 5em;
}
.navbar-img {
width: 2em;
margin-top: -8px;
}
.side-nav > .navbar-nav > li > a {
padding-bottom: $font-size-base/2;
padding-top: $font-size-base/2;
}
.cursor-pointer {
cursor: pointer !important;
}
#minimized {
margin-top: 0.6em;
margin-bottom: 0.3em;
}
/* modal dialogs & related*/
.modal-dialog {
/* new custom width */
width: 90%;
}
/*.modal-backdrop {
background-color: gray;
}*/
.modal {
overflow-y: auto;
}
.tab-pane {
margin-top: 24px;
}
.tooltip {
z-index: 2014;
}
/* Tables */
/* Logs */
.chart-big {
display: block;
height: 400px;
}
.chart-medium {
display: block;
height: 250px;
}
.chart-small {
display: block;
height: 100px;
}
/* End tables styling */
/* Charts */
.chart-content {
width: 100%;
height: 100%;
}
// Hides switcher on small devices, so menu displays correctly
.side-nav {
padding-top: 0px;
.switcher {
visibility: hidden;
width: 0px;
height: 0px;
}
.icon {
width: 24px;
vertical-align: center;
padding-bottom: 3px;
}
}
/* Edit Below to Customize Widths > 768px */
@media (min-width: 768px) {
/* Wrappers */
#wrapper {
padding-left: $sidebar-size;
-webkit-transition: padding 0.3s; /* For Safari 3.1 to 6.0 */
transition: padding 0.3s;
&.full {
padding-left: $sidebar-size-collapsed;
}
}
#page-wrapper {
padding: 15px 25px;
}
/* Side Nav */
.side-nav {
position: fixed;
top: 0px;
margin-top: $sidebar-top;
height: 100%;
overflow-y: auto;
border-radius: 0;
border-color: $navbar-default-border;
border-style: solid;
border-width: 0 1px 0 0;
background-color: $navbar-default-bg;
-webkit-transition: width 0.3s; /* For Safari 3.1 to 6.0 */
transition: width 0.3s;
margin-left: -$sidebar-size-collapsed;
padding-top: $sidebar-switcher-size;
left: $sidebar-size-collapsed;
width: $sidebar-size-collapsed;
.icon {
width: $sidebar-icon-width-collapsed;
-webkit-transition: all 0.3s; /* For Safari 3.1 to 6.0 */
transition: all 0.3s;
}
.menu-lnk {
display: none;
overflow-x: hidden;
}
> ul {
// border-top: 1px solid $navbar-default-border;
> li {
width: $sidebar-size;
overflow-x: hidden;
// border-bottom: 1px solid $navbar-default-border;
&:hover, &.active, &:focus {
color: $brand-primary;
background-color: darken($navbar-default-bg, 15%);
}
&.dropdown > ul.dropdown-menu {
width: $sidebar-size;
position: relative;
margin: 0;
padding: 0;
border: none;
border-radius: 0;
background-color: transparent;
box-shadow: none;
-webkit-box-shadow: none;
> li > a {
color: inherit;
padding: $font-size-base/2 $font-size-base/2 $font-size-base/2 32px;
&:hover, &.active, &:focus {
color: #fff;
background-color: #080808;
}
}
}
}
}
&.full {
margin-left: -$sidebar-size;
left: $sidebar-size;
width: $sidebar-size;
.icon {
width: $sidebar-icon-width;
}
.menu-lnk {
display: inline;
opacity: 1.0;
width: 100%;
}
> ul > li {
// border-bottom: none;
//border-bottom: none;
}
}
/*&:hover {
width: $sidebar-size;
}
> li {
&.dropdown > ul.dropdown-menu {
position: relative;
min-width: $sidebar-size;
margin: 0;
padding: 0;
border: none;
border-radius: 0;
background-color: transparent;
box-shadow: none;
-webkit-box-shadow: none;
> li > a {
color: #999999;
padding: 15px 15px 15px 15px;
&:hover, &.active, &:focus {
color: #fff;
background-color: #080808;
}
}
}
> a {
border-bottom: 1px solid darken($body-bg, 50%);
color: $text-color;
display: block;
font-size: 10px;
min-height: 60px;
padding-top: 12px;
text-align: center;
width: $sidebar-size-collapsed;
> img {
min-width: 32px;
}
}
//> a {
// width: $sidebar-size;
//}
}*/
}
/* Bootstrap Default Overrides - Customized Dropdowns for the Side Nav */
/*.navbar-inverse .navbar-nav > li > a {
&:hover, &:focus {
background-color: #080808;
}
}*/
.modal-dialog {
/* new custom width */
width: 60%;
}
}
// closeable
.closeable {
&:hover {
cursor: pointer;
color: red;
}
}
// Tag add
.tagadder {
&:hover {
cursor: pointer;
}
}
span.tag {
float: left;
margin-bottom: 4px;
margin-right: 4px;
padding-bottom: 4px;
}
/* submenus */
.dropdown-submenu {
position: relative;
>.dropdown-menu {
top: 0;
left: 100%;
margin-top: -6px;
margin-left: -1px;
-webkit-border-radius: 0 6px 6px 6px;
-moz-border-radius: 0 6px 6px 6px;
border-radius: 0 6px 6px 6px;
}
&:hover {
>.dropdown-menu {
display: block;
}
>a {
&:after {
border-left-color: #ffffff;
}
}
}
>a {
&:after {
display: block;
content: " ";
float: right;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
border-width: 5px 0 5px 5px;
border-left-color: #cccccc;
margin-top: 5px;
margin-right: -10px;
}
}
}
.dropdown-submenu.pull-left {
float: none;
>.dropdown-menu {
left: -100%;
margin-left: 10px;
-webkit-border-radius: 6px 0 6px 6px;
-moz-border-radius: 6px 0 6px 6px;
border-radius: 6px 0 6px 6px;
}
}
li.selected {
background-color: #5094CE;
}
/* theme */
@import "_theme";
@import "_widgets";
@import "_buttons";
@import "_data-tables";
@import "_tables";