mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
Compare commits
1 Commits
next
...
item-clean
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
3e1446d299 |
@@ -103,15 +103,6 @@
|
||||
@include margin($item-ios-icon-slot-margin-top, $item-ios-icon-slot-margin-end, $item-ios-icon-slot-margin-bottom, $item-ios-icon-slot-margin-start);
|
||||
}
|
||||
|
||||
|
||||
// iOS Slotted Toggle
|
||||
// --------------------------------------------------
|
||||
|
||||
::slotted(ion-toggle[slot="start"]),
|
||||
::slotted(ion-toggle[slot="end"]) {
|
||||
@include margin(0);
|
||||
}
|
||||
|
||||
// iOS Stacked / Floating Labels
|
||||
// --------------------------------------------------
|
||||
|
||||
@@ -157,16 +148,6 @@
|
||||
@include margin(($item-ios-padding-end * 0.5));
|
||||
}
|
||||
|
||||
|
||||
// iOS Radio / Toggle Item Label
|
||||
// -----------------------------------------
|
||||
|
||||
:host(.item-radio) ::slotted(ion-label),
|
||||
:host(.item-toggle) ::slotted(ion-label) {
|
||||
@include margin-horizontal(0px, null);
|
||||
}
|
||||
|
||||
|
||||
// iOS Slotted Label
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
@@ -122,15 +122,6 @@
|
||||
@include margin-horizontal($item-md-icon-end-slot-margin-start, $item-md-icon-end-slot-margin-end);
|
||||
}
|
||||
|
||||
// Material Design Slotted Toggle
|
||||
// --------------------------------------------------
|
||||
|
||||
::slotted(ion-toggle[slot="start"]),
|
||||
::slotted(ion-toggle[slot="end"]) {
|
||||
@include margin(0);
|
||||
}
|
||||
|
||||
|
||||
// Material Design Slotted Note
|
||||
// --------------------------------------------------
|
||||
|
||||
@@ -195,14 +186,6 @@
|
||||
@include margin($item-md-label-slot-end-margin-top, $item-md-label-slot-end-margin-end, $item-md-label-slot-end-margin-bottom, $item-md-label-slot-end-margin-start);
|
||||
}
|
||||
|
||||
// Material Design Toggle/Radio Item
|
||||
// --------------------------------------------------
|
||||
|
||||
:host(.item-toggle) ::slotted(ion-label),
|
||||
:host(.item-radio) ::slotted(ion-label) {
|
||||
@include margin-horizontal(0, null);
|
||||
}
|
||||
|
||||
// Material Design Item Button
|
||||
// --------------------------------------------------
|
||||
|
||||
@@ -226,8 +209,6 @@
|
||||
}
|
||||
|
||||
:host(.ion-focused:not(.ion-color)) ::slotted(.label-stacked),
|
||||
:host(.ion-focused:not(.ion-color)) ::slotted(.label-floating),
|
||||
:host(.item-has-focus:not(.ion-color)) ::slotted(.label-stacked),
|
||||
:host(.item-has-focus:not(.ion-color)) ::slotted(.label-floating) {
|
||||
:host(.ion-focused:not(.ion-color)) ::slotted(.label-floating) {
|
||||
color: $label-md-text-color-focused;
|
||||
}
|
||||
|
||||
@@ -347,13 +347,6 @@ a {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
// Item Input
|
||||
// --------------------------------------------------
|
||||
|
||||
:host(.item-input) {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.input-wrapper {
|
||||
display: flex;
|
||||
|
||||
@@ -395,13 +388,6 @@ a {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
// Item Textarea
|
||||
// --------------------------------------------------
|
||||
|
||||
:host(.item-textarea) {
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
// Item Reorder
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
@@ -27,21 +27,6 @@
|
||||
transition: transform 150ms ease-in-out;
|
||||
}
|
||||
|
||||
:host-context(.item-textarea).label-floating {
|
||||
@include transform(translate(0, 28px));
|
||||
}
|
||||
|
||||
:host-context(.item-has-focus).label-stacked,
|
||||
:host-context(.item-has-focus).label-floating {
|
||||
color: $label-ios-text-color-focused;
|
||||
}
|
||||
|
||||
:host-context(.item-has-focus).label-floating,
|
||||
:host-context(.item-has-placeholder:not(.item-input)).label-floating,
|
||||
:host-context(.item-has-value).label-floating {
|
||||
@include transform(scale(0.82));
|
||||
}
|
||||
|
||||
// iOS Typography
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
@@ -45,32 +45,20 @@
|
||||
transform 150ms $label-md-transition-timing-function;
|
||||
}
|
||||
|
||||
:host-context(.ion-focused).label-floating,
|
||||
:host-context(.item-has-focus).label-floating,
|
||||
:host-context(.item-has-placeholder:not(.item-input)).label-floating,
|
||||
:host-context(.item-has-value).label-floating {
|
||||
:host-context(.ion-focused).label-floating {
|
||||
@include transform(translateY(50%), scale(.75));
|
||||
}
|
||||
|
||||
:host-context(.ion-focused).label-stacked:not(.ion-color),
|
||||
:host-context(.ion-focused).label-floating:not(.ion-color),
|
||||
:host-context(.item-has-focus).label-stacked:not(.ion-color),
|
||||
:host-context(.item-has-focus).label-floating:not(.ion-color) {
|
||||
:host-context(.ion-focused).label-floating:not(.ion-color) {
|
||||
color: $label-md-text-color-focused;
|
||||
}
|
||||
|
||||
:host-context(.ion-focused.ion-color).label-stacked:not(.ion-color),
|
||||
:host-context(.ion-focused.ion-color).label-floating:not(.ion-color),
|
||||
:host-context(.item-has-focus.ion-color).label-stacked:not(.ion-color),
|
||||
:host-context(.item-has-focus.ion-color).label-floating:not(.ion-color) {
|
||||
:host-context(.ion-focused.ion-color).label-floating:not(.ion-color) {
|
||||
color: #{current-color(contrast)};
|
||||
}
|
||||
|
||||
:host-context(.ion-invalid.ion-touched).label-stacked:not(.ion-color),
|
||||
:host-context(.ion-invalid.ion-touched).label-floating:not(.ion-color) {
|
||||
color: var(--highlight-color-invalid);
|
||||
}
|
||||
|
||||
// MD Typography
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
@@ -36,17 +36,6 @@
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
:host-context(.item-input) {
|
||||
flex: initial;
|
||||
|
||||
max-width: 200px;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
:host-context(.item-textarea) {
|
||||
align-self: baseline;
|
||||
}
|
||||
|
||||
// Overflow hidden is required for the proper
|
||||
// margins between skeleton text elements
|
||||
:host-context(.item-skeleton-text) {
|
||||
|
||||
Reference in New Issue
Block a user