DevExtreme/packages/devextreme-scss/scss/widgets/fluent/popup/_index.scss at 3d2a9952f09476cc7ddaae3a63c029d0caaaa9f0 · VasilyStrelyaev/DevExtreme · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
@use "sass:color";
@use "colors" as *;
@use "../colors" as *;
@use "sizes" as *;
@use "../sizes" as *;
@use "../../base/icon_fonts" as *;
@use "../overlay/colors" as *;
@use "../toolbar/mixins" as *;
@use "../toolbar/sizes" as *;
@use "../typography/sizes" as *;
@use "../../base/popup";

// adduse
@use "../overlay";

$fluent-popup-toolbar-label-font-size: $fluent-m-font-size;

.dx-popup-wrapper {
  & > .dx-overlay-content {
    background: $overlay-content-bg;
    box-shadow: $fluent-popup-content-shadow;
    border-radius: $popup-border-radius;
  }

  & > .dx-popup-fullscreen {
    border-radius: 0;
  }

  .dx-state-focused {
    &.dx-overlay-content {
      box-shadow: $fluent-popup-focused-content-shadow;
    }
  }
}

.dx-popup-title {
  position: relative;
  min-height: 28px;
  border-bottom: 1px solid $popup-title-border-color;
  background: $popup-title-bg;
  color: $popup-title-color;

  &.dx-toolbar {
    @include dx-toolbar-sizing(
      $fluent-popup-toolbar-height,
      0 $fluent-popup-toolbar-horizontal-padding,
      $fluent-popup-toolbar-label-font-size,
      $fluent-popup-toolbar-item-spacing
    );

    box-shadow: none;
  }
}

.dx-popup-content {
  padding: $fluent-popup-content-vertical-padding $fluent-popup-content-padding;

  & > .dx-button {
    margin: $fluent-popup-button-margin;
  }
}

.dx-popup-bottom {
  background: $popup-bottom-bg;
  color: $popup-bottom-color;

  &.dx-toolbar {
    @include dx-toolbar-sizing(
      $fluent-popup-bottom-toolbar-height,
      0 $fluent-popup-content-withtitle-top-padding $fluent-popup-content-withtitle-bottom-padding,
      $fluent-popup-toolbar-label-font-size,
      $fluent-popup-toolbar-item-spacing
    );
  }
}

.dx-popup-content.dx-dialog-content {
  min-width: 220px - 2 * $fluent-popup-content-padding;
  padding: $fluent-popup-content-vertical-padding $fluent-popup-content-padding;
}

.dx-dialog-message {
  padding: 0;
}