yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

renaming of umb-form-control to umb-form-check

Browse Source
This commit is contained in:
Niels Lyngsoe
2019-03-04 10:29:58 +01:00
parent 969a9c1193
commit 409ae99bf7
4 changed files with 24 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/Umbraco.Web.UI.Client/src/less/belle.less
View File

@@ -101,7 +101,7 @@
@import "components/umb-confirm-action.less";
@import "components/umb-keyboard-shortcuts-overview.less";
@import "components/umb-checkbox-list.less";
@import "components/umb-form-control.less";
@import "components/umb-form-check.less";
@import "components/umb-locked-field.less";
@import "components/umb-tabs.less";
@import "components/umb-load-indicator.less";

24
src/Umbraco.Web.UI.Client/src/less/components/umb-form-control.less → src/Umbraco.Web.UI.Client/src/less/components/umb-form-check.less
View File

@@ -1,7 +1,7 @@
@checkboxWidth: 15px;
@checkboxHeight: 15px;
.umb-form-control{
.umb-form-check {
display: flex;
flex-wrap: wrap;
align-items: center;
@@ -21,19 +21,19 @@
left: 0;
opacity: 0;
&:checked ~ .umb-form-control__state .umb-form-control__check{
&:checked ~ .umb-form-check__state .umb-form-check__check{
border-color: @green;
}
&:focus:checked ~ .umb-form-control .umb-form-control__check,
&:focus ~ .umb-form-control__state .umb-form-control__check{
&:focus:checked ~ .umb-form-check .umb-form-check__check,
&:focus ~ .umb-form-check__state .umb-form-check__check{
border-color: @gray-5;
}
&:checked ~ .umb-form-control__state{
.umb-form-control__check{
&:checked ~ .umb-form-check__state{
.umb-form-check__check{
// This only happens if the state has a radiobutton modifier
.umb-form-control--radiobutton &{
.umb-form-check--radiobutton &{
&:before{
opacity: 1;
transform: scale(1);
@@ -41,7 +41,7 @@
}
// This only happens if state has the checkbox modifier
.umb-form-control--checkbox &{
.umb-form-check--checkbox &{
&:before{
width: @checkboxWidth;
height: @checkboxHeight;
@@ -50,8 +50,8 @@
}
// This only happens if state has the checkbox modifier
.umb-form-control--checkbox &{
.umb-form-control__icon{
.umb-form-check--checkbox &{
.umb-form-check__icon{
opacity: 1;
}
}
@@ -83,7 +83,7 @@
}
// This only happens if state has the radiobutton modifier
.umb-form-control--radiobutton &{
.umb-form-check--radiobutton &{
border-radius: 100%;
&:before{
@@ -97,7 +97,7 @@
}
// This only happens if state has the checkbox modifier
.umb-form-control--checkbox &{
.umb-form-check--checkbox &{
&:before{
width: 0;
height: 0;

12
src/Umbraco.Web.UI.Client/src/views/components/forms/umb-checkbox.html
View File

@@ -1,14 +1,14 @@
<label class="checkbox umb-form-control umb-form-control--checkbox">
<label class="checkbox umb-form-check umb-form-check--checkbox">
<input type="checkbox" name="{{name}}"
value="{{value}}"
ng-model="model"
class="umb-form-control__input"
class="umb-form-check__input"
ng-required="model.validation.mandatory && !model.value.length" />
<div class="umb-form-control__state umb-form-control__state" aria-hidden="true">
<div class="umb-form-control__check">
<i class="umb-form-control__icon icon-check"></i>
<div class="umb-form-check__state umb-form-check__state" aria-hidden="true">
<div class="umb-form-check__check">
<i class="umb-form-check__icon icon-check"></i>
</div>
</div>
<span class="umb-form-control__text">{{text}}</span>
<span class="umb-form-check__text">{{text}}</span>
</label>

10
src/Umbraco.Web.UI.Client/src/views/components/forms/umb-radiobutton.html
View File

@@ -1,11 +1,11 @@
<label class="radio umb-form-control umb-form-control--radiobutton">
<label class="radio umb-form-check umb-form-check--radiobutton">
<input type="radio" name="radiobuttons-{{name}}"
value="{{value}}"
ng-model="model"
class="umb-form-control__input" />
class="umb-form-check__input" />
<div class="umb-form-control__state umb-form-control__state" aria-hidden="true">
<div class="umb-form-control__check"></div>
<div class="umb-form-check__state umb-form-check__state" aria-hidden="true">
<div class="umb-form-check__check"></div>
</div>
<span class="umb-form-control__text">{{text}}</span>
<span class="umb-form-check__text">{{text}}</span>
</label>