0.2.0 - better sliders
All checks were successful
Android Build / publish (push) Successful in 52s
Linux Build / publish (push) Successful in 58s

This commit is contained in:
olcxja 2026-08-24 20:20:00 +02:00
commit 093498e168
2 changed files with 54 additions and 46 deletions

View file

@ -774,7 +774,7 @@ space{
border-radius: 0.8rem; border-radius: 0.8rem;
transform: translateY(calc( ( var(--icon-button-height) + (var(--button-margin) * 2) ) / 2 - 0.6rem)); transform: translateY(calc( ( var(--icon-button-height) + (var(--button-margin) * 2) ) / 2 - 0.6rem));
} }
button:hover, input:hover, textarea:hover { button:hover, input:not([type="range"]):hover, textarea:hover {
background-color: rgba(255, 255, 255, 0.1); background-color: rgba(255, 255, 255, 0.1);
} }
.submit-button:hover, .profile-action-btn:hover { .submit-button:hover, .profile-action-btn:hover {
@ -791,7 +791,11 @@ space{
filter: brightness(0.93); filter: brightness(0.93);
} }
} }
button:active, button.is-pressed, input:active, input.is-pressed, textarea:active, textarea.is-pressed { /* Suwaki ([type=range]) są wyłączone z efektu klikania całego pola -
przytrzymanie skaluje tylko uchwyt (patrz ::-webkit-slider-thumb:active). */
button:active, button.is-pressed,
input:not([type="range"]):active, input:not([type="range"]).is-pressed,
textarea:active, textarea.is-pressed {
background-color: rgba(255, 255, 255, 0.1); background-color: rgba(255, 255, 255, 0.1);
transform: var(--press-scale); transform: var(--press-scale);
} }
@ -1021,15 +1025,18 @@ button.profile-action-btn.popup-btn-danger:hover, button.submit-button.popup-btn
height: auto; height: auto;
} }
/* Custom Zoom Slider Styling */
#cropper-zoom, input[type="range"] {
.voice-setting-row input[type="range"] {
-webkit-appearance: none; -webkit-appearance: none;
appearance: none; appearance: none;
display: block;
margin: 0;
padding: 0.4rem 0.05rem;
border: none;
width: 100%; width: 100%;
height: 0.375rem; height: 0.375rem;
background: rgba(255, 255, 255, 0.1); background: rgba(255, 255, 255, 0.1);
border-radius: 0.1875rem; border-radius: 0.34rem;
outline: none; outline: none;
} }
@ -1037,8 +1044,7 @@ button.profile-action-btn.popup-btn-danger:hover, button.submit-button.popup-btn
margin: 0.625rem 0; margin: 0.625rem 0;
} }
#cropper-zoom::-webkit-slider-thumb, input[type="range"]::-webkit-slider-thumb {
.voice-setting-row input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none; -webkit-appearance: none;
appearance: none; appearance: none;
width: 1rem; width: 1rem;
@ -1049,14 +1055,16 @@ button.profile-action-btn.popup-btn-danger:hover, button.submit-button.popup-btn
transition: transform 0.2s, background 0.2s; transition: transform 0.2s, background 0.2s;
} }
#cropper-zoom::-webkit-slider-thumb:hover, input[type="range"]::-webkit-slider-thumb:hover {
.voice-setting-row input[type="range"]::-webkit-slider-thumb:hover { transform: scale(1.08);
transform: scale(1.2);
background: #fff; background: #fff;
} }
#cropper-zoom::-moz-range-thumb, input[type="range"]::-webkit-slider-thumb:active {
.voice-setting-row input[type="range"]::-moz-range-thumb { transform: scale(0.87);
}
input[type="range"]::-moz-range-thumb {
width: 1rem; width: 1rem;
height: 1rem; height: 1rem;
border-radius: 50%; border-radius: 50%;
@ -1066,12 +1074,15 @@ button.profile-action-btn.popup-btn-danger:hover, button.submit-button.popup-btn
border: none; border: none;
} }
#cropper-zoom::-moz-range-thumb:hover, input[type="range"]::-moz-range-thumb:hover {
.voice-setting-row input[type="range"]::-moz-range-thumb:hover { transform: scale(1.08);
transform: scale(1.2);
background: #fff; background: #fff;
} }
input[type="range"]::-moz-range-thumb:active {
transform: scale(0.87);
}
roomcontent roomtopbar .room-action-pin, roomcontent roomtopbar .room-action-pin,
roomcontent roomtopbar .room-action-call { roomcontent roomtopbar .room-action-call {
display: flex; display: flex;
@ -1713,13 +1724,6 @@ input:checked + .toggle-slider:before {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.voice-setting-row input[type="range"] {
margin: 0;
width: 100%;
appearance: none;
-webkit-appearance: none;
outline: none;
}
/* In-call Voice Device Settings Popup */ /* In-call Voice Device Settings Popup */
#voice-device-settings { #voice-device-settings {

View file

@ -774,7 +774,7 @@ space{
border-radius: 0.8rem; border-radius: 0.8rem;
transform: translateY(calc( ( var(--icon-button-height) + (var(--button-margin) * 2) ) / 2 - 0.6rem)); transform: translateY(calc( ( var(--icon-button-height) + (var(--button-margin) * 2) ) / 2 - 0.6rem));
} }
button:hover, input:hover, textarea:hover { button:hover, input:not([type="range"]):hover, textarea:hover {
background-color: rgba(255, 255, 255, 0.1); background-color: rgba(255, 255, 255, 0.1);
} }
.submit-button:hover, .profile-action-btn:hover { .submit-button:hover, .profile-action-btn:hover {
@ -791,7 +791,11 @@ space{
filter: brightness(0.93); filter: brightness(0.93);
} }
} }
button:active, button.is-pressed, input:active, input.is-pressed, textarea:active, textarea.is-pressed { /* Suwaki ([type=range]) są wyłączone z efektu klikania całego pola -
przytrzymanie skaluje tylko uchwyt (patrz ::-webkit-slider-thumb:active). */
button:active, button.is-pressed,
input:not([type="range"]):active, input:not([type="range"]).is-pressed,
textarea:active, textarea.is-pressed {
background-color: rgba(255, 255, 255, 0.1); background-color: rgba(255, 255, 255, 0.1);
transform: var(--press-scale); transform: var(--press-scale);
} }
@ -1021,15 +1025,18 @@ button.profile-action-btn.popup-btn-danger:hover, button.submit-button.popup-btn
height: auto; height: auto;
} }
/* Custom Zoom Slider Styling */
#cropper-zoom, input[type="range"] {
.voice-setting-row input[type="range"] {
-webkit-appearance: none; -webkit-appearance: none;
appearance: none; appearance: none;
display: block;
margin: 0;
padding: 0.4rem 0.05rem;
border: none;
width: 100%; width: 100%;
height: 0.375rem; height: 0.375rem;
background: rgba(255, 255, 255, 0.1); background: rgba(255, 255, 255, 0.1);
border-radius: 0.1875rem; border-radius: 0.34rem;
outline: none; outline: none;
} }
@ -1037,8 +1044,7 @@ button.profile-action-btn.popup-btn-danger:hover, button.submit-button.popup-btn
margin: 0.625rem 0; margin: 0.625rem 0;
} }
#cropper-zoom::-webkit-slider-thumb, input[type="range"]::-webkit-slider-thumb {
.voice-setting-row input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none; -webkit-appearance: none;
appearance: none; appearance: none;
width: 1rem; width: 1rem;
@ -1049,14 +1055,16 @@ button.profile-action-btn.popup-btn-danger:hover, button.submit-button.popup-btn
transition: transform 0.2s, background 0.2s; transition: transform 0.2s, background 0.2s;
} }
#cropper-zoom::-webkit-slider-thumb:hover, input[type="range"]::-webkit-slider-thumb:hover {
.voice-setting-row input[type="range"]::-webkit-slider-thumb:hover { transform: scale(1.08);
transform: scale(1.2);
background: #fff; background: #fff;
} }
#cropper-zoom::-moz-range-thumb, input[type="range"]::-webkit-slider-thumb:active {
.voice-setting-row input[type="range"]::-moz-range-thumb { transform: scale(0.87);
}
input[type="range"]::-moz-range-thumb {
width: 1rem; width: 1rem;
height: 1rem; height: 1rem;
border-radius: 50%; border-radius: 50%;
@ -1066,12 +1074,15 @@ button.profile-action-btn.popup-btn-danger:hover, button.submit-button.popup-btn
border: none; border: none;
} }
#cropper-zoom::-moz-range-thumb:hover, input[type="range"]::-moz-range-thumb:hover {
.voice-setting-row input[type="range"]::-moz-range-thumb:hover { transform: scale(1.08);
transform: scale(1.2);
background: #fff; background: #fff;
} }
input[type="range"]::-moz-range-thumb:active {
transform: scale(0.87);
}
roomcontent roomtopbar .room-action-pin, roomcontent roomtopbar .room-action-pin,
roomcontent roomtopbar .room-action-call { roomcontent roomtopbar .room-action-call {
display: flex; display: flex;
@ -1713,13 +1724,6 @@ input:checked + .toggle-slider:before {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.voice-setting-row input[type="range"] {
margin: 0;
width: 100%;
appearance: none;
-webkit-appearance: none;
outline: none;
}
/* In-call Voice Device Settings Popup */ /* In-call Voice Device Settings Popup */
#voice-device-settings { #voice-device-settings {