mirror of
https://github.com/Combodo/iTop.git
synced 2026-02-25 21:34:12 +01:00
150 lines
3.4 KiB
SCSS
150 lines
3.4 KiB
SCSS
/*
|
|
* @copyright Copyright (C) 2010-2023 Combodo SARL
|
|
* @license http://opensource.org/licenses/AGPL-3.0
|
|
*/
|
|
|
|
/* SCSS variables */
|
|
$ibo-dashboard--grid--width: 100% !default;
|
|
$ibo-dashboard--grid--elements-spacing-x: $ibo-dashlet--elements-spacing-x !default;
|
|
$ibo-dashboard--grid--elements-spacing-y: $ibo-dashlet--elements-spacing-y !default;
|
|
$ibo-dashboard--top-bar-padding-bottom: 20px !default;
|
|
|
|
/* Rules */
|
|
.ibo-dashboard--top-bar {
|
|
@extend %ibo-full-height-content;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
padding-bottom: $ibo-dashboard--top-bar-padding-bottom;
|
|
|
|
.ibo-dashboard--top-bar-title {
|
|
@extend %ibo-font-ral-bol-250;
|
|
}
|
|
|
|
.ibo-dashboard--top-bar-toolbar {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
}
|
|
|
|
.ibo-dashboard--selector {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-left: 12px;
|
|
margin-right: 1px;
|
|
|
|
&:hover {
|
|
background-color: $ibo-color-secondary-100;
|
|
border-radius: $ibo-button--border-radius;
|
|
}
|
|
|
|
.selector-label {
|
|
display: inline-block;
|
|
margin-left: 10px;
|
|
margin-right: 10px;
|
|
vertical-align: super;
|
|
}
|
|
}
|
|
|
|
.ibo-dashboard--grid {
|
|
width: $ibo-dashboard--grid--width;
|
|
}
|
|
|
|
.ibo-dashboard--grid-row {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
overflow: hidden; /* Because of the column negative margin (which is for the dashlets spacing) */
|
|
|
|
/* Compensate negative margin on inner borders to simulate egal dashlets spacing between rows */
|
|
&:not(:last-child) {
|
|
padding-bottom: calc(#{$ibo-dashboard--grid--elements-spacing-y} / 2);
|
|
}
|
|
|
|
&:not(:first-child) {
|
|
padding-top: calc(#{$ibo-dashboard--grid--elements-spacing-y} / 2);
|
|
}
|
|
}
|
|
|
|
.ibo-dashboard--grid-column {
|
|
display: flex;
|
|
flex-flow: row wrap;
|
|
align-items: flex-start;
|
|
align-content: flex-start;
|
|
width: calc(100% + (2 * #{$ibo-dashboard--grid--elements-spacing-x}));
|
|
margin: calc(-1 * #{$ibo-dashboard--grid--elements-spacing-y} / 2) calc(-1 * #{$ibo-dashboard--grid--elements-spacing-x} / 2); /* Because of the margin all around the dashlets, we need to compensate it */
|
|
min-width: 0;
|
|
|
|
/* Compensate negative margin on inner borders to simulate egal dashlets spacing between columns */
|
|
&:not(:last-child) {
|
|
margin-right: 0;
|
|
}
|
|
|
|
&:not(:first-child) {
|
|
margin-left: 0;
|
|
}
|
|
|
|
&.edit_mode {
|
|
margin: 1px;
|
|
border: 2px #ccc dashed;
|
|
width: 100%;
|
|
min-height: 40px;
|
|
}
|
|
}
|
|
|
|
|
|
// Round Toggle
|
|
/* The switch - the box around the slider */
|
|
.ibo-dashboard--switch {
|
|
position: relative;
|
|
display: inline-block;
|
|
width: 30px;
|
|
height: 24px;
|
|
vertical-align: baseline;
|
|
}
|
|
|
|
/* Hide default HTML checkbox */
|
|
.ibo-dashboard--switch input {
|
|
display: none;
|
|
}
|
|
|
|
/* The slider */
|
|
.ibo-dashboard--slider {
|
|
position: absolute;
|
|
cursor: pointer;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
}
|
|
|
|
.ibo-dashboard--slider:before {
|
|
position: absolute;
|
|
right: 5px;
|
|
bottom: 3px;
|
|
color: $ibo-color-secondary-800;
|
|
content: "\f007";
|
|
font-family: "Font Awesome 5 Free", serif;
|
|
font-size: $ibo-font-size-50;
|
|
font-weight: 900;
|
|
}
|
|
|
|
.ibo-dashboard--slider:after {
|
|
position: absolute;
|
|
left: 6px;
|
|
bottom: 1px;
|
|
color: $ibo-color-primary-600;
|
|
content: "\f1ad";
|
|
font-family: "Font Awesome 5 Free", serif;
|
|
font-size: $ibo-font-size-150;
|
|
font-weight: 900;
|
|
}
|
|
|
|
input:checked + .ibo-dashboard--slider:before {
|
|
content: "\f1ad";
|
|
}
|
|
|
|
input:checked + .ibo-dashboard--slider:after {
|
|
content: "\f007";
|
|
}
|