3 * Styling for Workspaces module's toolbar tab.
7 * @todo Remove this after https://www.drupal.org/project/drupal/issues/2986056
10 .workspaces-dialog #drupal-off-canvas * {
13 .workspaces-dialog #drupal-off-canvas {
18 .toolbar .toolbar-bar .workspaces-toolbar-tab {
19 float: right; /* LTR */
20 background-color: #e09600;
22 [dir="rtl"] .toolbar .toolbar-bar .workspaces-toolbar-tab {
25 .toolbar .toolbar-bar .workspaces-toolbar-tab--is-default {
26 background-color: #81c071;
29 .toolbar .toolbar-bar .workspaces-toolbar-tab .toolbar-item {
34 .toolbar .toolbar-icon-workspace:before {
35 background-image: url("../icons/000000/workspaces.svg");
38 /* Off canvas dialog */
39 .workspaces-dialog.ui-dialog-off-canvas a:focus {
43 .workspaces-dialog.ui-dialog-off-canvas #drupal-off-canvas,
44 .workspaces-dialog.ui-dialog-off-canvas {
49 .workspaces-dialog.ui-widget.ui-widget-content {
50 height: 100% !important;
53 .workspaces-dialog.ui-dialog-off-canvas .ui-dialog-titlebar {
58 .workspaces-dialog.ui-dialog-off-canvas .ui-dialog-titlebar .ui-button {
63 #drupal-off-canvas .active-workspace {
64 background-color: #444;
66 padding: 20px 40px 0 20px;
72 @media all and (min-width: 767px) {
73 #drupal-off-canvas .active-workspace {
74 padding: 20px 40px 0 40px;
78 #drupal-off-canvas .active-workspace__title {
83 #drupal-off-canvas .active-workspace__label {
90 #drupal-off-canvas .active-workspace__manage {
94 outline-color: currentColor;
97 #drupal-off-canvas .active-workspace__actions {
102 #drupal-off-canvas .active-workspace__button {
104 background-image: linear-gradient(to bottom, #007bc6, #0071b8);
105 border: solid 1px #1e5c90;
108 text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
112 #drupal-off-canvas .active-workspace__button:hover {
113 text-decoration: none;
116 #drupal-off-canvas .all-workspaces {
121 outline-color: currentColor;
124 #drupal-off-canvas .workspaces ul {
128 #drupal-off-canvas .workspaces li {
133 #drupal-off-canvas .workspaces a {
134 background-color: #555;
135 box-sizing: border-box;
136 padding: 20px 0 0 50px;
141 text-decoration: none;
147 #drupal-off-canvas .active-workspace__label:before,
148 #drupal-off-canvas .workspaces__item:before {
149 background: url("../icons/f0a100/ws_icon.svg") center center no-repeat;
150 background-size: 100% auto;
159 #drupal-off-canvas .active-workspace--default .active-workspace__label:before,
160 #drupal-off-canvas .workspaces__item--default:before {
161 background-image: url("../icons/81c071/ws_icon.svg");
164 #drupal-off-canvas .active-workspace__label:before {
170 @media all and (min-width: 767px) {
171 #drupal-off-canvas .active-workspace__label:before {
176 .workspaces-dialog.ui-dialog-off-canvas .ui-dialog-titlebar {
181 .workspaces-dialog.ui-dialog-off-canvas .ui-dialog-titlebar-close {
186 @media all and (max-width: 766px) {
187 .toolbar .toolbar-bar .workspaces-toolbar-tab .toolbar-icon-workspace {
188 padding-left: 2.75em;
189 padding-right: 1.3333em;
195 text-overflow: ellipsis;
198 .toolbar .toolbar-bar .workspaces-toolbar-tab .toolbar-icon-workspace:before {
199 background-size: 100% auto;
205 @media all and (min-width: 767px) {
206 #drupal-off-canvas .active-workspace {
210 width: calc(30% - 80px);
211 padding: 20px 40px 0;
215 #drupal-off-canvas .all-workspaces {
223 .workspaces-dialog.ui-widget.ui-widget-content {
224 height: 161px !important;
227 #drupal-off-canvas .workspaces {
233 #drupal-off-canvas .workspaces ul {
238 #drupal-off-canvas .workspaces li {
242 #drupal-off-canvas .active-workspace__actions {
248 .workspaces-dialog.ui-dialog-off-canvas .ui-dialog-titlebar {
252 .workspaces-dialog.ui-dialog-off-canvas .ui-dialog-titlebar-close,
253 .workspaces-dialog.ui-dialog-off-canvas .ui-dialog-titlebar-close:hover,
254 .workspaces-dialog.ui-dialog-off-canvas .ui-dialog-titlebar-close:focus {
259 /* Make dialog width 100% for workspace mobile viewports. */
260 @media all and (max-width: 48em) {
261 .ui-dialog.workspaces-dialog {