hexabot/widget/src/components/Launcher.scss
2024-09-10 10:50:11 +01:00

69 lines
1.3 KiB
SCSS

.sc-launcher {
width: 60px;
height: 60px;
background-position: center;
background-repeat: no-repeat;
position: fixed;
right: 20px;
bottom: 20px;
border-radius: 50%;
box-shadow: none;
transition: box-shadow 0.2s ease-in-out;
cursor: pointer;
&:before {
content: "";
position: relative;
display: block;
width: 60px;
height: 60px;
border-radius: 50%;
transition: box-shadow 0.2s ease-in-out;
}
.sc-open-icon {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 32px;
height: 32px;
fill: #fff;
}
.sc-closed-icon {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 32px;
height: 32px;
fill: #fff;
}
.sc-new-messages-count {
position: absolute;
top: -3px;
left: 41px;
display: flex;
justify-content: center;
flex-direction: column;
border-radius: 50%;
width: 22px;
height: 22px;
background: #ff4646;
color: white;
text-align: center;
margin: auto;
font-size: 12px;
font-weight: 500;
}
}
.sc-launcher.opened:before {
box-shadow: 0px 0px 400px 250px rgba(148, 149, 150, 0.2);
}
.sc-launcher:hover {
box-shadow: 0 0px 27px 1.5px rgba(0, 0, 0, 0.2);
}