Andal.LND/frontend-app-authoring
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[FC-0036] refactor: Further refinements to tag drawer (#970)

Browse Source 
* refactor: Further refinements to tag drawer
* Padding to top and left tagging drawer
* Changes in headings in the tagging drawer
This commit is contained in:
Chris Chávez
2024-05-06 04:16:46 -05:00
committed by GitHub
parent 2f5d4f71ec
commit de408b5a3a
2 changed files with 21 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/content-tags-drawer/ContentTagsCollapsible.jsx
View File

@@ -382,7 +382,7 @@ const ContentTagsCollapsible = ({
<Collapsible.Visible whenOpen>
<Icon src={KeyboardArrowUp} />
</Collapsible.Visible>
<h4 className="flex-grow-1 pl-2">{name}</h4>
<h3 className="h5 flex-grow-1 pl-2">{name}</h3>
</Collapsible.Trigger>
<Collapsible.Body className="collapsible-body">

38
src/content-tags-drawer/ContentTagsDrawer.jsx
View File

@@ -90,10 +90,10 @@ const ContentTagsDrawer = ({ id, onClose }) => {
return (
<ContentTagsDrawerContext.Provider value={context}>
<div id="content-tags-drawer" className="mt-1 tags-drawer d-flex flex-column justify-content-between min-vh-100">
<div id="content-tags-drawer" className="mt-1 tags-drawer d-flex flex-column justify-content-between min-vh-100 pt-3">
<Container size="xl">
{ isContentDataLoaded
? <h2>{ contentName }</h2>
? <h2 className="h3 pl-2.5">{ contentName }</h2>
: (
<div className="d-flex justify-content-center align-items-center flex-column">
<Spinner
@@ -103,23 +103,25 @@ const ContentTagsDrawer = ({ id, onClose }) => {
/>
</div>
)}
<hr />
<p className="lead text-gray-500 font-weight-bold">{intl.formatMessage(messages.headerSubtitle)}</p>
{ isTaxonomyListLoaded && isContentTaxonomyTagsLoaded
? tagsByTaxonomy.map((data) => (
<div key={`taxonomy-tags-collapsible-${data.id}`}>
<ContentTagsCollapsible
contentId={contentId}
taxonomyAndTagsData={data}
stagedContentTags={stagedContentTags[data.id] || []}
collapsibleState={collapsibleStates[data.id] || false}
/>
<hr />
</div>
))
: <Loading />}
<Container>
<p className="h4 text-gray-500 font-weight-bold">
{intl.formatMessage(messages.headerSubtitle)}
</p>
{ isTaxonomyListLoaded && isContentTaxonomyTagsLoaded
? tagsByTaxonomy.map((data) => (
<div key={`taxonomy-tags-collapsible-${data.id}`}>
<ContentTagsCollapsible
contentId={contentId}
taxonomyAndTagsData={data}
stagedContentTags={stagedContentTags[data.id] || []}
collapsibleState={collapsibleStates[data.id] || false}
/>
<hr />
</div>
))
: <Loading />}
</Container>
</Container>
{ isTaxonomyListLoaded && isContentTaxonomyTagsLoaded && (