Skip to content

chore(theming): remove Sass default flags #29401

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Apr 25, 2024
Merged

chore(theming): remove Sass default flags #29401

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions core/src/components/accordion/accordion.md.vars.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,10 @@
// --------------------------------------------------

/// @prop - Border radius applied to the accordion
$accordion-md-border-radius: 6px !default;
$accordion-md-border-radius: 6px;

/// @prop - Box shadow of the accordion
$accordion-md-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12) !default;
$accordion-md-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);

/// @prop - Margin of the expanded accordion
$accordion-md-expanded-margin: 16px !default;
$accordion-md-expanded-margin: 16px;
10 changes: 5 additions & 5 deletions core/src/components/accordion/accordion.vars.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,16 +4,16 @@
// --------------------------------------------------

/// @prop - Background color of the accordion
$accordion-background-color: var(--ion-background-color, #ffffff) !default;
$accordion-background-color: var(--ion-background-color, #ffffff);

/// @prop - Duration of the accordion transition
$accordion-transition-duration: 300ms !default;
$accordion-transition-duration: 300ms;

/// @prop - Timing function of the accordion transition
$accordion-transition-easing: cubic-bezier(0.25, 0.8, 0.5, 1) !default;
$accordion-transition-easing: cubic-bezier(0.25, 0.8, 0.5, 1);

/// @prop - Opacity of the disabled accordion
$accordion-disabled-opacity: 0.4 !default;
$accordion-disabled-opacity: 0.4;

/// @prop - Margin of the inset accordion
$accordion-inset-margin: 16px !default;
$accordion-inset-margin: 16px;
86 changes: 43 additions & 43 deletions core/src/components/action-sheet/action-sheet.ios.vars.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,145 +4,145 @@
// --------------------------------------------------

/// @prop - Text align of the action sheet
$action-sheet-ios-text-align: center !default;
$action-sheet-ios-text-align: center;

/// @prop - Padding top of the action sheet
$action-sheet-ios-padding-top: 0 !default;
$action-sheet-ios-padding-top: 0;

/// @prop - Padding end of the action sheet
$action-sheet-ios-padding-end: 8px !default;
$action-sheet-ios-padding-end: 8px;

/// @prop - Padding bottom of the action sheet
$action-sheet-ios-padding-bottom: $action-sheet-ios-padding-top !default;
$action-sheet-ios-padding-bottom: $action-sheet-ios-padding-top;

/// @prop - Padding start of the action sheet
$action-sheet-ios-padding-start: $action-sheet-ios-padding-end !default;
$action-sheet-ios-padding-start: $action-sheet-ios-padding-end;

/// @prop - Top margin of the action sheet button group
$action-sheet-ios-group-margin-top: 10px !default;
$action-sheet-ios-group-margin-top: 10px;

/// @prop - Bottom margin of the action sheet button group
$action-sheet-ios-group-margin-bottom: 10px !default;
$action-sheet-ios-group-margin-bottom: 10px;

/// @prop - Background color of the action sheet
$action-sheet-ios-background-color: $overlay-ios-background-color !default;
$action-sheet-ios-background-color: $overlay-ios-background-color;

/// @prop - Border radius of the action sheet
$action-sheet-ios-border-radius: 13px !default;
$action-sheet-ios-border-radius: 13px;


// Action Sheet Title
// --------------------------------------------------

/// @prop - Padding top of the action sheet title
$action-sheet-ios-title-padding-top: 14px !default;
$action-sheet-ios-title-padding-top: 14px;

/// @prop - Padding end of the action sheet title
$action-sheet-ios-title-padding-end: 10px !default;
$action-sheet-ios-title-padding-end: 10px;

/// @prop - Padding bottom of the action sheet title
$action-sheet-ios-title-padding-bottom: 13px !default;
$action-sheet-ios-title-padding-bottom: 13px;

/// @prop - Padding start of the action sheet title
$action-sheet-ios-title-padding-start: $action-sheet-ios-title-padding-end !default;
$action-sheet-ios-title-padding-start: $action-sheet-ios-title-padding-end;

/// @prop - Color of the action sheet title
$action-sheet-ios-title-color: $text-color-step-600 !default;
$action-sheet-ios-title-color: $text-color-step-600;

/// @prop - Font size of the action sheet title
$action-sheet-ios-title-font-size: dynamic-font-min(1, 13px) !default;
$action-sheet-ios-title-font-size: dynamic-font-min(1, 13px);

/// @prop - Font weight of the action sheet title
$action-sheet-ios-title-font-weight: 400 !default;
$action-sheet-ios-title-font-weight: 400;

/// @prop - Font weight of the action sheet title when it has a sub title
$action-sheet-ios-title-with-sub-title-font-weight: 600 !default;
$action-sheet-ios-title-with-sub-title-font-weight: 600;

// Action Sheet Subtitle
// --------------------------------------------------

/// @prop - Font size of the action sheet sub title
$action-sheet-ios-sub-title-font-size: dynamic-font-min(1, 13px) !default;
$action-sheet-ios-sub-title-font-size: dynamic-font-min(1, 13px);

/// @prop - Padding top of the action sheet sub title
$action-sheet-ios-sub-title-padding-top: 6px !default;
$action-sheet-ios-sub-title-padding-top: 6px;

/// @prop - Padding end of the action sheet sub title
$action-sheet-ios-sub-title-padding-end: 0 !default;
$action-sheet-ios-sub-title-padding-end: 0;

/// @prop - Padding bottom of the action sheet sub title
$action-sheet-ios-sub-title-padding-bottom: 0 !default;
$action-sheet-ios-sub-title-padding-bottom: 0;

/// @prop - Padding start of the action sheet sub title
$action-sheet-ios-sub-title-padding-start: $action-sheet-ios-sub-title-padding-end !default;
$action-sheet-ios-sub-title-padding-start: $action-sheet-ios-sub-title-padding-end;


// Action Sheet Button
// --------------------------------------------------

/// @prop - Minimum height of the action sheet button
$action-sheet-ios-button-height: 56px !default;
$action-sheet-ios-button-height: 56px;

/// @prop - Padding of the action sheet button
$action-sheet-ios-button-padding: 14px !default;
$action-sheet-ios-button-padding: 14px;

/// @prop - Text color of the action sheet button
$action-sheet-ios-button-text-color: ion-color(primary, base) !default;
$action-sheet-ios-button-text-color: ion-color(primary, base);

/// @prop - Font size of the action sheet button icon
$action-sheet-ios-button-icon-font-size: dynamic-font-min(1, 28px) !default;
$action-sheet-ios-button-icon-font-size: dynamic-font-min(1, 28px);

/// @prop - Padding right of the action sheet button icon
$action-sheet-ios-button-icon-padding-right: .3em !default;
$action-sheet-ios-button-icon-padding-right: .3em;

/// @prop - Font size of the action sheet button
$action-sheet-ios-button-font-size: dynamic-font-min(1, 20px) !default;
$action-sheet-ios-button-font-size: dynamic-font-min(1, 20px);

/// @prop - Border color alpha of the action sheet button
$action-sheet-ios-button-border-color-alpha: .08 !default;
$action-sheet-ios-button-border-color-alpha: .08;

/// @prop - Border color of the action sheet button
$action-sheet-ios-button-border-color: rgba($text-color-rgb, $action-sheet-ios-button-border-color-alpha) !default;
$action-sheet-ios-button-border-color: rgba($text-color-rgb, $action-sheet-ios-button-border-color-alpha);

/// @prop - Background color of the action sheet button
$action-sheet-ios-button-background: linear-gradient(0deg, $action-sheet-ios-button-border-color, $action-sheet-ios-button-border-color 50%, transparent 50%) bottom / 100% 1px no-repeat transparent !default;
$action-sheet-ios-button-background: linear-gradient(0deg, $action-sheet-ios-button-border-color, $action-sheet-ios-button-border-color 50%, transparent 50%) bottom / 100% 1px no-repeat transparent;

/// @prop - Background color of the activated action sheet button
$action-sheet-ios-button-background-activated: $text-color !default;
$action-sheet-ios-button-background-activated: $text-color;

/// @prop - Background color of the selected action sheet button
$action-sheet-ios-button-background-selected: var(--ion-color-step-150, var(--ion-background-color-step-150, $background-color)) !default;
$action-sheet-ios-button-background-selected: var(--ion-color-step-150, var(--ion-background-color-step-150, $background-color));

/// @prop - Destructive text color of the action sheet button
$action-sheet-ios-button-destructive-text-color: ion-color(danger, base) !default;
$action-sheet-ios-button-destructive-text-color: ion-color(danger, base);

/// @prop - Font weight of the action sheet cancel button
$action-sheet-ios-button-cancel-font-weight: 600 !default;
$action-sheet-ios-button-cancel-font-weight: 600;


// Action Sheet Translucent
// --------------------------------------------------

/// @prop - Background color alpha of the action sheet when translucent
$action-sheet-ios-translucent-background-color-alpha: .8 !default;
$action-sheet-ios-translucent-background-color-alpha: .8;

/// @prop - Background color of the action sheet when translucent
$action-sheet-ios-translucent-background-color: rgba($background-color-rgb, $action-sheet-ios-translucent-background-color-alpha) !default;
$action-sheet-ios-translucent-background-color: rgba($background-color-rgb, $action-sheet-ios-translucent-background-color-alpha);

/// @prop - Border color alpha of the action sheet when translucent
$action-sheet-ios-translucent-border-color-alpha: .4 !default;
$action-sheet-ios-translucent-border-color-alpha: .4;

/// @prop - Border color of the action sheet when translucent
$action-sheet-ios-translucent-border-color: rgba($background-color-rgb, $action-sheet-ios-translucent-border-color-alpha) !default;
$action-sheet-ios-translucent-border-color: rgba($background-color-rgb, $action-sheet-ios-translucent-border-color-alpha);

/// @prop - Background color alpha of the activated action sheet when translucent
$action-sheet-ios-translucent-background-color-activated-alpha: .7 !default;
$action-sheet-ios-translucent-background-color-activated-alpha: .7;

/// @prop - Background color of the activated action sheet when translucent
$action-sheet-ios-translucent-background-color-activated: rgba($background-color-rgb, $action-sheet-ios-translucent-background-color-activated-alpha) !default;
$action-sheet-ios-translucent-background-color-activated: rgba($background-color-rgb, $action-sheet-ios-translucent-background-color-activated-alpha);

/// @prop - Filter of the translucent action-sheet group
$action-sheet-ios-group-translucent-filter: saturate(280%) blur(20px) !default;
$action-sheet-ios-group-translucent-filter: saturate(280%) blur(20px);

/// @prop - Filter of the translucent action-sheet button
$action-sheet-ios-button-translucent-filter: saturate(120%) !default;
$action-sheet-ios-button-translucent-filter: saturate(120%);
56 changes: 28 additions & 28 deletions core/src/components/action-sheet/action-sheet.md.vars.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,100 +4,100 @@
// --------------------------------------------------

/// @prop - Text align of the action sheet
$action-sheet-md-text-align: start !default;
$action-sheet-md-text-align: start;

/// @prop - Background color of the action sheet
$action-sheet-md-background-color: $overlay-md-background-color !default;
$action-sheet-md-background-color: $overlay-md-background-color;

/// @prop - Padding top of the action sheet
$action-sheet-md-padding-top: 0 !default;
$action-sheet-md-padding-top: 0;

/// @prop - Padding bottom of the action sheet
$action-sheet-md-padding-bottom: var(--ion-safe-area-bottom) !default;
$action-sheet-md-padding-bottom: var(--ion-safe-area-bottom);


// Action Sheet Title
// --------------------------------------------------

/// @prop - Height of the action sheet title
$action-sheet-md-title-height: 60px !default;
$action-sheet-md-title-height: 60px;

/// @prop - Color of the action sheet title
$action-sheet-md-title-color: rgba($text-color-rgb, 0.54) !default;
$action-sheet-md-title-color: rgba($text-color-rgb, 0.54);

/// @prop - Font size of the action sheet title
$action-sheet-md-title-font-size: dynamic-font(16px) !default;
$action-sheet-md-title-font-size: dynamic-font(16px);

/// @prop - Padding top of the action sheet title
$action-sheet-md-title-padding-top: 20px !default;
$action-sheet-md-title-padding-top: 20px;

/// @prop - Padding end of the action sheet title
$action-sheet-md-title-padding-end: 16px !default;
$action-sheet-md-title-padding-end: 16px;

/// @prop - Padding bottom of the action sheet title
$action-sheet-md-title-padding-bottom: 17px !default;
$action-sheet-md-title-padding-bottom: 17px;

/// @prop - Padding start of the action sheet title
$action-sheet-md-title-padding-start: $action-sheet-md-title-padding-end !default;
$action-sheet-md-title-padding-start: $action-sheet-md-title-padding-end;


// Action Sheet Subtitle
// --------------------------------------------------

/// @prop - Font size of the action sheet sub title
$action-sheet-md-sub-title-font-size: dynamic-font(14px) !default;
$action-sheet-md-sub-title-font-size: dynamic-font(14px);

/// @prop - Padding top of the action sheet sub title
$action-sheet-md-sub-title-padding-top: 16px !default;
$action-sheet-md-sub-title-padding-top: 16px;

/// @prop - Padding end of the action sheet sub title
$action-sheet-md-sub-title-padding-end: 0 !default;
$action-sheet-md-sub-title-padding-end: 0;

/// @prop - Padding bottom of the action sheet sub title
$action-sheet-md-sub-title-padding-bottom: 0 !default;
$action-sheet-md-sub-title-padding-bottom: 0;

/// @prop - Padding start of the action sheet sub title
$action-sheet-md-sub-title-padding-start: $action-sheet-md-sub-title-padding-end !default;
$action-sheet-md-sub-title-padding-start: $action-sheet-md-sub-title-padding-end;


// Action Sheet Button
// --------------------------------------------------

/// @prop - Minimum height of the action sheet button
$action-sheet-md-button-height: 52px !default;
$action-sheet-md-button-height: 52px;

/// @prop - Text color of the action sheet button
$action-sheet-md-button-text-color: $text-color-step-150 !default;
$action-sheet-md-button-text-color: $text-color-step-150;

/// @prop - Font size of the action sheet button
$action-sheet-md-button-font-size: dynamic-font(16px) !default;
$action-sheet-md-button-font-size: dynamic-font(16px);

/// @prop - Padding top of the action sheet button
$action-sheet-md-button-padding-top: 12px !default;
$action-sheet-md-button-padding-top: 12px;

/// @prop - Padding end of the action sheet button
$action-sheet-md-button-padding-end: 16px !default;
$action-sheet-md-button-padding-end: 16px;

/// @prop - Padding bottom of the action sheet button
$action-sheet-md-button-padding-bottom: $action-sheet-md-button-padding-top !default;
$action-sheet-md-button-padding-bottom: $action-sheet-md-button-padding-top;

/// @prop - Padding start of the action sheet button
$action-sheet-md-button-padding-start: $action-sheet-md-button-padding-end !default;
$action-sheet-md-button-padding-start: $action-sheet-md-button-padding-end;

// Action Sheet Icon
// --------------------------------------------------

/// @prop - Font size of the icon in the action sheet button
$action-sheet-md-icon-font-size: dynamic-font(24px) !default;
$action-sheet-md-icon-font-size: dynamic-font(24px);

/// @prop - Margin top of the icon in the action sheet button
$action-sheet-md-icon-margin-top: 0 !default;
$action-sheet-md-icon-margin-top: 0;

/// @prop - Margin end of the icon in the action sheet button
$action-sheet-md-icon-margin-end: 32px !default;
$action-sheet-md-icon-margin-end: 32px;

/// @prop - Margin bottom of the icon in the action sheet button
$action-sheet-md-icon-margin-bottom: 0 !default;
$action-sheet-md-icon-margin-bottom: 0;

/// @prop - Margin start of the icon in the action sheet button
$action-sheet-md-icon-margin-start: 0 !default;
$action-sheet-md-icon-margin-start: 0;
4 changes: 2 additions & 2 deletions core/src/components/action-sheet/action-sheet.vars.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
// --------------------------------------------------

/// @prop - Width of the action sheet
$action-sheet-width: 100% !default;
$action-sheet-width: 100%;

/// @prop - Maximum width of the action sheet
$action-sheet-max-width: 500px !default;
$action-sheet-max-width: 500px;
Loading
Loading