UNPKG

3.81 kBtext/lessView Raw
1@import (reference) './imports/global';
2
3@dialog1-zindex: 2600; // to be above aui-blanket, but below dropdown1 and datepicker components
4
5.aui-dialog-shadow-parent {
6 position: fixed;
7 overflow: hidden;
8 left:50%;
9 top:50%;
10}
11.aui-popup {
12 background-color: @aui-dialog-bg-color;
13 left: 50%;
14 position: fixed;
15 top: 50%;
16 z-index: @dialog1-zindex;
17}
18.aui-dialog {
19 #aui.shadow.z300();
20 background: @aui-dialog-bg-color;
21 border: 1px solid @aui-dialog-border-color;
22 border-radius: @aui-border-radius-medium;
23 overflow: hidden;
24}
25.aui-dialog .dialog-blanket {
26 position: absolute;
27 top: 0;
28 left: 0;
29 opacity: 0.2;
30 background: @aui-blanket-bg-color;
31}
32
33/* dialog header styles */
34.aui-dialog .dialog-title {
35 #aui-dialog.aui-dialog-header-base();
36 margin: 0;
37 overflow: hidden;
38 position: relative;
39 text-overflow: ellipsis;
40 white-space: nowrap;
41}
42.aui-dialog h2.dialog-title {
43 #aui.typography.h600();
44 color: @aui-text-color;
45}
46
47/* dialog navigation styles */
48.aui-dialog .dialog-page-menu {
49 background: @aui-dialog-bg-color;
50 border-right: 1px solid @aui-dialog-border-color;
51 box-sizing: border-box;
52 float: left;
53 height: 100%;
54 list-style: none;
55 margin: 0;
56 overflow-x: hidden;
57 overflow-y: auto;
58 padding: 10px 10px 20px 10px;
59 width: 25%;
60}
61.aui-dialog .dialog-page-menu li.page-menu-item {
62 display: flex; // so that width: 100% will be constrained by this element.
63 margin: 0;
64 padding: 0;
65}
66.aui-dialog .dialog-page-menu li.page-menu-item button.item-button {
67 #aui-nav.item-base();
68 #aui-nav.item-style(normal);
69 background: none;
70 border: 0;
71 cursor: pointer;
72 font-family: inherit;
73 font-size: inherit;
74 text-align: left;
75 text-decoration: none;
76 width: 100%;
77}
78.aui-dialog .dialog-page-menu li.page-menu-item button.item-button:hover,
79.aui-dialog .dialog-page-menu li.page-menu-item button.item-button:focus {
80 #aui-nav.item-style(hover)
81}
82.aui-dialog .dialog-page-menu li.page-menu-item.selected button.item-button {
83 #aui-nav.item-style(selected);
84}
85.aui-dialog .dialog-page-menu li.page-menu-item button.item-button:active,
86.aui-dialog .dialog-page-menu li.page-menu-item.selected button.item-button:active {
87 #aui-nav.item-style(active);
88}
89
90/* dialog body content styles */
91.aui-dialog .dialog-page-body {
92 background: @aui-dialog-bg-color;
93}
94
95.aui-dialog .dialog-panel-body {
96 box-sizing: border-box;
97 overflow: auto;
98 padding: 20px;
99}
100.aui-dialog .dialog-panel-body > *:first-child {
101 margin-top: 0;
102}
103
104/* dialog button panel styles */
105.aui-dialog .dialog-button-panel {
106 #aui-dialog.aui-dialog-footer-base();
107 clear: both;
108 overflow: hidden;
109 text-align: right;
110 width: 100%;
111}
112.aui-dialog .dialog-button-panel button.button-panel-button {
113 #aui.box-sizing();
114 #aui-buttons.aui-button-base();
115 #aui-buttons.aui-button-style(normal);
116 line-height: 20px;
117 padding: 4px 10px;
118 vertical-align: baseline;
119
120 &:hover,
121 &:focus {
122 #aui-buttons.aui-button-style(hover);
123 }
124
125 &:active {
126 #aui-buttons.aui-button-style(active);
127 }
128}
129
130.aui-dialog .dialog-button-panel a.button-panel-link {
131 #aui-buttons.aui-link-button-style(normal);
132 display: inline-block;
133 padding: 5px 0;
134
135 &:focus,
136 &:hover {
137 #aui-buttons.aui-link-button-style(hover);
138 }
139
140 &:active {
141 #aui-buttons.aui-link-button-style(active);
142 }
143}
144
145.aui-dialog .dialog-button-panel button.button-panel-button,
146.aui-dialog .dialog-button-panel a.button-panel-link {
147 margin: 0 10px 0 0;
148}
149.aui-dialog .dialog-button-panel button.button-panel-button.left,
150.aui-dialog .dialog-button-panel a.button-panel-link.left {
151 float: left;
152 margin: 0 0 0 10px;
153}