mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-26 08:13:34 +08:00
97 lines
2.2 KiB
SCSS
97 lines
2.2 KiB
SCSS
@import "./item-divider";
|
|
@import "./item-divider.ios.vars";
|
|
|
|
// iOS Item Divider
|
|
// --------------------------------------------------
|
|
|
|
:host {
|
|
--ion-color-base: #{$item-ios-divider-background};
|
|
--ion-color-contrast: #{$item-ios-divider-color};
|
|
--padding-start: #{$item-ios-divider-padding-start};
|
|
|
|
@include border-radius(0);
|
|
|
|
position: relative;
|
|
|
|
font-family: $item-ios-divider-font-family;
|
|
font-size: $item-ios-divider-font-size;
|
|
}
|
|
|
|
.item-divider-inner {
|
|
@include padding-horizontal(null, $item-ios-divider-padding-end / 2);
|
|
|
|
@media screen and (orientation: landscape) {
|
|
@include safe-area-padding-horizontal(null, $item-ios-divider-padding-end / 2);
|
|
}
|
|
}
|
|
|
|
|
|
// iOS Item Divider Slots
|
|
// --------------------------------------------------
|
|
|
|
:host([slot="start"]) {
|
|
@include margin($item-ios-slot-start-margin-top, $item-ios-slot-start-margin-end, $item-ios-slot-start-margin-bottom, $item-ios-slot-start-margin-start);
|
|
}
|
|
|
|
:host([slot="end"]) {
|
|
@include margin($item-ios-slot-end-margin-top, $item-ios-slot-end-margin-end, $item-ios-slot-end-margin-bottom, $item-ios-slot-end-margin-start);
|
|
}
|
|
|
|
::slotted(ion-icon[slot="start"]),
|
|
::slotted(ion-icon[slot="end"]) {
|
|
@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 Item Divider Content
|
|
// --------------------------------------------------
|
|
|
|
::slotted(h1) {
|
|
@include margin(0, 0, 2px);
|
|
|
|
font-size: 24px;
|
|
font-weight: normal;
|
|
}
|
|
|
|
::slotted(h2) {
|
|
@include margin(0, 0, 2px);
|
|
|
|
font-size: 17px;
|
|
font-weight: normal;
|
|
}
|
|
|
|
::slotted(h3),
|
|
::slotted(h4),
|
|
::slotted(h5),
|
|
::slotted(h6) {
|
|
@include margin(0, 0, 3px);
|
|
|
|
font-size: 14px;
|
|
font-weight: normal;
|
|
|
|
line-height: normal;
|
|
}
|
|
|
|
::slotted(p) {
|
|
@include margin($item-ios-paragraph-margin-top, $item-ios-paragraph-margin-end, $item-ios-paragraph-margin-bottom, $item-ios-paragraph-margin-start);
|
|
|
|
color: $item-ios-paragraph-text-color;
|
|
|
|
font-size: $item-ios-paragraph-font-size;
|
|
|
|
line-height: normal;
|
|
|
|
text-overflow: inherit;
|
|
|
|
overflow: inherit;
|
|
}
|
|
|
|
::slotted(h2:last-child)
|
|
::slotted(h3:last-child),
|
|
::slotted(h4:last-child),
|
|
::slotted(h5:last-child),
|
|
::slotted(h6:last-child),
|
|
::slotted(p:last-child) {
|
|
@include margin(null, null, 0, null);
|
|
}
|