forked from extern/the-glorious-startpage
54 lines
916 B
CSS
54 lines
916 B
CSS
|
/*Web buttons*/
|
||
|
|
||
|
.buttonContainer {
|
||
|
width: 36px;
|
||
|
height: 36px;
|
||
|
position: relative;
|
||
|
background: var(--base-container);
|
||
|
border-radius: var(--rounded-radius);
|
||
|
margin: 2px;
|
||
|
padding: 5px;
|
||
|
border: none;
|
||
|
cursor: pointer;
|
||
|
transition: transform .2s;
|
||
|
}
|
||
|
|
||
|
.buttonContainer div {
|
||
|
background-size: cover;
|
||
|
width: 36px;
|
||
|
height: 36px;
|
||
|
border: none;
|
||
|
|
||
|
position:absolute;
|
||
|
left:0; right:0;
|
||
|
top:0; bottom:0;
|
||
|
margin:auto;
|
||
|
|
||
|
max-width:100%;
|
||
|
max-height:100%;
|
||
|
overflow:auto;
|
||
|
}
|
||
|
|
||
|
.buttonContainer:hover {
|
||
|
background: var(--base-hover-bg);
|
||
|
|
||
|
-ms-transform: scale(1.25);
|
||
|
-webkit-transform: scale(1.25);
|
||
|
transform: scale(1.25);
|
||
|
}
|
||
|
|
||
|
.buttonContainer:active {
|
||
|
background: var(--base-active-bg);
|
||
|
|
||
|
-ms-transform: scale(1);
|
||
|
-webkit-transform: scale(1);
|
||
|
transform: scale(1);
|
||
|
}
|
||
|
|
||
|
#buttonImage0 {
|
||
|
background-image: url("../assets/buttons/launch.svg");
|
||
|
}
|
||
|
|
||
|
#buttonImage9 {
|
||
|
background-image: url("../assets/buttons/menu.svg");
|
||
|
}
|