client/web: add device details view
Initial addition of device details view on the frontend. A little more backend piping work to come to fill all of the detail fields, for now using placeholders. Updates tailscale/corp#14335 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
This commit is contained in:
committed by
Sonia Appasamy
parent
3e9026efda
commit
d73e923b73
@@ -4,6 +4,10 @@
|
||||
|
||||
@layer base {
|
||||
h1 {
|
||||
@apply text-neutral-800 text-[22px] font-medium leading-[30.80px];
|
||||
}
|
||||
|
||||
h2 {
|
||||
@apply text-neutral-500 text-sm font-medium uppercase leading-tight tracking-wide;
|
||||
}
|
||||
}
|
||||
@@ -12,6 +16,21 @@
|
||||
.card {
|
||||
@apply p-5 bg-white rounded-lg border border-gray-200;
|
||||
}
|
||||
.card h1 {
|
||||
@apply text-neutral-800 text-lg font-medium leading-snug;
|
||||
}
|
||||
.card h2 {
|
||||
@apply text-neutral-500 text-xs font-semibold uppercase tracking-wide;
|
||||
}
|
||||
.card tbody {
|
||||
@apply flex flex-col gap-2;
|
||||
}
|
||||
.card td:first-child {
|
||||
@apply w-40 text-neutral-500 text-sm leading-tight;
|
||||
}
|
||||
.card td:last-child {
|
||||
@apply text-neutral-800 text-sm leading-tight;
|
||||
}
|
||||
|
||||
.hover-button {
|
||||
@apply px-2 py-1.5 bg-white rounded-[1px] cursor-pointer;
|
||||
|
||||
Reference in New Issue
Block a user