Repository: Hestenb62/_legacy_backup
Author: Hesten Berger
Commit Message: updated library
URL: https://github.com/Hestenb62/_legacy_backup/commit/57b86fa5152ee6b293b57ca48bb075b60c10e77a
Code Changes:
diff --git a/assets/css/library/lib-library-catalog-container.css b/assets/css/library/lib-library-catalog-container.css
index 8635be5..f5a0238 100644
--- a/assets/css/library/lib-library-catalog-container.css
+++ b/assets/css/library/lib-library-catalog-container.css
@@ -16,8 +16,11 @@
.library-row-header {
display: flex;
align-items: center;
- gap: 1.25rem;
+ justify-content: space-between;
+ gap: 1rem;
margin-bottom: 1.5rem;
+ padding-bottom: 0.85rem;
+ border-bottom: 1px solid var(--lib-border);
}
.library-row-title {
@@ -29,10 +32,52 @@
white-space: nowrap;
}
-.library-row-divider {
- height: 1px;
- flex-grow: 1;
- background: linear-gradient(90deg, var(--lib-border), transparent);
+.library-row-controls {
+ display: flex;
+ align-items: center;
+ gap: 0.75rem;
+ flex-shrink: 0;
+}
+
+.library-more-resources-btn {
+ display: inline-flex;
+ align-items: center;
+ gap: 0.5rem;
+ padding: 0.55rem 1.1rem;
+ font-size: 0.85rem;
+ font-weight: 700;
+ color: var(--lib-text-muted);
+ background-color: var(--lib-bg-surface);
+ border: 1px solid var(--lib-border);
+ border-radius: var(--lib-radius-md);
+ cursor: pointer;
+ box-shadow: var(--lib-shadow-sm);
+ transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
+ text-decoration: none;
+ white-space: nowrap;
+ line-height: 1;
+}
+
+.library-more-resources-btn:hover {
+ color: #ffffff;
+ background: linear-gradient(135deg, var(--lib-primary), #6366f1);
+ border-color: transparent;
+ transform: translateY(-2px);
+ box-shadow: 0 6px 16px rgba(79, 70, 229, 0.3);
+}
+
+.library-more-resources-btn:focus-visible {
+ outline: 2px solid var(--lib-primary);
+ outline-offset: 2px;
+}
+
+.library-more-resources-btn i {
+ font-size: 0.85rem;
+ transition: transform 0.2s ease;
+}
+
+.library-more-resources-btn:hover i {
+ transform: scale(1.15);
}
.library-scroll-buttons {
@@ -64,6 +109,25 @@
background-color: var(--lib-bg-base);
}
+.library-scroll-btn:focus-visible {
+ outline: 2px solid var(--lib-primary);
+ outline-offset: 2px;
+}
+
+@media (max-width: 640px) {
+ .library-row-header {
+ flex-wrap: wrap;
+ gap: 0.75rem;
+ }
+ .library-row-title {
+ font-size: 1.4rem;
+ }
+ .library-row-controls {
+ width: 100%;
+ justify-content: space-between;
+ }
+}
+
/* Mode 1: Carousel View (Horizontal Scroll) */
.view-carousel .library-books-row {
display: flex;
diff --git a/assets/css/library/lib-modals.css b/assets/css/library/lib-modals.css
index 7376ae9..619825f 100644
--- a/assets/css/library/lib-modals.css
+++ b/assets/css/library/lib-modals.css
@@ -858,3 +858,80 @@
align-items: center;
gap: 0.45rem;
}
+
+/* Library User Guide Modal */
+.library-guide-modal-content {
+ max-width: 740px;
+ padding: 2.25rem 2.25rem 2rem 2.25rem;
+ box-sizing: border-box;
+}
+
+.library-guide-grid {
+ display: flex;
+ flex-direction: column;
+ gap: 0.85rem;
+ margin: 1.25rem 0 1.5rem 0;
+ max-height: 52vh;
+ overflow-y: auto;
+ padding-right: 0.35rem;
+ scrollbar-width: thin;
+ scrollbar-color: var(--lib-border) transparent;
+}
+
+.library-guide-grid::-webkit-scrollbar {
+ width: 5px;
+}
+
+.library-guide-grid::-webkit-scrollbar-thumb {
+ background-color: var(--lib-border);
+ border-radius: var(--lib-radius-full);
+}
+
+.library-guide-card {
+ display: flex;
+ align-items: flex-start;
+ gap: 1rem;
+ background: var(--lib-bg-base);
+ border: 1px solid var(--lib-border);
+ border-radius: var(--lib-radius-lg);
+ padding: 1rem 1.15rem;
+ transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
+}
+
+.library-guide-card:hover {
+ border-color: var(--lib-primary);
+ transform: translateX(3px);
+}
+
+.guide-card-icon {
+ width: 2.65rem;
+ height: 2.65rem;
+ border-radius: var(--lib-radius-md);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 1.15rem;
+ flex-shrink: 0;
+}
+
+.guide-card-content {
+ text-align: left;
+}
+
+.guide-card-content h4 {
+ margin: 0 0 0.25rem 0;
+ font-size: 1rem;
+ font-weight: 800;
+ color: var(--lib-text-main);
+}
+
+.guide-card-content p {
+ margin: 0;
+ font-size: 0.86rem;
+ line-height: 1.55;
+ color: var(--lib-text-muted);
+}
+
+.library-guide-footer {
+ margin-top: 0.5rem;
+}
diff --git a/assets/css/library/lib-subject-research-workspace-pan.css b/assets/css/library/lib-subject-research-workspace-pan.css
index 0889e0a..0b0bb1b 100644
--- a/assets/css/library/lib-subject-research-workspace-pan.css
+++ b/assets/css/library/lib-subject-research-workspace-pan.css
@@ -12,6 +12,69 @@
flex-wrap: wrap;
}
+/* Top Subject Switcher Tab Bar */
+.desk-switcher-bar {
+ display: flex;
+ align-items: center;
+ gap: 0.5rem;
+ padding: 0.85rem 0.25rem;
+ margin: 1rem 0 1.5rem 0;
+ overflow-x: auto;
+ scrollbar-width: thin;
+ scrollbar-color: var(--lib-border) transparent;
+ -webkit-overflow-scrolling: touch;
+}
+
+.desk-switcher-bar::-webkit-scrollbar {
+ height: 4px;
+}
+
+.desk-switcher-bar::-webkit-scrollbar-thumb {
+ background-color: var(--lib-border);
+ border-radius: var(--lib-radius-full);
+}
+
+.desk-switcher-tab {
+ display: inline-flex;
+ align-items: center;
+ gap: 0.5rem;
+ padding: 0.55rem 1.15rem;
+ border-radius: var(--lib-radius-full);
+ border: 1px solid var(--lib-border);
+ background-color: var(--lib-bg-surface);
+ color: var(--lib-text-muted);
+ font-size: 0.85rem;
+ font-weight: 700;
+ cursor: pointer;
+ white-space: nowrap;
+ transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
+ box-shadow: var(--lib-shadow-sm);
+ flex-shrink: 0;
+}
+
+.desk-switcher-tab:hover {
+ color: var(--lib-text-main);
+ border-color: var(--lib-primary);
+ background-color: var(--lib-bg-base);
+ transform: translateY(-1px);
+}
+
+.desk-switcher-tab.active {
+ color: #ffffff;
+ background: linear-gradient(135deg, var(--lib-primary), #6366f1);
+ border-color: transparent;
+ box-shadow: 0 4px 14px rgba(79, 70, 229, 0.35);
+}
+
+.desk-switcher-tab:focus-visible {
+ outline: 2px solid var(--lib-primary);
+ outline-offset: 2px;
+}
+
+.desk-switcher-tab i {
+ font-size: 0.85rem;
+}
+
.drawer-header-left {
display: flex;
align-items: center;
diff --git a/assets/js/library/lib-explainer.js b/assets/js/library/lib-explainer.js
index db95baf..dfac858 100644
--- a/assets/js/library/lib-explainer.js
+++ b/assets/js/library/lib-explainer.js
@@ -241,3 +241,19 @@
const m = document.getElementById('ddcInfoModal');
if (m) m.classList.add('hidden');
};
+
+ window.openLibraryGuideModal = function () {
+ const m = document.getElementById('libraryGuideModal');
+ if (m) {
+ m.classList.remove('hidden');
+ document.body.style.overflow = 'hidden';
+ }
+ };
+
+ window.closeLibraryGuideModal = function () {
+ const m = document.getElementById('libraryGuideModal');
+ if (m) {
+ m.classList.add('hidden');
+ document.body.style.overflow = '';
+ }
+ };
diff --git a/assets/js/library/lib-keyboard-shortcuts.js b/assets/js/library/lib-keyboard-shortcuts.js
index 807c42a..1e03b3d 100644
--- a/assets/js/library/lib-keyboard-shortcuts.js
+++ b/assets/js/library/lib-keyboard-shortcuts.js
@@ -9,6 +9,7 @@
window.closeLexileInfoModal();
window.closeDdcInfoModal();
window.closeBookCitationModal();
+ if (window.closeLibraryGuideModal) window.closeLibraryGuideModal();
}
// Press '/' to search catalog
if (e.key === '/' && document.activeElement.tagName !== 'INPUT' && document.activeElement.tagName !== 'TEXTAREA') {
diff --git a/assets/js/library/lib-subject-research-desks-navigat.js b/assets/js/library/lib-subject-research-desks-navigat.js
index af1f7cb..98e5d64 100644
--- a/assets/js/library/lib-subject-research-desks-navigat.js
+++ b/assets/js/library/lib-subject-research-desks-navigat.js
@@ -2,14 +2,7 @@