1/* Login Dialog */
2
3.login-dialog-banner-view {
4  padding-top: 24px;
5  max-width: 23em;
6}
7
8.login-dialog,
9.unlock-dialog {
10  //reset
11  border: none;
12  background-color: transparent;
13
14  $_gdm_bg: $base_color; // Yaru change: use $base_color for dark/light theme switch
15
16  /* StEntry { // Yaru change: don't overwrite entry style on dark theme
17    @if $variant=='dark' {
18      $_gdm_entry_bg: darken($system_bg_color, 3%);
19      background-color: $_gdm_entry_bg;
20      color: $fg_color;
21    }
22  } */
23
24  .modal-dialog-button-box { spacing: 3px; }
25  .modal-dialog-button {
26    padding: 4px 18px;
27    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
28    background-color: $_gdm_bg; // Yaru change: use $_gdm_bg
29    border-color: $borders_color; // Yaru change: use $borders_color
30    color: $fg_color; // Yaru change: use $fg_color for dark/light theme
31
32    $_hover_c: if($variant == 'light', darken($_gdm_bg, 15%), lighten($_gdm_bg, 5%)); // Yaru change: use $_gdm_bg and modify light theme background
33
34    // &:hover, &:focus { // Yaru: no need to change background on focus thanks to focus ring
35    &:hover {
36      background-color: $_hover_c;
37      // border-color: $_hover_c; // Yaru: don't overwrite border on hover
38    }
39    &:focus { // Yaru: add focus ring
40      border-color: $focus_border_color;
41      box-shadow: inset 0 0 0 1px $focus_border_color;
42    }
43    &:active {
44      $_active_c: if($variant == 'light', darken($_gdm_bg, 25%), darken($_gdm_bg, 5%)); // Yaru: adapt active color
45      box-shadow: none;
46      background-color: $_active_c;
47      border-color: $_active_c;
48    }
49    &:insensitive {
50      @include button(insensitive);
51      border-color: $insensitive_bg_color; // Yaru: use same style as entries
52      // background-color: darken($_gdm_bg, 5%); // Yaru: use same style as entries
53      color: $insensitive_fg_color;  // Yaru: use same style as entries
54    }
55    &:default { // Yaru: our suggested action color is green
56      @include button(normal, $c:$suggested_bg_color, $tc:$selected_fg_color);
57      border-color: $suggested_bg_color;
58      &:hover, &:focus {
59        @include button(hover,$c:$suggested_bg_color, $tc:$selected_fg_color);
60        $_def_hover_c: lighten($suggested_bg_color, 5%);
61        background-color: $_def_hover_c;
62        border-color: $_def_hover_c;
63      }
64      &:active {
65        @include button(active,$c:$suggested_bg_color, $tc:$selected_fg_color);
66        $_def_active_c: darken($suggested_bg_color, 5%);
67        background-color: $_def_active_c;
68        border-color: $_def_active_c;
69      }
70      &:insensitive {
71        @include button(insensitive);
72        border-color: darken($suggested_bg_color, 10%);
73        background-color: darken($suggested_bg_color, 10%);
74        color: transparentize($selected_fg_color, 0.3);
75      }
76    }
77  }
78
79  .cancel-button,
80  .switch-user-button,
81  .login-dialog-session-list-button {
82    padding: 0;
83    border-radius: 99px;
84    width: $base_icon_size * 2;
85    height: $base_icon_size * 2;
86    // border-color: $borders_color; // Yaru change: don't overwrite button look
87    // background-color: darken($_gdm_bg, 3%); // Yaru change: don't overwrite button look
88
89    StIcon { icon-size: $base_icon_size; }
90  }
91
92  .caps-lock-warning-label,
93  .login-dialog-message { // Yaru: we want all login messages to use OSD fg color
94    color: $osd_fg_color;
95  }
96}
97
98.login-dialog-logo-bin { padding: 24px 0px; }
99.login-dialog-banner { color: darken($osd_fg_color,10%); }
100.login-dialog-button-box { width: 23em; spacing: 5px; }
101.login-dialog-message { text-align: center; }
102.login-dialog-user-selection-box { padding: 100px 0px; }
103.login-dialog-not-listed-label {
104  padding-left: 2px;
105  .login-dialog-not-listed-button:focus &,
106  .login-dialog-not-listed-button:hover & {
107    color: $osd_fg_color;
108  }
109}
110
111.login-dialog-not-listed-label {
112  @include fontsize($base_font_size - 1);
113  font-weight: bold;
114  color: darken($osd_fg_color,30%);
115  padding-top: 1em;
116}
117
118.login-dialog-user-list-view { -st-vfade-offset: 1em; }
119.login-dialog-user-list { // Yaru: we want the gray hover to work on GDM, thus the transparentized fg color
120  spacing: 12px;
121  width: 23em;
122  &:expanded .login-dialog-user-list-item:selected { background-color: transparentize($selected_fg_color, 0.9); color: $selected_fg_color; }
123  &:expanded .login-dialog-user-list-item:logged-in { border-right: 2px solid transparentize($selected_fg_color, 0.9); }
124}
125
126.login-dialog-user-list-item {
127  border-radius: $base_border_radius + 4px;
128  padding: 6px;
129  color: darken($osd_fg_color,30%);
130  &:ltr .user-widget { padding-right: 1em; }
131  &:rtl .user-widget { padding-left: 1em; }
132  .login-dialog-timed-login-indicator {
133    height: 2px;
134    margin-top: 6px;
135    background-color: $osd_fg_color;
136  }
137  &:focus .login-dialog-timed-login-indicator { background-color: $selected_fg_color; }
138}
139
140.user-widget-label {
141  color: $osd_fg_color;
142}
143
144.user-widget.horizontal .user-widget-label {
145  @include fontsize($base_font_size + 2);
146  font-weight: bold;
147  padding-left: 15px;
148
149  &:ltr { padding-left: 14px; text-align: left; }
150  &:rtl { padding-right: 14px; text-align: right; }
151}
152
153.user-widget.vertical .user-widget-label {
154  @include fontsize($base_font_size + 5);
155  text-align: center;
156  font-weight: normal;
157  padding-top: 16px;
158}
159
160.login-dialog-timed-login-indicator {
161  height: 2px;
162  background-color: darken($fg_color, 40%);
163}
164
165.login-dialog-prompt-layout {
166  padding-top: 24px;
167  padding-bottom: 12px;
168  spacing: $base_spacing * 2;
169  width: 23em;
170}
171
172.login-dialog-prompt-entry {
173  height: 1.5em;
174}
175
176.login-dialog-prompt-label {
177  color: darken($osd_fg_color, 20%);
178  @include fontsize($base_font_size + 1);
179  padding-top: 1em;
180}
181