overleaf/services/web/frontend/stylesheets/components/input-switch.less
ilkin-overleaf 8bc374c916 Merge pull request #21115 from overleaf/ii-bs5-review-panel
[web] BS5 review panel new

GitOrigin-RevId: c65d17d0053858bd74984ba746a620b89d900606
2024-10-21 08:04:37 +00:00

56 lines
1 KiB
Text

.input-switch {
display: inline-block;
padding-left: 5px;
}
.input-switch-hidden-input {
display: none;
+ .input-switch-btn {
display: block;
width: 34px;
height: 20px;
position: relative;
outline: 0;
margin: 0;
font-weight: normal;
cursor: pointer;
user-select: none;
padding: 1px;
background-color: @rp-highlight-blue;
border-radius: 0.875em;
transition:
background 0.15s ease,
border-color 0.15s ease;
&::before {
content: '';
display: block;
width: 16px;
height: 16px;
position: relative;
left: 1px;
top: 1px;
background-color: #fff;
border-radius: 0.875em;
transition:
background-color 0.15s ease,
color 0.15s ease,
left 0.15s ease;
}
}
&:checked + .input-switch-btn {
background-color: @ol-green;
border-color: #fff;
&::before {
left: 15px;
top: 1px;
}
}
&:disabled + .input-switch-btn {
cursor: default;
opacity: 0.35;
}
}