Jingga/cssOMS
1
0
Fork 0
mirror of https://github.com/Karaka-Management/cssOMS.git synced 2026-01-18 06:08:40 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge branch 'develop' of https://github.com/Orange-Management/cssOMS into develop

Browse Source
This commit is contained in:
Dennis Eichhorn 2020-06-26 20:14:30 +02:00
commit bfc4f74018
3 changed files with 103 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
portlet.scss
View File

@ -3,7 +3,7 @@
border-radius: 4px;
box-sizing: border-box;
margin-top: 1rem;
overflow-x: auto;
//overflow-x: auto; removed in order to prevent scroll bars for tooltips which are longer than the portlet (test in general settings view)
border-top: 3px solid var(--box-highlight);
.portlet-head {
@ -33,4 +33,40 @@
.portlet-body {
background: #fff;
padding: 1rem;
}
.portlet.highlight-1 {
border-top: 0;
.portlet-body {
background: var(--color-red);
color: #fff;
}
}
.portlet.highlight-2 {
border-top: 0;
.portlet-body {
background: var(--color-green);
color: #fff;
}
}
.portlet.highlight-3 {
border-top: 0;
.portlet-body {
background: var(--color-blue);
color: #fff;
}
}
.portlet.highlight-4 {
border-top: 0;
.portlet-body {
background: var(--color-yellow);
color: #fff;
}
}

71
styles.css
View File

@ -3297,32 +3297,26 @@ p {
p + p {
margin-top: 5px; }
.tooltip > i {
font-size: 0.85rem;
position: relative;
z-index: 2;
cursor: pointer; }
.tooltip > i:before, .tooltip > i:after {
visibility: hidden;
opacity: 0;
pointer-events: none; }
.tooltip > i:before {
white-space: nowrap;
position: absolute;
bottom: 150%;
margin-bottom: 5px;
padding: 7px;
border-radius: 3px;
background-color: #000;
background-color: rgba(51, 51, 51, 0.9);
color: #fff;
content: attr(data-tooltip);
text-align: center; }
.tooltip:hover > i:before,
.tooltip:hover > i:after {
visibility: visible;
opacity: 1; }
.tooltip {
cursor: pointer;
color: var(--box-highlight);
font-size: .9rem; }
.tooltip:hover, .tooltip:active, .tooltip:focus {
position: relative; }
.tooltip:hover:after, .tooltip:hover:before, .tooltip:active:after, .tooltip:active:before, .tooltip:focus:after, .tooltip:focus:before {
font-size: .9rem;
display: block;
position: absolute;
white-space: nowrap;
bottom: 100%;
margin-bottom: 5px;
padding: 7px;
border-radius: 3px;
background-color: #474747;
color: #fff;
content: attr(data-tooltip);
text-align: center;
transform: translate(-50%, 0); }
.spinner-1 {
width: 40px;
@ -4600,7 +4594,6 @@ span.tag {
border-radius: 4px;
box-sizing: border-box;
margin-top: 1rem;
overflow-x: auto;
border-top: 3px solid var(--box-highlight); }
.portlet .portlet-head {
background: #fff;
@ -4624,3 +4617,27 @@ span.tag {
.portlet-body {
background: #fff;
padding: 1rem; }
.portlet.highlight-1 {
border-top: 0; }
.portlet.highlight-1 .portlet-body {
background: var(--color-red);
color: #fff; }
.portlet.highlight-2 {
border-top: 0; }
.portlet.highlight-2 .portlet-body {
background: var(--color-green);
color: #fff; }
.portlet.highlight-3 {
border-top: 0; }
.portlet.highlight-3 .portlet-body {
background: var(--color-blue);
color: #fff; }
.portlet.highlight-4 {
border-top: 0; }
.portlet.highlight-4 .portlet-body {
background: var(--color-yellow);
color: #fff; }

53
tooltip.scss
View File

@ -1,35 +1,26 @@
.tooltip > i {
font-size: 0.85rem;
position: relative;
z-index: 2;
.tooltip {
cursor: pointer;
color: var(--box-highlight);
font-size: .9rem;
&:before,
&:after {
visibility: hidden;
opacity: 0;
pointer-events: none;
&:hover, &:active, &:focus {
position: relative;
&:after, &:before {
font-size: .9rem;
display: block;
position: absolute;
white-space: nowrap;
bottom: 100%;
margin-bottom: 5px;
padding: 7px;
border-radius: 3px;
background-color: rgb(71, 71, 71);
color: #fff;
content: attr(data-tooltip);
text-align: center;
transform: translate(-50%, 0);
}
}
&:before {
white-space: nowrap;
position: absolute;
bottom: 150%;
margin-bottom: 5px;
padding: 7px;
border-radius: 3px;
background-color: #000;
background-color: hsla(0, 0%, 20%, 0.9);
color: #fff;
content: attr(data-tooltip);
text-align: center;
}
}
.tooltip:hover > i:before,
.tooltip:hover > i:after {
visibility: visible;
opacity: 1;
}