may/1KA_F2F
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Redesign - popravki radio in checkboxov

Browse Source
This commit is contained in:
pero1203 2021-11-08 10:16:18 +01:00
parent e9c417682e
commit 68a926e4ed
4 changed files with 1293 additions and 1252 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
admin/survey/redesign_test.php
View File

@ -154,10 +154,10 @@
<div class="content_div">
<label class="input_label">Radio gumbi:</label>
<form>
<input class="radio" type="radio" id="1" name="radio"></input>
<label>Option 1</label>
<input class="radio" type="radio" id="2" name="radio"></input>
<label>Option 2</label>
<input class="radio" type="radio" id="r1" name="radio"></input>
<label for="r1">Option 1</label>
<input class="radio" type="radio" id="r2" name="radio"></input>
<label for="r2">Option 2</label>
</form>
</div>
@ -165,10 +165,10 @@
<div class="content_div">
<label class="input_label">Checkbox:</label>
<form>
<input class="checkbox" type="checkbox" id="1" name="checkbox"></input>
<label>Option 1</label>
<input class="checkbox" type="checkbox" id="2" name="checkbox"></input>
<label>Option 2</label>
<input class="checkbox" type="checkbox" id="c1" name="checkbox"></input>
<label for="c1">Option 1</label>
<input class="checkbox" type="checkbox" id="c2" name="checkbox"></input>
<label for="c2">Option 2</label>
</form>
</div>

2448
public/css/admin_new.css
View File

File diff suppressed because it is too large Load Diff

2
resources/sass/admin_new/basic/colors.scss
View File

@ -8,6 +8,8 @@ $blue: #1E88E5;
$black: #333333;
$white: #FFFFFF;
$dark-gray: #C4C4C4;
$gray: #E5E5E5;
$light-gray: #F8F8F8;

79
resources/sass/admin_new/components/form/input.scss
View File

@ -1,6 +1,14 @@
label{
cursor: pointer;
margin-right: 13px;
font-size: 16px;
}
input {
&.text {
&[type="text"] {
border: 1px solid $gray;
box-sizing: border-box;
border-radius: 2px;
@ -16,37 +24,50 @@ input {
&.small {
height: 26px;
}
}
&.checkbox {
-webkit-appearance: none;
width: 18px;
height: 18px;
border: 1px solid $gray;
box-sizing: border-box;
border-radius: 2px;
&:checked { //manjka prikaz kljukice
background: $blue;
border: 1px solid $blue;
}
// Radio button and checkbox
&[type=radio],
&[type=checkbox]{
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
&[type=radio] + label:before,
&[type=checkbox] + label:before {
cursor: pointer;
font-family: $fontawesome;
display: inline-block;
color: $dark-gray;
letter-spacing: 8px;
font-size: 18px;
vertical-align: -1px;
}
&[type=radio]:checked + label:before,
&[type=checkbox]:checked + label:before {
color: $blue;
}
&.radio {
-webkit-appearance: none;
width: 18px;
height: 18px;
border: 1px solid $gray;
box-sizing: border-box;
border-radius: 50px;
&:checked { //manjka prikaz pikice
background: $blue;
border: 1px solid $blue;
}
&[type=checkbox] + label:before {
content: "\f0c8";
}
&[type=checkbox]:checked + label:before {
content: "\f14a";
font-weight: bold;
}
}
&[type=radio] + label:before {
content: "\f111";
}
&[type=radio]:checked + label:before {
content: "\f192";
}
}