tyler.durden/icingaweb2
1
0
Fork 0
mirror of https://github.com/Icinga/icingaweb2.git synced 2025-07-26 23:34:08 +02:00
Code Issues Packages Projects Releases Wiki Activity

css: Simplify collapsible control styles and layout

Browse Source 
The button is now floated right instead of absolutely positioned.
Also, the hover effect is just a different background now, not a
ridiculous overlay with transparency.

Both changes help to avoid a horizontal scroll-bar in Chrome
and Icinga DB Web views.
This commit is contained in:
Johannes Meyer 2020-05-20 12:01:40 +02:00
parent c2f380cf9b
commit c9f5c65828
1 changed files with 10 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
public/css/icinga/main.less
View File

@ -245,34 +245,27 @@ a:hover > .icon-cancel {
.collapsible-control { .collapsible-control {
position: relative; position: relative;
z-index: 1;
button { button {
.rounded-corners(50%); .rounded-corners(50%);
background: @gray-lighter; float: right;
color: @gray;
width: 2em; width: 2em;
height: 2em; height: 2em;
z-index: 1;
position: absolute;
border: none;
padding: 0; padding: 0;
bottom: -1em; margin-top: -1em;
right: .25em; margin-right: .25em;
background: @gray-lighter;
color: @gray;
border: none;
-webkit-box-shadow: 0 0 1/3em rgba(0,0,0,.3); -webkit-box-shadow: 0 0 1/3em rgba(0,0,0,.3);
-moz-box-shadow: 0 0 1/3em rgba(0,0,0,.3); -moz-box-shadow: 0 0 1/3em rgba(0,0,0,.3);
box-shadow: 0 0 1/3em rgba(0,0,0,.3); box-shadow: 0 0 1/3em rgba(0,0,0,.3);
&:hover:before { &:hover {
content: ""; background: @gray-light;
display: block;
position: absolute;
top: -1/6em;
right: -1/6em;
bottom: -1/6em;
left: -1/6em;
background: fade(@text-color, 10);
.rounded-corners(50%);
} }
} }