naive-ui/styles/Dropdown.scss

@import "./mixins/mixins.scss";
@import "./themes/vars.scss";

@include themes-mixin {
  @include b(popover-content) {
    @include b(dropdown-submenu-activator) {
      @include e(arrow) {
        fill: $--dropdown-item-suffix-fill;
      }
    }
    @include once {
      position: relative;
      @include b(dropdown-submenu-activator) {
        display: inline-block;
        display: flex;
        align-items: center;
        justify-content: space-between;
        @include e(arrow) {
          position: relative;
          right: -8px;
        }
      }
      @include b(dropdown-menu) {
        outline: none;
        @include b(base-select-menu) {
          @include m(small-size) {
            @include b(base-select-menu-option-wrapper) {
              padding-top: 4px;
              padding-bottom: 4px;
            }
            @include b(base-select-option) {
              padding: 0 20px;
            }
            @include b(dropdown-divider) {
              margin: 0 0;
            }
            @include b(dropdown-submenu-activator) {
              @include e(arrow) {
                font-size: 16px;
                margin-left: 12px;
              }
            }
          }
          @include m(medium-size) {
            @include b(base-select-menu-option-wrapper) {
              padding-top: 4px;
              padding-bottom: 4px;
            }
            @include b(base-select-option) {
              padding: 0 20px;
            }
            @include b(dropdown-divider) {
              margin: 0 0;
            }
            @include b(dropdown-submenu-activator) {
              @include e(arrow) {
                font-size: 16px;
                margin-left: 16px;
              }
            }
          }
          @include m(large-size) {
            @include b(base-select-menu-option-wrapper) {
              padding-top: 6px;
              padding-bottom: 6px;
            }
            @include b(base-select-option) {
              padding: 0 24px;
            }
            @include b(dropdown-divider) {
              margin: 2px 0;
            }
            @include b(dropdown-submenu-activator) {
              @include e(arrow) {
                font-size: 16px;
                margin-left: 20px;
              }
            }
          }
          @include m(huge-size) {
            @include b(base-select-menu-option-wrapper) {
              padding-top: 8px;
              padding-bottom: 8px;
            }
            @include b(base-select-option) {
              padding: 0 24px;
            }
            @include b(dropdown-submenu-activator) {
              @include e(arrow) {
                font-size: 16px;
                margin-left: 20px;
              }
            }
          }
        }
      }
      @include b(dropdown-divider) {
        margin: 2px 0;
      }
      @include b(dropdown-submenu) {
        @include fade-in-scale-up-transition();
        margin-top: 0;
        position: absolute !important;
        margin-left: 6px;
        margin-right: 6px;
      }
    }
  }
}