@@ -140,6 +140,7 @@ body[data-appearance='home'] .satus-text--title
1401403.0 Folder
1411414.0 Button
1421425.0 Switch
143+ 6.0 Encryption
143144--------------------------------------------------------------*/
144145
145146/*--------------------------------------------------------------
@@ -159,7 +160,7 @@ body[data-appearance='home'] .satus-text--title
159160.satus-section--main
160161{
161162 display : block;
162-
163+
163164 box-sizing : border-box;
164165 width : calc (100% - 16px );
165166 max-width : 900px ;
@@ -169,12 +170,12 @@ body[data-appearance='home'] .satus-text--title
169170 color : var (--satus-theme-on-surface , # 777 );
170171 border : 1px solid rgba (0 , 0 , 0 , .1 );
171172 border-radius : 8px ;
172- background-color : var (--satus-theme-surface , # fff );
173+ background-color : var (--satus-theme-surface , # fff );
173174}
174175
175176.satus-text--message
176177{
177- padding : 0 16px
178+ padding : 0 16px ;
178179}
179180
180181.satus-main .satus-list--label
@@ -211,7 +212,7 @@ body[data-appearance='home'] .satus-text--title
211212 width : 100% ;
212213}
213214
214- .satus-main .satus-button .satus-button--remove
215+ .satus-main .satus-button .satus-button--menu
215216{
216217 position : absolute;
217218 z-index : 1 ;
@@ -220,14 +221,22 @@ body[data-appearance='home'] .satus-text--title
220221
221222 visibility : hidden;
222223
223- width : 36 px ;
224- height : 36 px ;
224+ width : 34 px ;
225+ height : 34 px ;
225226 padding : 6px ;
226-
227- border-radius : 50%
227+
228+ border-radius : 50% ;
229+ }
230+
231+ .satus-dialog--menu .satus-button
232+ {
233+ width : 100% ;
234+ height : 36px ;
235+ padding : 0 16px ;
236+ text-align : left;
228237}
229238
230- .satus-main__container .satus-list li .satus-section : hover .satus-button--remove
239+ .satus-main__container .satus-list li .satus-section : hover .satus-button--menu
231240{
232241 visibility : visible;
233242}
@@ -260,7 +269,7 @@ body[data-appearance='home'] .satus-text--title
2602694.0 BUTTON
261270--------------------------------------------------------------*/
262271
263- .satus-main .satus-button : not (.satus-button--remove )
272+ .satus-main .satus-button : not (.satus-button--menu )
264273{
265274 width : 100% ;
266275 height : 48px ;
@@ -286,7 +295,7 @@ body[data-appearance='home'] .satus-text--title
286295
287296.satus-switch--checkbox .satus-switch__value
288297{
289- flex : unset
298+ flex : unset;
290299}
291300
292301.satus-switch--checkbox .satus-switch__track
@@ -348,6 +357,67 @@ body[data-appearance='home'] .satus-text--title
348357 background-color : # f6b465 ;
349358 box-shadow : none;
350359}
360+
361+
362+ /*--------------------------------------------------------------
363+ 6.0 ENCRYPTION
364+ --------------------------------------------------------------*/
365+
366+ .satus-dialog--encryption .satus-text
367+ {
368+ display : block;
369+
370+ width : calc (100% - 32px );
371+ margin : 0 16px ;
372+ }
373+
374+ .satus-dialog--encryption .satus-text-field
375+ {
376+ font-size : 16px ;
377+
378+ width : calc (100% - 32px );
379+ margin : 8px 16px ;
380+ padding : 4px 8px ;
381+
382+ border : 1px solid # e8e8e8 ;
383+ border-radius : 4px ;
384+ background-color : # fff ;
385+ }
386+
387+ .satus-dialog--encryption .satus-text-field .error
388+ {
389+ outline : 2px solid rgba (255 , 0 , 0 , .4 );
390+ }
391+
392+ .satus-dialog--encryption .satus-section
393+ {
394+ width : calc (100% - 32px );
395+ margin : 8px 16px 4px ;
396+ padding : 8px 0 4px ;
397+
398+ border-top : 1px solid # e8e8e8 ;
399+
400+ justify-content : flex-end;
401+ }
402+
403+ .satus-dialog--encryption .satus-button
404+ {
405+ font-size : 14px ;
406+ font-weight : 600 ;
407+
408+ overflow : hidden;
409+
410+ height : 28px ;
411+ min-height : 28px ;
412+ margin-right : 2px ;
413+ padding : 8px 16px ;
414+
415+ letter-spacing : .2px ;
416+ text-transform : uppercase;
417+
418+ color : var (--satus-theme-primary );
419+ border-radius : 4px ;
420+ }
351421
352422/*---------------------------------------------------------------
353423>>> FOOTER
0 commit comments