diff --git a/public/fonts/SourceSansPro/SourceSansPro-Regular.woff2 b/public/fonts/SourceSansPro/SourceSansPro-Regular.woff2 new file mode 100644 index 00000000..e49928e8 Binary files /dev/null and b/public/fonts/SourceSansPro/SourceSansPro-Regular.woff2 differ diff --git a/src/components/library/molecules/Tag/Tag.module.scss b/src/components/library/molecules/Tag/Tag.module.scss index 62310e93..08715122 100644 --- a/src/components/library/molecules/Tag/Tag.module.scss +++ b/src/components/library/molecules/Tag/Tag.module.scss @@ -21,6 +21,9 @@ .text { display: inline; + // Beats the global `.library p` serif rule (0,2,0 > 0,1,1) so tag labels + // use the sans face. + font-family: var(--font-source-sans); } .removeButton { diff --git a/src/components/library/organisms/LibraryToolbar/LibraryToolbar.module.scss b/src/components/library/organisms/LibraryToolbar/LibraryToolbar.module.scss index c822ecde..7fa63695 100644 --- a/src/components/library/organisms/LibraryToolbar/LibraryToolbar.module.scss +++ b/src/components/library/organisms/LibraryToolbar/LibraryToolbar.module.scss @@ -12,24 +12,14 @@ } } -.divider { - width: 100%; - height: 1px; - background: var(--black-100); - margin: 16px 0; - - // Mobile: collapse the top margin so the divider connects to the fixed - // header (paired with the layout wrapper dropping its top padding). - @media (max-width: 768px) { - margin-top: 0; - } -} - .controls { display: flex; align-items: center; justify-content: space-between; gap: 24px; + // Replaces the removed divider's 16px top margin so the controls keep their + // breathing room below the global header. + margin-top: 16px; animation: toolbar-fade 0.3s ease; // On phones everything crammed onto one row collapsed the flex:1 pill @@ -40,12 +30,17 @@ flex-direction: column; align-items: stretch; gap: 12px; + // Collapse the top margin on mobile so the controls connect to the fixed + // header (paired with the layout wrapper dropping its top padding), matching + // the removed divider's mobile behavior. + margin-top: 0; } } // Guest view of someone else's library: the divider is dropped, so restore the // vertical breathing room on the controls row itself. .controlsGuest { + margin-top: 0; padding: 24px 10px; } diff --git a/src/components/library/organisms/LibraryToolbar/LibraryToolbar.tsx b/src/components/library/organisms/LibraryToolbar/LibraryToolbar.tsx index 4e475029..b3be94e9 100644 --- a/src/components/library/organisms/LibraryToolbar/LibraryToolbar.tsx +++ b/src/components/library/organisms/LibraryToolbar/LibraryToolbar.tsx @@ -332,8 +332,6 @@ export function LibraryToolbar(props: LibraryToolbarProps): JSX.Element { return (
-
-
{isReordering ? 'Drag to reorder →' : 'Jump to →'} diff --git a/src/components/library/organisms/Sidebar/Sidebar.module.scss b/src/components/library/organisms/Sidebar/Sidebar.module.scss index af36f9bb..f661b41d 100644 --- a/src/components/library/organisms/Sidebar/Sidebar.module.scss +++ b/src/components/library/organisms/Sidebar/Sidebar.module.scss @@ -87,7 +87,8 @@ .button { width: auto; - padding: 3px 8px; + height: auto; + padding: 4px 8px; } .text { @@ -132,6 +133,15 @@ display: flex; flex-wrap: wrap; + &.tagsEmpty { + height: 50px; + align-items: center; + } + + .emptyTags { + color: var(--gray-medium); + } + .button { color: var(--brown); height: 26px; diff --git a/src/components/library/organisms/Sidebar/Sidebar.tsx b/src/components/library/organisms/Sidebar/Sidebar.tsx index 35fc9ebc..4980a73c 100644 --- a/src/components/library/organisms/Sidebar/Sidebar.tsx +++ b/src/components/library/organisms/Sidebar/Sidebar.tsx @@ -171,6 +171,9 @@ export function Sidebar() { resolveStrapiUrl(currentOwner?.avatar) ?? (isMyLibrary ? accountData?.picture : undefined); const aboutAuthorText = stripHtml(currentOwner?.aboutMe); + const aboutLibraryText = stripHtml( + currentLibrary?.attributes.libraryDetails?.aboutLibrary, + ); // Owner sees their full tag palette; a true visitor sees only the tags // actually used on this library's objects — no cross-account tag fetch. @@ -397,7 +400,7 @@ export function Sidebar() { ''}
-
+ {aboutLibraryText &&
}
Total objects: @@ -468,7 +471,14 @@ export function Sidebar() { )}
-
+
+ {displayedTags.length === 0 && ( + No tags yet. + )} {displayedTags.map(tag => ( ))} diff --git a/src/styles/globals.scss b/src/styles/globals.scss index 8056fa45..650ac572 100644 --- a/src/styles/globals.scss +++ b/src/styles/globals.scss @@ -267,6 +267,15 @@ body { font-display: block; } +@font-face { + font-family: 'Source Sans Pro'; + src: url('/keepsimple_/fonts/SourceSansPro/SourceSansPro-Regular.woff2') + format('woff2'); + font-weight: 400; + font-style: normal; + font-display: block; +} + // Aldrich is being used in Company Management(new) @font-face { font-family: 'Aldrich'; diff --git a/src/styles/library/variables.scss b/src/styles/library/variables.scss index 2be45c5f..5d0d8f46 100644 --- a/src/styles/library/variables.scss +++ b/src/styles/library/variables.scss @@ -113,5 +113,7 @@ /* Fonts — the upstream library injected these via next/font on ; here we declare them directly with web-safe fallbacks. */ --font-source-serif: 'Source Serif 4', Georgia, 'Times New Roman', serif; + --font-source-sans: + 'Source Sans Pro', system-ui, -apple-system, Arial, sans-serif; --font-lato: 'Lato', system-ui, -apple-system, Arial, sans-serif; }