Skip to content
Permalink
Browse files

fix(alert): apply styling to disabled items (#18545)

* fix(datetime): ensure hasValue returns correct value

* fix(alert): apply styling to disabled items

* test(datetime): add tests for empty value datetime

* fix(): update getter for stencil update

* fix: change default opacity to disabled button opacity

* test(select): add tests to ion-select-option disabled items

* Revert "test(select): add tests to ion-select-option disabled items"

This reverts commit b7ac867

* update disabled css to use classes
  • Loading branch information...
kelvindart authored and liamdebeasi committed Aug 20, 2019
1 parent cbd230c commit 67ed89ded8b38a326ed61c1abc06a47592bee200
@@ -150,6 +150,17 @@
height: 100%;
}


// Alert Button: Disabled
// --------------------------------------------------
.alert-input-disabled,
.alert-checkbox-button-disabled .alert-button-inner,
.alert-radio-button-disabled .alert-button-inner {
cursor: default;
opacity: .5;
pointer-events: none;
}

.alert-tappable {
@include margin(0);
@include padding(0);
@@ -303,7 +303,13 @@ export class Alert implements ComponentInterface, OverlayInterface {
disabled={i.disabled}
tabIndex={0}
role="checkbox"
class="alert-tappable alert-checkbox alert-checkbox-button ion-focusable"
class={{
'alert-tappable': true,
'alert-checkbox': true,
'alert-checkbox-button': true,
'ion-focusable': true,
'alert-checkbox-button-disabled': i.disabled || false
}}
>
<div class="alert-button-inner">
<div class="alert-checkbox-icon">
@@ -335,7 +341,13 @@ export class Alert implements ComponentInterface, OverlayInterface {
disabled={i.disabled}
id={i.id}
tabIndex={0}
class="alert-radio-button alert-tappable alert-radio ion-focusable"
class={{
'alert-radio-button': true,
'alert-tappable': true,
'alert-radio': true,
'ion-focusable': true,
'alert-radio-button-disabled': i.disabled || false
}}
role="radio"
>
<div class="alert-button-inner">
@@ -369,7 +381,10 @@ export class Alert implements ComponentInterface, OverlayInterface {
id={i.id}
disabled={i.disabled}
tabIndex={0}
class="alert-input"
class={{
'alert-input': true,
'alert-input-disabled': i.disabled || false
}}
/>
</div>
))}
@@ -129,6 +129,11 @@
value: 'hello',
placeholder: 'Placeholder 2'
},
{
type: 'text',
placeholder: 'Placeholder 3',
disabled: true
},
{
name: 'name3',
type: 'text',
@@ -207,7 +212,8 @@
{
type: 'radio',
label: 'Radio 5',
value: 'value5'
value: 'value5',
disabled: true
},
{
type: 'radio',
@@ -267,7 +273,8 @@
{
type: 'checkbox',
label: 'Checkbox 5',
value: 'value5'
value: 'value5',
disabled: true
},
{

0 comments on commit 67ed89d

Please sign in to comment.
You can’t perform that action at this time.