Skip to content

Commit e3631ed

Browse files
MrYuionMrYuion
committed
chore(workplace): styling tweaks
1 parent 79968ff commit e3631ed

1 file changed

Lines changed: 18 additions & 30 deletions

File tree

‎apps/workplace/src/app/components/footer-menu.component.ts‎

Lines changed: 18 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -13,20 +13,20 @@ import { IconComponent, TranslatePipe } from '@placeos/components';
1313
template: `
1414
@if (show_book_items() && features().length > 1) {
1515
<div
16-
class="fixed inset-0 bottom-16 z-30"
16+
class="border-base-100 fixed inset-0 bottom-16 z-30 border-t"
1717
[attr.dark]="dark_mode()"
1818
(click)="show_book_items.set(false); blur_backdrop.set(false)"
1919
>
2020
<div
21-
class="border-base-200 bg-base-100 absolute inset-x-0 bottom-0 grid max-h-[60vh] grid-cols-2 gap-4 overflow-y-auto rounded-t-xl border-t p-4"
21+
class="border-base-100 bg-base-100 absolute inset-x-0 bottom-0 grid max-h-[60vh] grid-cols-2 gap-4 overflow-y-auto rounded-t-xl border-t p-4"
2222
>
2323
@if (features().includes('spaces')) {
2424
<a
2525
name="footer-nav-meeting"
2626
matRipple
2727
[routerLink]="['/book', 'meeting']"
2828
routerLinkActive="active"
29-
class="bg-base-200 flex flex-col items-center justify-center space-y-4 rounded-xl px-4 py-8"
29+
class="bg-base-200 flex flex-col items-center justify-center gap-2 rounded-xl p-4"
3030
>
3131
<icon class="text-secondary text-6xl"
3232
>meeting_room</icon
@@ -42,7 +42,7 @@ import { IconComponent, TranslatePipe } from '@placeos/components';
4242
name="footer-nav-desks"
4343
[routerLink]="['/book', 'desk']"
4444
routerLinkActive="active"
45-
class="bg-base-200 flex flex-col items-center justify-center space-y-4 rounded-xl px-4 py-8"
45+
class="bg-base-200 flex flex-col items-center justify-center gap-2 rounded-xl p-4"
4646
>
4747
<icon class="text-secondary text-6xl">desk</icon>
4848
<div>
@@ -56,7 +56,7 @@ import { IconComponent, TranslatePipe } from '@placeos/components';
5656
name="footer-nav-parking"
5757
[routerLink]="['/book', 'parking']"
5858
routerLinkActive="active"
59-
class="bg-base-200 flex flex-col items-center justify-center space-y-4 rounded-xl px-4 py-8"
59+
class="bg-base-200 flex flex-col items-center justify-center gap-2 rounded-xl p-4"
6060
>
6161
<icon class="text-secondary text-6xl"
6262
>directions_car</icon
@@ -72,7 +72,7 @@ import { IconComponent, TranslatePipe } from '@placeos/components';
7272
name="footer-nav-parking-requests"
7373
[routerLink]="['/book', 'parking-request']"
7474
routerLinkActive="active"
75-
class="bg-base-200 flex flex-col items-center justify-center space-y-4 rounded-xl px-4 py-8"
75+
class="bg-base-200 flex flex-col items-center justify-center gap-2 rounded-xl p-4"
7676
>
7777
<icon class="text-secondary text-6xl"
7878
>local_parking</icon
@@ -91,7 +91,7 @@ import { IconComponent, TranslatePipe } from '@placeos/components';
9191
name="footer-nav-visitor-invite"
9292
[routerLink]="['/book', 'visitor']"
9393
routerLinkActive="active"
94-
class="bg-base-200 flex flex-col items-center justify-center space-y-4 rounded-xl px-4 py-8"
94+
class="bg-base-200 flex flex-col items-center justify-center gap-2 rounded-xl p-4"
9595
>
9696
<icon class="text-secondary text-6xl">person</icon>
9797
<div>
@@ -105,7 +105,7 @@ import { IconComponent, TranslatePipe } from '@placeos/components';
105105
name="footer-nav-my-day"
106106
[routerLink]="['/your-bookings']"
107107
routerLinkActive="active"
108-
class="bg-base-200 flex flex-col items-center justify-center space-y-4 rounded-xl px-4 py-8"
108+
class="bg-base-200 flex flex-col items-center justify-center gap-2 rounded-xl p-4"
109109
>
110110
<icon class="text-secondary text-6xl">event</icon>
111111
<div>
@@ -119,7 +119,7 @@ import { IconComponent, TranslatePipe } from '@placeos/components';
119119
name="footer-nav-group-events"
120120
[routerLink]="['/group-events']"
121121
routerLinkActive="active"
122-
class="bg-base-200 flex flex-col items-center justify-center space-y-4 rounded-xl px-4 py-8"
122+
class="bg-base-200 flex flex-col items-center justify-center gap-2 rounded-xl p-4"
123123
>
124124
<icon class="text-secondary text-6xl"
125125
>local_activity</icon
@@ -135,7 +135,7 @@ import { IconComponent, TranslatePipe } from '@placeos/components';
135135
name="footer-nav-lockers"
136136
[routerLink]="['/book', 'locker']"
137137
routerLinkActive="active"
138-
class="bg-base-200 flex flex-col items-center justify-center space-y-4 rounded-xl px-4 py-8"
138+
class="bg-base-200 flex flex-col items-center justify-center gap-2 rounded-xl p-4"
139139
>
140140
<icon class="text-secondary text-6xl">lock</icon>
141141
<div>
@@ -149,7 +149,7 @@ import { IconComponent, TranslatePipe } from '@placeos/components';
149149
name="footer-nav-control"
150150
[routerLink]="['/control']"
151151
routerLinkActive="active"
152-
class="bg-base-200 flex flex-col items-center justify-center space-y-4 rounded-xl px-4 py-8"
152+
class="bg-base-200 flex flex-col items-center justify-center gap-2 rounded-xl p-4"
153153
>
154154
<icon class="text-secondary text-6xl"
155155
>remote_gen</icon
@@ -165,7 +165,7 @@ import { IconComponent, TranslatePipe } from '@placeos/components';
165165
name="footer-nav-deals"
166166
[routerLink]="['/deals-n-offers']"
167167
routerLinkActive="active"
168-
class="bg-base-200 flex flex-col items-center justify-center space-y-4 rounded-xl px-4 py-8"
168+
class="bg-base-200 flex flex-col items-center justify-center gap-2 rounded-xl p-4"
169169
>
170170
<icon class="text-secondary text-6xl"
171171
>confirmation_number</icon
@@ -181,7 +181,7 @@ import { IconComponent, TranslatePipe } from '@placeos/components';
181181
name="footer-nav-team-schedule"
182182
[routerLink]="['/team-schedule']"
183183
routerLinkActive="active"
184-
class="bg-base-200 flex flex-col items-center justify-center space-y-4 rounded-xl px-4 py-8"
184+
class="bg-base-200 flex flex-col items-center justify-center gap-2 rounded-xl p-4"
185185
>
186186
<icon class="text-secondary text-6xl">groups</icon>
187187
<div>
@@ -197,15 +197,15 @@ import { IconComponent, TranslatePipe } from '@placeos/components';
197197
}
198198
@if (features().length > 1) {
199199
<div
200-
class="border-base-200 bg-base-100 relative z-[60] flex h-16 w-full items-center justify-center border-t shadow-sm sm:hidden"
200+
class="border-base-200 bg-base-100 relative z-60 flex h-16 w-full items-center justify-center gap-3 border-t px-2 shadow-sm sm:hidden"
201201
[attr.dark]="dark_mode()"
202202
>
203203
<a
204204
matRipple
205-
class="relative flex flex-1 flex-col items-center justify-center"
205+
class="relative flex flex-1 flex-col items-center justify-center rounded-lg"
206206
[routerLink]="[default_page()]"
207207
name="footer-nav-home"
208-
routerLinkActive="text-secondary active"
208+
routerLinkActive="text-secondary active font-medium bg-secondary/10"
209209
>
210210
<icon filled class="text-2xl">home</icon>
211211
<icon
@@ -235,11 +235,11 @@ import { IconComponent, TranslatePipe } from '@placeos/components';
235235
</button>
236236
<a
237237
matRipple
238-
class="relative flex flex-1 flex-col items-center justify-center"
238+
class="relative flex flex-1 flex-col items-center justify-center rounded-lg"
239239
[routerLink]="['/explore']"
240240
[attr.disabled]="!features().includes('explore')"
241241
[class.opacity-0]="!features().includes('explore')"
242-
routerLinkActive="text-secondary active"
242+
routerLinkActive="text-secondary active font-medium bg-secondary/10"
243243
>
244244
<icon filled class="text-2xl">place</icon>
245245
<icon
@@ -269,18 +269,6 @@ import { IconComponent, TranslatePipe } from '@placeos/components';
269269
z-index: 200;
270270
}
271271
272-
a.active icon {
273-
color: var(--secondary) !important;
274-
}
275-
276-
a.active {
277-
background-color: var(--brand-200) !important;
278-
color: #fff !important;
279-
}
280-
a.active icon {
281-
color: #fff !important;
282-
}
283-
284272
a:not(.active) [filled],
285273
a.active [outline] {
286274
display: none;

0 commit comments

Comments
 (0)