mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-20 12:29:55 +08:00
fix(menu-button): move font-size to host for easier customization (#18699)
fixes #18667
This commit is contained in:
@ -11,6 +11,8 @@
|
||||
--padding-end: 5px;
|
||||
|
||||
height: 32px;
|
||||
|
||||
font-size: 31px;
|
||||
}
|
||||
|
||||
:host(.activated) {
|
||||
@ -23,10 +25,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
ion-icon {
|
||||
font-size: 31px;
|
||||
}
|
||||
|
||||
|
||||
// Menu Button Color: Focused
|
||||
// --------------------------------------------------
|
||||
|
@ -13,12 +13,11 @@
|
||||
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
}
|
||||
|
||||
ion-icon {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
|
||||
// Menu Button Color: Hover
|
||||
// --------------------------------------------------
|
||||
|
||||
|
@ -27,6 +27,8 @@
|
||||
<ion-menu-button auto-hide="false" color="secondary" class="custom"></ion-menu-button>
|
||||
<ion-menu-button auto-hide="false" class="custom ion-focused"></ion-menu-button>
|
||||
<ion-menu-button auto-hide="false" color="secondary" class="custom ion-focused"></ion-menu-button>
|
||||
<ion-menu-button auto-hide="false" class="custom-large"></ion-menu-button>
|
||||
<ion-menu-button auto-hide="false" class="custom-large ion-focused"></ion-menu-button>
|
||||
|
||||
<h1>Colors</h1>
|
||||
<ion-menu-button auto-hide="false" color="primary"></ion-menu-button>
|
||||
@ -103,6 +105,11 @@
|
||||
--background-focused: rgb(255, 105, 180, .24);
|
||||
}
|
||||
|
||||
.custom-large {
|
||||
width: 84px;
|
||||
height: 84px;
|
||||
font-size: 44px;
|
||||
}
|
||||
</style>
|
||||
</body>
|
||||
|
||||
|
Reference in New Issue
Block a user