diff --git a/src/components/ContentWrap.jsx b/src/components/ContentWrap.jsx index 23130531..f048b748 100644 --- a/src/components/ContentWrap.jsx +++ b/src/components/ContentWrap.jsx @@ -1003,14 +1003,14 @@ export default class ContentWrap extends Component {

Or choose from a template: -
+
{templates.map(template => ( !this.state.searchText || item.title.toLowerCase().indexOf(this.state.searchText) !== -1); } @@ -142,28 +141,29 @@ export default class SavedItemPane extends Component { > -
+

My Library ({this.items.length})

- -
+
diff --git a/src/style.css b/src/style.css index 2f977f37..df7e17a5 100644 --- a/src/style.css +++ b/src/style.css @@ -998,6 +998,12 @@ body > #demo-frame { color: navajowhite; } +.my-library-buttons { + display: flex; + gap: 0.2rem; + align-items: center; +} + .saved-items-pane.is-open { transition-duration: 0.4s; transform: translateX(0); @@ -1010,28 +1016,9 @@ body > #demo-frame { visibility: visible; } -.saved-items-pane__close-btn { - position: absolute; - left: -18px; - top: 24px; - opacity: 0; - visibility: hidden; - border-radius: 50%; - padding: 10px 14px; - background: crimson; - color: white; - border: 0; - transform: scale(0); - will-change: transform, opacity; - transition: 0.3s ease; - transition-delay: 0; -} - -.saved-items-pane.is-open .saved-items-pane__close-btn { - opacity: 1; - transition-delay: 0.4s; - transform: scale(1); - visibility: visible; +.header-container { + justify-content: space-between; + margin-block: 1.5rem; } .saved-item-tile { @@ -1173,10 +1160,13 @@ body > #demo-frame { opacity: 0.3; } -.saved-items-pane__container { +.create-new-pane__container { display: flex; align-items: center; justify-content: center; +} + +.saved-items-pane__container { overflow-y: auto; overflow-x: hidden; max-height: calc(100vh - 90px);