javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-09 16:16:41 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'main' into chore-update-next-from-main

Browse Source
This commit is contained in:
Brandy Carney
2024-05-02 16:43:54 -04:00
parent 1116cdd44a 0124f3b0b3
commit 8b834387d4
876 changed files with 4034 additions and 2766 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
core/src/components/fab-button/fab-button.ios.vars.scss
View File

@ -4,58 +4,58 @@
// --------------------------------------------------
/// @prop - Box shadow of the FAB button
$fab-ios-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12) !default;
$fab-ios-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
/// @prop - Box shadow of the activated FAB button
$fab-ios-box-shadow-activated: $fab-ios-box-shadow !default;
$fab-ios-box-shadow-activated: $fab-ios-box-shadow;
/// @prop - Transform of the FAB button
$fab-ios-transform: scale(1.1) !default;
$fab-ios-transform: scale(1.1);
/// @prop - Transition of the FAB button
$fab-ios-transition: 0.2s transform cubic-bezier(0.25, 1.11, 0.78, 1.59) !default;
$fab-ios-transition: 0.2s transform cubic-bezier(0.25, 1.11, 0.78, 1.59);
/// @prop - Transition of the activated FAB button
$fab-ios-transition-activated: 0.2s transform ease-out !default;
$fab-ios-transition-activated: 0.2s transform ease-out;
/// @prop - Background color of the button
$fab-ios-background-color: ion-color(primary, base) !default;
$fab-ios-background-color: ion-color(primary, base);
/// @prop - Background color of the activated button
$fab-ios-background-color-activated: ion-color(primary, shade) !default;
$fab-ios-background-color-activated: ion-color(primary, shade);
/// @prop - Text color of the button
$fab-ios-text-color: ion-color(primary, contrast) !default;
$fab-ios-text-color: ion-color(primary, contrast);
/// @prop - Font size of the button icon
$fab-ios-icon-font-size: 28px !default;
$fab-ios-icon-font-size: 28px;
/// @prop - Background color of the button in a list
$fab-ios-list-button-background-color: ion-color(light, base) !default;
$fab-ios-list-button-background-color: ion-color(light, base);
/// @prop - Background color of the activated button in a list
$fab-ios-list-button-background-color-activated: ion-color(light, shade) !default;
$fab-ios-list-button-background-color-activated: ion-color(light, shade);
/// @prop - Background color of the hovered button in a list
$fab-ios-list-button-background-color-hover: ion-color(light, tint) !default;
$fab-ios-list-button-background-color-hover: ion-color(light, tint);
/// @prop - Text color of the button in a list
$fab-ios-list-button-text-color: ion-color(light, contrast) !default;
$fab-ios-list-button-text-color: ion-color(light, contrast);
/// @prop - Font size of the button icon in a list
$fab-ios-list-button-icon-font-size: 18px !default;
$fab-ios-list-button-icon-font-size: 18px;
// Translucent FAB Button
// --------------------------------------------------
/// @prop - Backdrop filter of the translucent button
$fab-ios-translucent-filter: saturate(180%) blur(20px) !default;
$fab-ios-translucent-filter: saturate(180%) blur(20px);
/// @prop - Alpha level of the translucent button background
$fab-ios-translucent-background-alpha: 0.9 !default;
$fab-ios-translucent-background-alpha: 0.9;
/// @prop - Alpha level of the translucent button background on hover
$fab-ios-translucent-background-alpha-hover: 0.8 !default;
$fab-ios-translucent-background-alpha-hover: 0.8;
/// @prop - Alpha level of the translucent button background on focus
$fab-ios-translucent-background-alpha-focused: 0.82 !default;
$fab-ios-translucent-background-alpha-focused: 0.82;

20
core/src/components/fab-button/fab-button.md.vars.scss
View File

@ -5,32 +5,32 @@
/// @prop - Box shadow of the FAB button
$fab-md-box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14),
0 1px 18px 0 rgba(0, 0, 0, 0.12) !default;
0 1px 18px 0 rgba(0, 0, 0, 0.12);
/// @prop - Box shadow of the activated FAB button
$fab-md-box-shadow-activated: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 12px 17px 2px rgba(0, 0, 0, 0.14),
0 5px 22px 4px rgba(0, 0, 0, 0.12) !default;
0 5px 22px 4px rgba(0, 0, 0, 0.12);
/// @prop - Background color of the button
$fab-md-background-color: ion-color(primary, base) !default;
$fab-md-background-color: ion-color(primary, base);
/// @prop - Text color of the button
$fab-md-text-color: ion-color(primary, contrast) !default;
$fab-md-text-color: ion-color(primary, contrast);
/// @prop - Font size of the button icon
$fab-md-icon-font-size: 24px !default;
$fab-md-icon-font-size: 24px;
/// @prop - Background color of the button in a list
$fab-md-list-button-background-color: ion-color(light, base) !default;
$fab-md-list-button-background-color: ion-color(light, base);
/// @prop - Background color of the activated button in a list
$fab-md-list-button-background-color-activated: ion-color(light, shade) !default;
$fab-md-list-button-background-color-activated: ion-color(light, shade);
/// @prop - Background color of the activated button in a list
$fab-md-list-button-background-color-hover: ion-color(light, tint) !default;
$fab-md-list-button-background-color-hover: ion-color(light, tint);
/// @prop - Text color of the button in a list
$fab-md-list-button-text-color: rgba($text-color-rgb, 0.54) !default;
$fab-md-list-button-text-color: rgba($text-color-rgb, 0.54);
/// @prop - Font size of the button icon in a list
$fab-md-list-button-icon-font-size: 18px !default;
$fab-md-list-button-icon-font-size: 18px;

8
core/src/components/fab-button/fab-button.vars.scss
View File

@ -4,13 +4,13 @@
// --------------------------------------------------
/// @prop - Width and height of the FAB button
$fab-size: 56px !default;
$fab-size: 56px;
/// @prop - Width and height of the mini FAB button
$fab-small-size: 40px !default;
$fab-small-size: 40px;
/// @prop - Border radius of the FAB button
$fab-border-radius: 50% !default;
$fab-border-radius: 50%;
/// @prop - Margin applied to the small FAB button
$fab-button-small-margin: 8px !default;
$fab-button-small-margin: 8px;