mirror of
https://github.com/snipe/snipe-it.git
synced 2024-12-26 06:04:08 -08:00
Additional form CSS tweaks for disabled and unchecked
Signed-off-by: snipe <snipe@snipe.net>
This commit is contained in:
parent
9146850ffe
commit
c5d74ac27f
|
@ -690,7 +690,7 @@ th.css-accessory > .th-inner::before
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/** form-stuff overrides for checkboxes and stuff **/
|
/** Form-stuff overrides for checkboxes and stuff **/
|
||||||
|
|
||||||
.form-control--disabled {
|
.form-control--disabled {
|
||||||
color: #959495;
|
color: #959495;
|
||||||
|
@ -708,7 +708,9 @@ label.form-control {
|
||||||
padding-left: 0px;
|
padding-left: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/** Checkbox style to replace iCheck **/
|
/** --------------------------------------- **/
|
||||||
|
/** Start checkbox styles to replace iCheck **/
|
||||||
|
/** --------------------------------------- **/
|
||||||
input[type="checkbox"] {
|
input[type="checkbox"] {
|
||||||
/* Add if not using autoprefixer */
|
/* Add if not using autoprefixer */
|
||||||
-webkit-appearance: none;
|
-webkit-appearance: none;
|
||||||
|
@ -729,6 +731,7 @@ input[type="checkbox"] {
|
||||||
/*Windows High Contrast Mode*/
|
/*Windows High Contrast Mode*/
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** This sets the display of a checkbox, and what the "fill" checkmark should look like */
|
||||||
|
|
||||||
input[type="checkbox"]::before {
|
input[type="checkbox"]::before {
|
||||||
|
|
||||||
|
@ -752,10 +755,12 @@ input[type="checkbox"]::before {
|
||||||
background-color: CanvasText;
|
background-color: CanvasText;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** This sets the size of the scale up for the shape we defined above **/
|
||||||
input[type="checkbox"]:checked::before {
|
input[type="checkbox"]:checked::before {
|
||||||
transform: scale(1);
|
transform: scale(1);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** This sets the scale of the DISABLED but CHECKED checkbox */
|
||||||
input[type=checkbox]:disabled::before, input[type=radio]:disabled::before {
|
input[type=checkbox]:disabled::before, input[type=radio]:disabled::before {
|
||||||
content: "";
|
content: "";
|
||||||
width: 1em;
|
width: 1em;
|
||||||
|
@ -764,6 +769,13 @@ input[type=checkbox]:disabled::before, input[type=radio]:disabled::before {
|
||||||
box-shadow: inset 1em 1em #959495;
|
box-shadow: inset 1em 1em #959495;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* This sets the scale and style of a DISABLED checkbox that is NOT checked */
|
||||||
|
input[type=checkbox]:disabled:not(:checked)::before, input[type=radio]:disabled:not(:checked)::before {
|
||||||
|
content: "";
|
||||||
|
transform: scale(0);
|
||||||
|
cursor: not-allowed;
|
||||||
|
pointer-events:none;
|
||||||
|
}
|
||||||
|
|
||||||
input[type=checkbox]:disabled, input[type=radio]:disabled {
|
input[type=checkbox]:disabled, input[type=radio]:disabled {
|
||||||
--form-control-color: #959495;
|
--form-control-color: #959495;
|
||||||
|
@ -773,7 +785,7 @@ input[type=checkbox]:disabled, input[type=radio]:disabled {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/** Radio style to replace iCheck **/
|
/** Radio styles to replace iCheck **/
|
||||||
|
|
||||||
input[type="radio"] {
|
input[type="radio"] {
|
||||||
appearance: none;
|
appearance: none;
|
||||||
|
@ -820,3 +832,7 @@ input[type="radio"]:checked::before {
|
||||||
grid-template-columns: .1em auto;
|
grid-template-columns: .1em auto;
|
||||||
gap: 1.5em;
|
gap: 1.5em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** --------------------------------------- **/
|
||||||
|
/** End checkbox styles to replace iCheck **/
|
||||||
|
/** --------------------------------------- **/
|
Loading…
Reference in a new issue