|
Server : Apache System : Linux gains.enterpriseappscloud.com 4.18.0-553.62.1.lve.el8.x86_64 #1 SMP Mon Jul 21 17:50:35 UTC 2025 x86_64 User : beyondlimi ( 2438) PHP Version : 7.4.33 Disable Function : allow_url_include, show_source, symlink, system, passthru, exec, popen, pclose, proc_open, proc_terminate,proc_get_status, proc_close, proc_nice, allow_url_fopen, shell-exec, shell_exec, fpassthru, base64_encodem, escapeshellcmd, escapeshellarg, crack_check,crack_closedict, crack_getlastmessage, crack_opendict, posix_kill, posix_mkfifo, posix_setpgid, posix_setsid, posix_setuid, dl, escap, phpinfo Directory : /home/beyondlimi/domains/beyondlimits.org.in/public_html/scss/bootstrap/scss/forms/ |
Upload File : |
// Range
//
// Style range inputs the same across browsers. Vendor-specific rules for pseudo
// elements cannot be mixed. As such, there are no shared styles for focus or
// active states on prefixed selectors.
.form-range {
width: 100%;
height: add($form-range-thumb-height, $form-range-thumb-focus-box-shadow-width * 2);
padding: 0; // Need to reset padding
background-color: transparent;
appearance: none;
&:focus {
outline: 0;
// Pseudo-elements must be split across multiple rulesets to have an effect.
// No box-shadow() mixin for focus accessibility.
&::-webkit-slider-thumb { box-shadow: $form-range-thumb-focus-box-shadow; }
&::-moz-range-thumb { box-shadow: $form-range-thumb-focus-box-shadow; }
}
&::-moz-focus-outer {
border: 0;
}
&::-webkit-slider-thumb {
width: $form-range-thumb-width;
height: $form-range-thumb-height;
margin-top: ($form-range-track-height - $form-range-thumb-height) / 2; // Webkit specific
@include gradient-bg($form-range-thumb-bg);
border: $form-range-thumb-border;
@include border-radius($form-range-thumb-border-radius);
@include box-shadow($form-range-thumb-box-shadow);
@include transition($form-range-thumb-transition);
appearance: none;
&:active {
@include gradient-bg($form-range-thumb-active-bg);
}
}
&::-webkit-slider-runnable-track {
width: $form-range-track-width;
height: $form-range-track-height;
color: transparent; // Why?
cursor: $form-range-track-cursor;
background-color: $form-range-track-bg;
border-color: transparent;
@include border-radius($form-range-track-border-radius);
@include box-shadow($form-range-track-box-shadow);
}
&::-moz-range-thumb {
width: $form-range-thumb-width;
height: $form-range-thumb-height;
@include gradient-bg($form-range-thumb-bg);
border: $form-range-thumb-border;
@include border-radius($form-range-thumb-border-radius);
@include box-shadow($form-range-thumb-box-shadow);
@include transition($form-range-thumb-transition);
appearance: none;
&:active {
@include gradient-bg($form-range-thumb-active-bg);
}
}
&::-moz-range-track {
width: $form-range-track-width;
height: $form-range-track-height;
color: transparent;
cursor: $form-range-track-cursor;
background-color: $form-range-track-bg;
border-color: transparent; // Firefox specific?
@include border-radius($form-range-track-border-radius);
@include box-shadow($form-range-track-box-shadow);
}
&:disabled {
pointer-events: none;
&::-webkit-slider-thumb {
background-color: $form-range-thumb-disabled-bg;
}
&::-moz-range-thumb {
background-color: $form-range-thumb-disabled-bg;
}
}
}