chore: adjusts admin UI styling (#7557)

## Description

- Improves mobile styling of Payload admin UI.
- Reduces font size on dashboard cards.
- Improves the block/collapsible/array field styling.

- [x] I have read and understand the
[CONTRIBUTING.md](https://github.com/payloadcms/payload/blob/main/CONTRIBUTING.md)
document in this repository.

## Type of change

<!-- Please delete options that are not relevant. -->

- [x] Chore (non-breaking change which does not add functionality)

## Checklist:

- [ ] I have added tests that prove my fix is effective or that my
feature works
- [x] Existing test suite passes locally with my changes
- [ ] I have made corresponding changes to the documentation
This commit is contained in:
Tylan Davis
2024-08-09 11:19:36 -04:00
committed by GitHub
parent 69ada97df5
commit 0d552fd523
39 changed files with 142 additions and 96 deletions

View File

@@ -35,11 +35,11 @@
height: base(1);
svg {
width: base(2.75);
height: base(2.75);
width: base(2);
height: base(2);
position: relative;
left: base(-0.825);
top: base(-0.825);
inset-inline-start: base(-0.5);
top: base(-0.5);
.stroke {
stroke-width: 2px;

View File

@@ -38,19 +38,19 @@
--gutter-h: #{base(3)};
--spacing-view-bottom: var(--gutter-h);
--app-header-height: calc(var(--base) * 3);
--doc-controls-height: calc(var(--base) * 3);
--doc-controls-height: calc(var(--base) * 2.8);
--app-header-height: calc(var(--base) * 2.8);
--nav-width: 275px;
--nav-trans-time: 150ms;
@include mid-break {
--gutter-h: #{base(2)};
--app-header-height: calc(var(--base) * 2);
--doc-controls-height: calc(var(--base) * 2.5);
--app-header-height: calc(var(--base) * 2.4);
--doc-controls-height: calc(var(--base) * 2.4);
}
@include small-break {
--gutter-h: #{base(0.5)};
--gutter-h: #{base(0.8)};
--spacing-view-bottom: calc(var(--base) * 2);
--nav-width: 100vw;
}

View File

@@ -96,6 +96,7 @@
font-size: $baseline-body-size;
line-height: $baseline-px;
font-weight: normal;
font-family: var(--font-body);
}
%code {