style(portal): two-column management template buttons on desktop
This commit is contained in:
1 parent
aa406e623d
commit
81d1f21236
1 file changed
+29
@@ -47,6 +47,32 @@ const serialized = payload ? JSON.stringify(payload).replaceAll('<', '\\u003c')
|
|||||||
.employee-portal__content :global(:is(ul, ol)) { padding-inline-start: 1.5rem; margin-block: 1rem 1.5rem; }
|
.employee-portal__content :global(:is(ul, ol)) { padding-inline-start: 1.5rem; margin-block: 1rem 1.5rem; }
|
||||||
.employee-portal__content :global(li) { margin-block: .5rem; }
|
.employee-portal__content :global(li) { margin-block: .5rem; }
|
||||||
.employee-portal__content :global(li::marker) { color: var(--color-accent, #ffbd59); }
|
.employee-portal__content :global(li::marker) { color: var(--color-accent, #ffbd59); }
|
||||||
|
|
||||||
|
/* Staff Management Templates: retain semantic list/DOM order, style as cards. */
|
||||||
|
.employee-portal__content :global(ul.portal-template-grid) {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||||
|
gap: .8rem 1rem;
|
||||||
|
list-style: none;
|
||||||
|
margin-block: 1rem 2rem;
|
||||||
|
padding-inline-start: 0;
|
||||||
|
}
|
||||||
|
.employee-portal__content :global(ul.portal-template-grid > li) {
|
||||||
|
list-style: none;
|
||||||
|
margin: 0;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
.employee-portal__content :global(ul.portal-template-grid > li p) { margin: 0; }
|
||||||
|
.employee-portal__content :global(ul.portal-template-grid a.portal-resource-button) {
|
||||||
|
align-items: center;
|
||||||
|
box-sizing: border-box;
|
||||||
|
display: flex;
|
||||||
|
height: 100%;
|
||||||
|
min-height: 2.75rem;
|
||||||
|
overflow-wrap: anywhere;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
.employee-portal__content :global(:is(section, article) + :is(section, article)) { margin-block-start: 2.5rem; }
|
.employee-portal__content :global(:is(section, article) + :is(section, article)) { margin-block-start: 2.5rem; }
|
||||||
.employee-portal__content :global(hr) { border: 0; border-top: 1px solid var(--color-border); margin-block: 2rem; }
|
.employee-portal__content :global(hr) { border: 0; border-top: 1px solid var(--color-border); margin-block: 2rem; }
|
||||||
.employee-portal__content :global(a.portal-resource-button) {
|
.employee-portal__content :global(a.portal-resource-button) {
|
||||||
@@ -69,5 +95,8 @@ const serialized = payload ? JSON.stringify(payload).replaceAll('<', '\\u003c')
|
|||||||
.employee-portal__content :global(th) { background: var(--color-tint); color: var(--color-primary); }
|
.employee-portal__content :global(th) { background: var(--color-tint); color: var(--color-primary); }
|
||||||
.employee-portal__content :global(dt) { font-weight: 600; margin-top: 1rem; }
|
.employee-portal__content :global(dt) { font-weight: 600; margin-top: 1rem; }
|
||||||
.employee-portal__content :global(dd) { margin-inline-start: 1rem; }
|
.employee-portal__content :global(dd) { margin-inline-start: 1rem; }
|
||||||
|
@media (max-width: 767px) {
|
||||||
|
.employee-portal__content :global(ul.portal-template-grid) { grid-template-columns: minmax(0, 1fr); }
|
||||||
|
}
|
||||||
@media (max-width: 500px) { .employee-portal__access { align-items: stretch; flex-direction: column; } }
|
@media (max-width: 500px) { .employee-portal__access { align-items: stretch; flex-direction: column; } }
|
||||||
</style>
|
</style>
|
||||||
Reference in new issue
Block a user