@import "../../../themes/ionic.globals.md";

// Material Design Action Sheet
// --------------------------------------------------

/// @prop - Text align of the action sheet
$action-sheet-md-text-align: start !default;

/// @prop - Background color of the action sheet
$action-sheet-md-background: #fafafa !default;

/// @prop - Padding top of the action sheet
$action-sheet-md-padding-top: 8px !default;

/// @prop - Padding bottom of the action sheet
$action-sheet-md-padding-bottom: 8px !default;

/// @prop - Color of the action sheet title
$action-sheet-md-title-color: #757575 !default;

/// @prop - Font size of the action sheet title
$action-sheet-md-title-font-size: 16px !default;

/// @prop - Padding top of the action sheet title
$action-sheet-md-title-padding-top: 11px !default;

/// @prop - Padding end of the action sheet title
$action-sheet-md-title-padding-end: 16px !default;

/// @prop - Padding bottom of the action sheet title
$action-sheet-md-title-padding-bottom: 17px !default;

/// @prop - Padding start of the action sheet title
$action-sheet-md-title-padding-start: $action-sheet-md-title-padding-end !default;

/// @prop - Minimum height of the action sheet button
$action-sheet-md-button-min-height: 48px !default;

/// @prop - Text color of the action sheet button
$action-sheet-md-button-text-color: #222 !default;

/// @prop - Font size of the action sheet button
$action-sheet-md-button-font-size: 16px !default;

/// @prop - Padding top of the action sheet button
$action-sheet-md-button-padding-top: 0 !default;

/// @prop - Padding end of the action sheet button
$action-sheet-md-button-padding-end: 16px !default;

/// @prop - Padding bottom of the action sheet button
$action-sheet-md-button-padding-bottom: $action-sheet-md-button-padding-top !default;

/// @prop - Padding start of the action sheet button
$action-sheet-md-button-padding-start: $action-sheet-md-button-padding-end !default;

/// @prop - Background color of the action sheet button
$action-sheet-md-button-background: transparent !default;

/// @prop - Background color of the action sheet activated button
$action-sheet-md-button-background-activated: #f1f1f1 !default;

/// @prop - Font size of the icon in the action sheet button
$action-sheet-md-icon-font-size: 24px !default;

/// @prop - Width of the icon in the action sheet button
$action-sheet-md-icon-width: 23px !default;

/// @prop - Text align of the icon in the action sheet button
$action-sheet-md-icon-text-align: center !default;

/// @prop - Vertical align of the icon in the action sheet button
$action-sheet-md-icon-vertical-align: middle !default;

/// @prop - Margin top of the icon in the action sheet button
$action-sheet-md-icon-margin-top: 0 !default;

/// @prop - Margin end of the icon in the action sheet button
$action-sheet-md-icon-margin-end: 32px !default;

/// @prop - Margin bottom of the icon in the action sheet button
$action-sheet-md-icon-margin-bottom: 0 !default;

/// @prop - Margin start of the icon in the action sheet button
$action-sheet-md-icon-margin-start: 0 !default;

.action-sheet-md .action-sheet-title {
  font-size: $action-sheet-md-title-font-size;
  color: $action-sheet-md-title-color;
  @include text-align($action-sheet-md-text-align);
  @include padding($action-sheet-md-title-padding-top, $action-sheet-md-title-padding-end, $action-sheet-md-title-padding-bottom, $action-sheet-md-title-padding-start);
  
  // 源文件没对此处理
  .action-sheet-sub-title {
    max-width: 90%;
    margin-top: 2%;
    margin-right: auto;
    margin-left: 0;
    font-size: 77%;
    line-height: 130%;
  }
}

.action-sheet-md .action-sheet-button {
  position: relative;
  min-height: $action-sheet-md-button-min-height;
  overflow: hidden;
  font-size: $action-sheet-md-button-font-size;
  color: $action-sheet-md-button-text-color;
  background: $action-sheet-md-button-background;
  
  @include text-align($action-sheet-md-text-align);
  @include padding($action-sheet-md-button-padding-top, $action-sheet-md-button-padding-end, $action-sheet-md-button-padding-bottom, $action-sheet-md-button-padding-start);
}

.action-sheet-md .action-sheet-button:active {
  background: $action-sheet-md-button-background-activated;
}

.action-sheet-md .action-sheet-icon {
  width: $action-sheet-md-icon-width;
  font-size: $action-sheet-md-icon-font-size;
  vertical-align: $action-sheet-md-icon-vertical-align;
  
  @include padding(0);
  @include text-align($action-sheet-md-icon-text-align);
  @include margin($action-sheet-md-icon-margin-top, $action-sheet-md-icon-margin-end, $action-sheet-md-icon-margin-bottom, $action-sheet-md-icon-margin-start);
}

.action-sheet-md .action-sheet-group {
  background: $action-sheet-md-background;
}

.action-sheet-md .action-sheet-group:first-child {
  @include padding($action-sheet-md-padding-top, null, null, null);
}

.action-sheet-md .action-sheet-group:last-child {
  @include padding(null, null, $action-sheet-md-padding-bottom, null);
}

.action-sheet-md .action-sheet-group .button-inner {
  justify-content: flex-start;
}

.action-sheet-md .action-sheet-selected {
  font-weight: bold;
}
