@ionic/core
Version:
Base components for Ionic
88 lines (79 loc) • 2.08 kB
CSS
:host {
display: flex;
align-items: center;
transform: translateZ(0);
z-index: 99; }
::slotted(*) ion-button {
--padding-top: 0;
--padding-bottom: 0;
--padding-start: 0;
--padding-end: 0;
--box-shadow: none;
--overflow: visible;
margin-left: 0;
margin-right: 0;
margin-top: 0;
margin-bottom: 0;
margin-left: 2px;
margin-right: 2px; }
@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
::slotted(*) ion-button {
margin-left: unset;
margin-right: unset;
-webkit-margin-start: 2px;
margin-inline-start: 2px;
-webkit-margin-end: 2px;
margin-inline-end: 2px; } }
::slotted(*) ion-button {
--padding-top: 0;
--padding-bottom: 0;
--padding-start: 5px;
--padding-end: 5px;
height: 32px;
font-size: 17px;
font-weight: 400; }
::slotted(*) ion-button:not(.button-round) {
--border-radius: 4px; }
:host-context(.ion-color)::slotted(*) .button {
--color: initial;
--color-activated: initial; }
@media (any-hover: hover) {
::slotted(*) .button-solid-ios:hover {
opacity: .4; } }
::slotted(*) ion-icon[slot="start"] {
margin-left: 0;
margin-right: 0;
margin-top: 0;
margin-bottom: 0;
margin-right: 0.3em;
font-size: 24px;
line-height: .67; }
@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
::slotted(*) ion-icon[slot="start"] {
margin-right: unset;
-webkit-margin-end: 0.3em;
margin-inline-end: 0.3em; } }
::slotted(*) ion-icon[slot="end"] {
margin-left: 0;
margin-right: 0;
margin-top: 0;
margin-bottom: 0;
margin-left: 0.4em;
font-size: 24px;
line-height: .67; }
@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
::slotted(*) ion-icon[slot="end"] {
margin-left: unset;
-webkit-margin-start: 0.4em;
margin-inline-start: 0.4em; } }
::slotted(*) ion-icon[slot="icon-only"] {
padding-left: 0;
padding-right: 0;
padding-top: 0;
padding-bottom: 0;
margin-left: 0;
margin-right: 0;
margin-top: 0;
margin-bottom: 0;
font-size: 31px;
line-height: .67; }