agw/overleaf-cep
1
0
Fork 0
mirror of https://github.com/yu-i-i/overleaf-cep.git synced 2026-05-30 12:24:25 +02:00
Code Issues Packages Projects Releases Wiki Activity

[web] DS-Nav footer tweaks (#22482)

Browse Source 
* Footer tweaks (add border, main-content 100vh)

* Update color to be the same as the sidebar `<hr>`

* Move the border to the larger div so it also separates with the navbar

* Update border color to be the same as the background

* Fixup lint

* Fixup main content padding on mobile view

See https://github.com/overleaf/internal/pull/22186#discussion_r1876087478

* Change the border color to neutral-20

* Use `--border-divider` which is the same color as --neutral-20 (`#e7e9ee`)

* Replace `@media (width >= 768px)` by `@include media-breakpoint-up(md)`

* Replace `min-height: 100dvh` by `min-height: 100%`

GitOrigin-RevId: 426869e9b96a1ee8245c487bb80ff01856521a34
This commit is contained in:
Antoine Clausse
2024-12-13 15:36:25 +01:00
committed by Copybot
parent a323a5c915
commit 90b16e4c8e
2 changed files with 13 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
services/web/frontend/js/features/project-list/components/project-list-ds-nav.tsx
View File

@@ -62,7 +62,7 @@ export function ProjectListDsNav() {
<main className="project-list-wrapper">
<SidebarDsNav />
<div className="project-ds-nav-content">
<div className="p-4">
<div className="project-ds-nav-main">
{error ? <DashApiError /> : ''}
<UserNotifications />
<div className="project-list-header-row">

13
services/web/frontend/stylesheets/bootstrap-5/pages/project-list-ds-nav.scss
View File

@@ -181,6 +181,15 @@
}
}
.project-ds-nav-main {
min-height: 100%;
padding: var(--spacing-08) var(--spacing-06);
@include media-breakpoint-up(md) {
padding: var(--spacing-08);
}
}
.project-dash-table {
.btn-link {
color: var(--content-secondary);
@@ -207,8 +216,10 @@
position: relative;
background-color: var(--bg-light-secondary);
@media (width >= 768px) {
@include media-breakpoint-up(md) {
border-top-left-radius: var(--border-radius-large);
border-left: 1px solid var(--border-divider);
border-top: 1px solid var(--border-divider);
}
}
}