Browse Source

fix(prejoin): dialout popup buttons

j8
Vlad Piersec 4 years ago
parent
commit
ea2ea89ef7
2 changed files with 66 additions and 61 deletions
  1. 5
    0
      css/_prejoin-dialog.scss
  2. 61
    61
      css/_premeeting-screens.scss

+ 5
- 0
css/_prejoin-dialog.scss View File

@@ -96,6 +96,11 @@
96 96
             padding: 0 8px;
97 97
         }
98 98
     }
99
+
100
+    .prejoin-dialog-btn.primary,
101
+    .action-btn.prejoin-dialog-btn.text {
102
+        width: 310px;
103
+    }
99 104
 }
100 105
 
101 106
 .prejoin-dialog-callout {

+ 61
- 61
css/_premeeting-screens.scss View File

@@ -1,7 +1,7 @@
1 1
 /**
2 2
  * Shared style for full screen local track based dialogs/modals.
3 3
  */
4
- .premeeting-screen {
4
+.premeeting-screen {
5 5
     align-items: stretch;
6 6
     background: #1C2025;
7 7
     bottom: 0;
@@ -14,6 +14,66 @@
14 14
     top: 0;
15 15
     z-index: $toolbarZ + 1;
16 16
 
17
+    .action-btn {
18
+        border-radius: 3px;
19
+        color: #fff;
20
+        cursor: pointer;
21
+        display: inline-block;
22
+        font-size: 15px;
23
+        line-height: 24px;
24
+        margin-top: 16px;
25
+        padding: 7px 16px;
26
+        position: relative;
27
+        text-align: center;
28
+        width: 286px;
29
+
30
+        &.primary {
31
+            background: #0376DA;
32
+            border: 1px solid #0376DA;
33
+        }
34
+
35
+        &.secondary {
36
+            background: transparent;
37
+            border: 1px solid #5E6D7A;
38
+        }
39
+
40
+        &.text {
41
+            width: auto;
42
+            font-size: 13px;
43
+            margin: 0;
44
+            padding: 0;
45
+        }
46
+
47
+        &.disabled {
48
+            background: #5E6D7A;
49
+            border: 1px solid #5E6D7A;
50
+            color: #AFB6BC;
51
+            cursor: initial;
52
+
53
+            .icon {
54
+                & > svg {
55
+                    fill: #AFB6BC;
56
+                }
57
+            }
58
+
59
+            .options {
60
+                border-left: 1px solid #AFB6BC;
61
+            }
62
+        }
63
+
64
+        .options {
65
+            align-items: center;
66
+            border-left: 1px solid #fff;
67
+            display: flex;
68
+            height: 100%;
69
+            justify-content: center;
70
+            position: absolute;
71
+            right: 0;
72
+            top: 0;
73
+            width: 40px;
74
+        }
75
+    }
76
+
17 77
     .content {
18 78
         align-items: center;
19 79
         background-image: linear-gradient(transparent, black);
@@ -97,66 +157,6 @@
97 157
                 color: $defaultWarningColor;
98 158
             }
99 159
         }
100
-
101
-        .action-btn {
102
-            border-radius: 3px;
103
-            color: #fff;
104
-            cursor: pointer;
105
-            display: inline-block;
106
-            font-size: 15px;
107
-            line-height: 24px;
108
-            margin-top: 16px;
109
-            padding: 7px 16px;
110
-            position: relative;
111
-            text-align: center;
112
-            width: 286px;
113
-
114
-            &.primary {
115
-                background: #0376DA;
116
-                border: 1px solid #0376DA;
117
-            }
118
-
119
-            &.secondary {
120
-                background: transparent;
121
-                border: 1px solid #5E6D7A;
122
-            }
123
-
124
-            &.text {
125
-                width: auto;
126
-                font-size: 13px;
127
-                margin: 0;
128
-                padding: 0;
129
-            }
130
-
131
-            &.disabled {
132
-                background: #5E6D7A;
133
-                border: 1px solid #5E6D7A;
134
-                color: #AFB6BC;
135
-                cursor: initial;
136
-
137
-                .icon {
138
-                    & > svg {
139
-                        fill: #AFB6BC;
140
-                    }
141
-                }
142
-
143
-                .options {
144
-                    border-left: 1px solid #AFB6BC;
145
-                }
146
-            }
147
-
148
-            .options {
149
-                align-items: center;
150
-                border-left: 1px solid #fff;
151
-                display: flex;
152
-                height: 100%;
153
-                justify-content: center;
154
-                position: absolute;
155
-                right: 0;
156
-                top: 0;
157
-                width: 40px;
158
-            }
159
-        }
160 160
     }
161 161
 
162 162
     .media-btn-container {

Loading…
Cancel
Save