Book page subject editing#11719
Merged
mekarpeles merged 8 commits intointernetarchive:masterfrom Feb 23, 2026
Merged
Conversation
Contributor
There was a problem hiding this comment.
Pull request overview
This PR adds an "Edit Subjects" button to the subjects section on book pages, allowing privileged users (admins, super-librarians, and librarians) to edit subjects directly from book pages using the Integrated Librarian Environment's bulk tagger. When changes are submitted through a book page, the ILE is reset and the page is reloaded.
Changes:
- Added authentication-gated "Edit Subjects" button to book pages
- Integrated book page subject editing with existing bulk tagger workflow
- Added page reload behavior after subject edits from book pages
Reviewed changes
Copilot reviewed 6 out of 6 changed files in this pull request and generated 16 comments.
Show a summary per file
| File | Description |
|---|---|
| static/css/page-book.less | Imports tagging-menu styles for bulk tagger UI |
| openlibrary/templates/type/edition/view.html | Adds "Edit Subjects" button with authorization check |
| openlibrary/plugins/openlibrary/js/index.js | Adds event listener to connect button to bulk tagger |
| openlibrary/plugins/openlibrary/js/ile/index.js | Adds clearAndReset method and updates updateAndShowBulkTagger signature |
| openlibrary/plugins/openlibrary/js/bulk-tagger/BulkTagger.js | Adds isBookPageEdit flag to trigger page reload after submission |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| window.ILE.selectionManager.addSelectedItem(workOlid) | ||
| window.ILE.selectionManager.updateToolbar() | ||
| } | ||
| window.ILE.updateAndShowBulkTagger([workOlid], true) |
There was a problem hiding this comment.
Missing semicolon at the end of the statement for consistency with the codebase style.
| this.resetTaggingMenu(); | ||
| if (this.isBookPageEdit) { | ||
| window.ILE.clearAndReset() | ||
| window.location.reload() |
There was a problem hiding this comment.
Missing semicolon at the end of the statement for consistency with the codebase style.
Suggested change
| window.location.reload() | |
| window.location.reload(); |
Collaborator
Author
There was a problem hiding this comment.
Semicolon usage in .js files is not consistent throughout the codebase.
| updateAndShowBulkTagger(workIds) { | ||
| updateAndShowBulkTagger(workIds, isBookPageEdit = false) { | ||
| if (this.bulkTagger) { | ||
| this.bulkTagger.isBookPageEdit = isBookPageEdit |
There was a problem hiding this comment.
Missing semicolon at the end of the statement for consistency with the codebase style.
Suggested change
| this.bulkTagger.isBookPageEdit = isBookPageEdit | |
| this.bulkTagger.isBookPageEdit = isBookPageEdit; |
| if (this.bulkTagger) { | ||
| this.bulkTagger.isBookPageEdit = isBookPageEdit | ||
| this.bulkTagger.updateWorks(workIds) | ||
| this.bulkTagger.showTaggingMenu() |
There was a problem hiding this comment.
Missing semicolon at the end of the statement for consistency with the codebase style.
Suggested change
| this.bulkTagger.showTaggingMenu() | |
| this.bulkTagger.showTaggingMenu(); |
| const editSubjectButton = document.querySelector('.edit-subject .edit-subject-btn') | ||
| if (editSubjectButton) { | ||
| editSubjectButton.addEventListener('click', () => { | ||
| const workOlid = editSubjectButton.dataset.workOlid |
There was a problem hiding this comment.
Missing semicolon at the end of the statement for consistency with the codebase style.
| $if is_privileged_user or is_librarian: | ||
| $ work_olid = work.key.split('/')[-1] | ||
| <div class="edit-subject"> | ||
| <button type="button" class="edit-subject-btn" data-work-olid="$work_olid">$_("Edit Subjects")</button> |
There was a problem hiding this comment.
The button lacks an aria-label or title attribute to provide additional context for screen readers. Consider adding an aria-label that describes what editing subjects will do, such as "Open bulk subject editor for this work".
Suggested change
| <button type="button" class="edit-subject-btn" data-work-olid="$work_olid">$_("Edit Subjects")</button> | |
| <button type="button" class="edit-subject-btn" data-work-olid="$work_olid" aria-label="$_('Open bulk subject editor for this work')">$_("Edit Subjects")</button> |
Comment on lines
+333
to
+335
| if (!window.ILE.selectionManager.selectedItems.work.includes(workOlid)) { | ||
| window.ILE.selectionManager.addSelectedItem(workOlid) | ||
| window.ILE.selectionManager.updateToolbar() |
There was a problem hiding this comment.
When the work is already selected, updateToolbar is still called unnecessarily. Consider moving the updateToolbar call inside the if block so it's only called when a new item is actually added to the selection.
| window.ILE.selectionManager.updateToolbar() | ||
| } | ||
| window.ILE.updateAndShowBulkTagger([workOlid], true) | ||
| }) |
There was a problem hiding this comment.
Missing semicolon at the end of the statement for consistency with the codebase style.
| * | ||
| * @type {boolean} | ||
| */ | ||
| this.isBookPageEdit = false |
There was a problem hiding this comment.
Missing semicolon at the end of the statement for consistency with the codebase style.
Suggested change
| this.isBookPageEdit = false | |
| this.isBookPageEdit = false; |
| this.updateFetchedSubjects(); | ||
| this.resetTaggingMenu(); | ||
| if (this.isBookPageEdit) { | ||
| window.ILE.clearAndReset() |
There was a problem hiding this comment.
Missing semicolon at the end of the statement for consistency with the codebase style.
Suggested change
| window.ILE.clearAndReset() | |
| window.ILE.clearAndReset(); |
jimchamp
force-pushed
the
book-page-subject-editing
branch
2 times, most recently
from
405a9bc to
ddddcb0
Compare
jimchamp
force-pushed
the
book-page-subject-editing
branch
from
f1d8ede to
06b5d5d
Compare
for more information, see https://pre-commit.ci
jimchamp
commented
Jan 27, 2026
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
lokesh
added a commit
to lokesh/openlibrary
that referenced
this pull request
Feb 23, 2026
…internetarchive#11719) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
cdrini
pushed a commit
that referenced
this pull request
Feb 27, 2026
* Enhance webpack configuration to support both .less and .css files for gradual migration to native CSS. Update entry file discovery and add rules for processing CSS files. * Refactor link-box component: replace .less imports with inline .css imports and delete the link-box.less file to streamline CSS usage. * Remove migration comment from link-box CSS file after transitioning from .less to native CSS. * Add CSS Custom Properties for caching in head.html and remove migration comment from index.less * Integrate css-minimizer-webpack-plugin for improved CSS minification and update webpack configuration to support inline CSS imports during the migration from LESS to native CSS. Add comments for clarity on the migration process in relevant CSS files. * Remove inline migration comments from legacy.less as part of the transition to native CSS, streamlining the codebase. * Migrate 21 simple LESS components to native CSS Convert the simplest component .less files to .css using CSS custom properties (var(--token)) instead of LESS variables, flattened selectors instead of LESS nesting, and hardcoded breakpoint values in @media queries. Components migrated: - book, buttonGhost, buttonLink, category-item, donate, edit-toolbar - header-bar--js, loading-indicator, native-dialog, navEdition - page-banner--tablet, page-history, preview, provider-table - readinglog-stats, searchbox, subNav, throbber, toc, widget-box - work--tablet Parent .less files updated to use @import (inline) for the new .css files. Also adds LESS_TO_CSS_MIGRATION_PLAN.md with the full migration plan. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Migrate 8 medium-complexity LESS components to native CSS Convert components with moderate nesting and variable usage: - buttonBtn, flash-messages, language, modal-links - observationStats, rating-form, readerStats, shareLinks Parent imports updated to @import (inline) across page entries, legacy.less, and component files that reference these. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Migrate batch 5: convert 11 more LESS components to native CSS Convert chart-stats, edit-toolbar--tablet, buttonCta--js, lists-page-cta, admin-table, manage-covers, searchResultItemCta, pagination, read-statuses, pd-dashboard, and page-heading-search-box from .less to .css. Flatten LESS nesting, replace @variables with var(--custom-properties), hardcode breakpoint values in @media queries, and update parent imports to use @import (inline). Add form.olform.less import to page-subject.less to replace the dependency that was embedded in page-heading-search-box.less. Skip toast.less (JS-bundled via Toast.js, requires Phase 3 webpack changes). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Migrate batch 6: convert 8 more LESS components to native CSS Convert ol-message, author-infobox, list-entry, fulltext-snippet, wmd-button-bar, listLists, chart, and ui-dialog from .less to .css. Notable conversions: - ol-message: Pre-computed LESS hue()/saturation() color functions to hardcoded HSL values since the source colors are constants - chart: Hardcoded local LESS variable arithmetic (@chart-height + @chart-bottom-padding = 160px) since calc() is unnecessary for constants Identified Tools--tablet.less and borrowTable.less as orphaned (not imported anywhere) — left as-is for separate cleanup. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Migrate batch 7: convert 10 more LESS components to native CSS Convert buttonsAndLinks, page-banner, metadata-form, fulltext-search-suggestion, fulltext-search-suggestion-item, wmd-prompt-dialog--js, illustration, diff, sort-dropper, and team from .less to .css. Handle sub-import dependencies: - buttonsAndLinks.less imported buttonCta.less, buttonLink.css, buttonGhost.css, and buttonBtn.css — moved these imports to legacy.less - page-banner.less imported buttonBtn.css — moved to header.less - cover.less (passthrough to illustration.less) updated to inline CSS import Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Migrate batch 8: convert 9 more LESS components to native CSS Convert header-bar--tablet, librarian-dashboard, iaBar, header-bar--desktop, check-in, footer, merge-form, home, and ui-tabs from .less to .css. Handle sub-import dependencies: - iaBar.less imported buttonGhost.css — moved to header.less - footer.less imported in 6 parent files — updated all Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert batch 9 LESS components to native CSS: jquery.autocomplete, work-title-and-author, mybooks-dropper, generic-dropper, tagging-menu, mybooks-details Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert batch 10 LESS components to native CSS: form.olform, merge-request-table, cbox, mybooks-menu Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert notes-view, reading-goal, and buttonCta from LESS to native CSS Batch 11: Convert three components to native CSS with flattened selectors, CSS custom properties, and pre-computed color functions. Add missing LESS variable imports (font-families, line-heights, borders) to legacy.less to compensate for variables previously provided by buttonCta.less's index.less import. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert compact-title, nav-bar, and editions from LESS to native CSS Batch 12: Convert three components with pre-computed color functions (darken, mix), flattened deep nesting, hardcoded breakpoints and local LESS arithmetic variables. Move compact-title import from nav-bar to work.less since it's now a separate CSS file. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert read-panel and search-result-item from LESS to native CSS Batch 13: Convert two key components with pre-computed color functions (fade, lighten, desaturate). Hoist sub-imports (preview.css) to legacy.less. Update all parent files that import these components (legacy, carousel, list-showcase, list-follow, work, search-results-container, mybooks-list). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert list-showcase, list-follow, and mybooks-list from LESS to CSS Batch 14: Convert three components with pre-computed local LESS arithmetic (cover overlap calculations), fade() color functions, and BEM nesting. Hoist sub-imports to parent files (mybooks.less, page-book.less). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert header-bar (902 lines) from LESS to native CSS Batch 15: Convert the largest component file with extensive nesting (search component, dropdown menus, app drawer, hamburger component), pre-computed fade() color function, and numerous LESS variables. Pull @Keyframes out of nested selector context to top level. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert carousel, cover, and search-results-container from LESS to native CSS Hoist sub-imports (category-item, loading-indicator, search-result-item, fulltext-snippet) to parent files. Skip carousel--js.less (JS-bundled, requires webpack config change). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert header, mybooks, and work from LESS to native CSS; delete orphaned files Convert the last 3 component .less wrappers (header, mybooks, work) to CSS. Hoist all sub-imports to parent files and add @media-wrapped imports for header-bar tablet/desktop variants. Delete orphaned files (borrowTable.less, iaBar--tablet.less, Tools--tablet.less) that had no importers. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert JS-bundled LESS files to native CSS and add webpack CSS loader Convert carousel--js, toast, js-all, legacy-jquery-ui, legacy-datatables, and SelectionManager from LESS to native CSS. Add webpack css-loader rule to support direct CSS imports from JavaScript modules. Update all JS import paths from .less to .css. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert base/ and layout/ LESS files to native CSS Convert dl, helpers-common, helpers-misc, headings, and common from base/ directory and v2+index from layout/ directory from LESS to native CSS. Flatten nesting, replace LESS variables with CSS custom properties, pre-compute fade() function. Merge layout/v2 into layout/index.css. Remove base/index.less barrel file. Update all parent imports. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert legacy-header, legacy-tools, legacy-wmd, and legacy-borrowTable-adminUser from LESS to native CSS Flatten nesting, replace LESS variables with CSS custom properties, hardcode breakpoints, inline wmd-button-bar.css content into legacy-wmd.css. Update parent imports in legacy.less, page-user.less, and page-admin.less. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert legacy.less CSS rules from LESS nesting to flat CSS with custom properties Flatten all nested LESS selectors and replace LESS variables with CSS custom properties in legacy.less while preserving the LESS import directives that resolve component CSS files at build time. Remove now-unnecessary LESS variable file imports since all variables are replaced with CSS custom properties. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert page-*.less entry points from LESS features to native CSS Replace LESS variables with CSS custom properties, flatten all nested selectors, pre-compute LESS functions (fade, desaturate), hardcode breakpoint values in @media queries, and remove unnecessary LESS variable file imports across all 15 page-*.less entry point files. Files retain .less extension for @import (inline) directive processing by the LESS compiler. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Migrate all entry points from .less to .css, eliminating LESS compiler dependency Convert legacy.less and all 15 page-*.less entry points to native .css files using standard CSS @import statements resolved by css-loader. Remove the LESS loader rule and less-plugin-clean-css from webpack.config.css.js since no .less entry points remain. Media-wrapped imports in legacy.css are manually inlined since css-loader doesn't resolve @import inside @media blocks. The only remaining LESS files are the variable definitions in static/css/less/ which are used by generate-css-custom-properties.js to produce the CSS custom properties file loaded globally via <head>. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Update stale .less references in CSS comments to .css Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Remove LESS tooling dependencies and update linting config for CSS The LESS compiler is no longer used for building CSS bundles. Remove less-loader, less-plugin-clean-css, and postcss-less. Update stylelint to lint .css files instead of .less, remove postcss-less custom syntax, and update .stylelintignore. Fix stale .less references in comments and Storybook imports. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Replace LESS token pipeline with hand-maintained tokens.css Convert generated-custom-properties.css to static/css/tokens.css, a hand-editable file with section comments. Delete the LESS variable source files (static/css/less/), the generator script, and remove the `less` npm dependency. Update head.html, Makefile, and webpack config. LESS is now fully removed from the project. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Split tokens.css into individual files with restored comments Break the single tokens.css file into 7 source files in static/css/tokens/ (border-radius, borders, breakpoints, colors, font-families, line-heights, z-index) with the original comments from the LESS variable files restored. tokens.css is now a barrel file with @import statements, compiled by webpack into a single minified file at static/build/css/tokens.css. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Add CSS_CHANGES.md developer guide for LESS removal and native CSS migration. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Fix all CSS lint errors: auto-fix formatting, replace raw z-index values with tokens, add specificity disable comments for pre-existing selectors, and ignore third-party CSS files. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Scope CSS lint globs to static/ and openlibrary/ to exclude vendor submodule CSS files that were incorrectly being linted. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Update CSS_CHANGES.md with lint cleanup details and visual impact assessment. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Add missing buttonCta.css import to page-book.css entry point. The CTA button base styles were missing from book/work pages because buttonCta.css was never imported in page-book.css. Components like read-panel, generic-dropper, list-follow, and editions all reference .cta-btn classes but the defining stylesheet was absent. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Add buttonCta.css import to page-home, page-subject, and page-team entry points. buttonCta.css defines the base .cta-btn styles (colors, sizing, variants) that are referenced by many components across the site. It was only directly imported in page-signup.css and page-book.css. All other pages either got it via legacy.css or were missing it entirely. Now all page entry points include buttonCta.css, ensuring CTA buttons render correctly everywhere. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Fix button specificity and restore original border-radius values across 15 CSS files. Add a.cta-btn-- prefixed selectors to buttonCta.css to fix anchor-based CTA buttons losing styles due to specificity conflict with a:link in common.css. Replace incorrect var(--border-radius-button) (4px) token with original hardcoded values (3px, 5px, or 6px) from LESS source files. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Add missing book.css import to page-home, page-subject, and page-book entry points. During the LESS to CSS migration, carousel.less had a transitive import of book.less that was dropped. This caused .book component styles (cover height, image box-shadow, border-radius) to be missing from all carousel pages. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Remove CSS_CHANGES.md and LESS_TO_CSS_MIGRATION_PLAN.md as part of the complete migration from LESS to native CSS. All references to LESS have been eliminated, and the documentation is no longer needed. This finalizes the transition to a fully CSS-based styling approach. * Refactor styles across multiple components to transition from LESS to native CSS. This includes removing LESS-specific syntax, updating style definitions, and ensuring consistent styling practices. Key changes involve restructuring CSS rules for better specificity and organization, as well as enhancing hover effects and animations for various UI elements. This finalizes the migration to a fully CSS-based styling approach. * Update pre-commit configuration and workflows to remove LESS references and enforce CSS-only styling. Adjusted stylelint settings to target only CSS files, removed LESS from workflow triggers, and updated documentation to reflect the transition to native CSS. This continues the effort to finalize the migration from LESS to CSS. * Add tagging-menu.css import to page-book entry point (from upstream PR #11719) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Add shareLinks.css import to page-book entry point Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * bring back LESS vars as css custom properties * Update .stylelintignore to restore CSS token files and modify SelectionManager.css to disable stylelint rules for hex and named colors. * Refactor CSS variable declaration in MergeTable.vue to use :host selector for improved encapsulation --------- Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
bhardwajparth51
pushed a commit
to bhardwajparth51/openlibrary
that referenced
this pull request
Mar 3, 2026
* Enhance webpack configuration to support both .less and .css files for gradual migration to native CSS. Update entry file discovery and add rules for processing CSS files. * Refactor link-box component: replace .less imports with inline .css imports and delete the link-box.less file to streamline CSS usage. * Remove migration comment from link-box CSS file after transitioning from .less to native CSS. * Add CSS Custom Properties for caching in head.html and remove migration comment from index.less * Integrate css-minimizer-webpack-plugin for improved CSS minification and update webpack configuration to support inline CSS imports during the migration from LESS to native CSS. Add comments for clarity on the migration process in relevant CSS files. * Remove inline migration comments from legacy.less as part of the transition to native CSS, streamlining the codebase. * Migrate 21 simple LESS components to native CSS Convert the simplest component .less files to .css using CSS custom properties (var(--token)) instead of LESS variables, flattened selectors instead of LESS nesting, and hardcoded breakpoint values in @media queries. Components migrated: - book, buttonGhost, buttonLink, category-item, donate, edit-toolbar - header-bar--js, loading-indicator, native-dialog, navEdition - page-banner--tablet, page-history, preview, provider-table - readinglog-stats, searchbox, subNav, throbber, toc, widget-box - work--tablet Parent .less files updated to use @import (inline) for the new .css files. Also adds LESS_TO_CSS_MIGRATION_PLAN.md with the full migration plan. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Migrate 8 medium-complexity LESS components to native CSS Convert components with moderate nesting and variable usage: - buttonBtn, flash-messages, language, modal-links - observationStats, rating-form, readerStats, shareLinks Parent imports updated to @import (inline) across page entries, legacy.less, and component files that reference these. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Migrate batch 5: convert 11 more LESS components to native CSS Convert chart-stats, edit-toolbar--tablet, buttonCta--js, lists-page-cta, admin-table, manage-covers, searchResultItemCta, pagination, read-statuses, pd-dashboard, and page-heading-search-box from .less to .css. Flatten LESS nesting, replace @variables with var(--custom-properties), hardcode breakpoint values in @media queries, and update parent imports to use @import (inline). Add form.olform.less import to page-subject.less to replace the dependency that was embedded in page-heading-search-box.less. Skip toast.less (JS-bundled via Toast.js, requires Phase 3 webpack changes). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Migrate batch 6: convert 8 more LESS components to native CSS Convert ol-message, author-infobox, list-entry, fulltext-snippet, wmd-button-bar, listLists, chart, and ui-dialog from .less to .css. Notable conversions: - ol-message: Pre-computed LESS hue()/saturation() color functions to hardcoded HSL values since the source colors are constants - chart: Hardcoded local LESS variable arithmetic (@chart-height + @chart-bottom-padding = 160px) since calc() is unnecessary for constants Identified Tools--tablet.less and borrowTable.less as orphaned (not imported anywhere) — left as-is for separate cleanup. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Migrate batch 7: convert 10 more LESS components to native CSS Convert buttonsAndLinks, page-banner, metadata-form, fulltext-search-suggestion, fulltext-search-suggestion-item, wmd-prompt-dialog--js, illustration, diff, sort-dropper, and team from .less to .css. Handle sub-import dependencies: - buttonsAndLinks.less imported buttonCta.less, buttonLink.css, buttonGhost.css, and buttonBtn.css — moved these imports to legacy.less - page-banner.less imported buttonBtn.css — moved to header.less - cover.less (passthrough to illustration.less) updated to inline CSS import Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Migrate batch 8: convert 9 more LESS components to native CSS Convert header-bar--tablet, librarian-dashboard, iaBar, header-bar--desktop, check-in, footer, merge-form, home, and ui-tabs from .less to .css. Handle sub-import dependencies: - iaBar.less imported buttonGhost.css — moved to header.less - footer.less imported in 6 parent files — updated all Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert batch 9 LESS components to native CSS: jquery.autocomplete, work-title-and-author, mybooks-dropper, generic-dropper, tagging-menu, mybooks-details Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert batch 10 LESS components to native CSS: form.olform, merge-request-table, cbox, mybooks-menu Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert notes-view, reading-goal, and buttonCta from LESS to native CSS Batch 11: Convert three components to native CSS with flattened selectors, CSS custom properties, and pre-computed color functions. Add missing LESS variable imports (font-families, line-heights, borders) to legacy.less to compensate for variables previously provided by buttonCta.less's index.less import. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert compact-title, nav-bar, and editions from LESS to native CSS Batch 12: Convert three components with pre-computed color functions (darken, mix), flattened deep nesting, hardcoded breakpoints and local LESS arithmetic variables. Move compact-title import from nav-bar to work.less since it's now a separate CSS file. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert read-panel and search-result-item from LESS to native CSS Batch 13: Convert two key components with pre-computed color functions (fade, lighten, desaturate). Hoist sub-imports (preview.css) to legacy.less. Update all parent files that import these components (legacy, carousel, list-showcase, list-follow, work, search-results-container, mybooks-list). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert list-showcase, list-follow, and mybooks-list from LESS to CSS Batch 14: Convert three components with pre-computed local LESS arithmetic (cover overlap calculations), fade() color functions, and BEM nesting. Hoist sub-imports to parent files (mybooks.less, page-book.less). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert header-bar (902 lines) from LESS to native CSS Batch 15: Convert the largest component file with extensive nesting (search component, dropdown menus, app drawer, hamburger component), pre-computed fade() color function, and numerous LESS variables. Pull @Keyframes out of nested selector context to top level. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert carousel, cover, and search-results-container from LESS to native CSS Hoist sub-imports (category-item, loading-indicator, search-result-item, fulltext-snippet) to parent files. Skip carousel--js.less (JS-bundled, requires webpack config change). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert header, mybooks, and work from LESS to native CSS; delete orphaned files Convert the last 3 component .less wrappers (header, mybooks, work) to CSS. Hoist all sub-imports to parent files and add @media-wrapped imports for header-bar tablet/desktop variants. Delete orphaned files (borrowTable.less, iaBar--tablet.less, Tools--tablet.less) that had no importers. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert JS-bundled LESS files to native CSS and add webpack CSS loader Convert carousel--js, toast, js-all, legacy-jquery-ui, legacy-datatables, and SelectionManager from LESS to native CSS. Add webpack css-loader rule to support direct CSS imports from JavaScript modules. Update all JS import paths from .less to .css. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert base/ and layout/ LESS files to native CSS Convert dl, helpers-common, helpers-misc, headings, and common from base/ directory and v2+index from layout/ directory from LESS to native CSS. Flatten nesting, replace LESS variables with CSS custom properties, pre-compute fade() function. Merge layout/v2 into layout/index.css. Remove base/index.less barrel file. Update all parent imports. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert legacy-header, legacy-tools, legacy-wmd, and legacy-borrowTable-adminUser from LESS to native CSS Flatten nesting, replace LESS variables with CSS custom properties, hardcode breakpoints, inline wmd-button-bar.css content into legacy-wmd.css. Update parent imports in legacy.less, page-user.less, and page-admin.less. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert legacy.less CSS rules from LESS nesting to flat CSS with custom properties Flatten all nested LESS selectors and replace LESS variables with CSS custom properties in legacy.less while preserving the LESS import directives that resolve component CSS files at build time. Remove now-unnecessary LESS variable file imports since all variables are replaced with CSS custom properties. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Convert page-*.less entry points from LESS features to native CSS Replace LESS variables with CSS custom properties, flatten all nested selectors, pre-compute LESS functions (fade, desaturate), hardcode breakpoint values in @media queries, and remove unnecessary LESS variable file imports across all 15 page-*.less entry point files. Files retain .less extension for @import (inline) directive processing by the LESS compiler. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Migrate all entry points from .less to .css, eliminating LESS compiler dependency Convert legacy.less and all 15 page-*.less entry points to native .css files using standard CSS @import statements resolved by css-loader. Remove the LESS loader rule and less-plugin-clean-css from webpack.config.css.js since no .less entry points remain. Media-wrapped imports in legacy.css are manually inlined since css-loader doesn't resolve @import inside @media blocks. The only remaining LESS files are the variable definitions in static/css/less/ which are used by generate-css-custom-properties.js to produce the CSS custom properties file loaded globally via <head>. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Update stale .less references in CSS comments to .css Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Remove LESS tooling dependencies and update linting config for CSS The LESS compiler is no longer used for building CSS bundles. Remove less-loader, less-plugin-clean-css, and postcss-less. Update stylelint to lint .css files instead of .less, remove postcss-less custom syntax, and update .stylelintignore. Fix stale .less references in comments and Storybook imports. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Replace LESS token pipeline with hand-maintained tokens.css Convert generated-custom-properties.css to static/css/tokens.css, a hand-editable file with section comments. Delete the LESS variable source files (static/css/less/), the generator script, and remove the `less` npm dependency. Update head.html, Makefile, and webpack config. LESS is now fully removed from the project. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Split tokens.css into individual files with restored comments Break the single tokens.css file into 7 source files in static/css/tokens/ (border-radius, borders, breakpoints, colors, font-families, line-heights, z-index) with the original comments from the LESS variable files restored. tokens.css is now a barrel file with @import statements, compiled by webpack into a single minified file at static/build/css/tokens.css. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Add CSS_CHANGES.md developer guide for LESS removal and native CSS migration. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Fix all CSS lint errors: auto-fix formatting, replace raw z-index values with tokens, add specificity disable comments for pre-existing selectors, and ignore third-party CSS files. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Scope CSS lint globs to static/ and openlibrary/ to exclude vendor submodule CSS files that were incorrectly being linted. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Update CSS_CHANGES.md with lint cleanup details and visual impact assessment. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Add missing buttonCta.css import to page-book.css entry point. The CTA button base styles were missing from book/work pages because buttonCta.css was never imported in page-book.css. Components like read-panel, generic-dropper, list-follow, and editions all reference .cta-btn classes but the defining stylesheet was absent. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Add buttonCta.css import to page-home, page-subject, and page-team entry points. buttonCta.css defines the base .cta-btn styles (colors, sizing, variants) that are referenced by many components across the site. It was only directly imported in page-signup.css and page-book.css. All other pages either got it via legacy.css or were missing it entirely. Now all page entry points include buttonCta.css, ensuring CTA buttons render correctly everywhere. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Fix button specificity and restore original border-radius values across 15 CSS files. Add a.cta-btn-- prefixed selectors to buttonCta.css to fix anchor-based CTA buttons losing styles due to specificity conflict with a:link in common.css. Replace incorrect var(--border-radius-button) (4px) token with original hardcoded values (3px, 5px, or 6px) from LESS source files. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Add missing book.css import to page-home, page-subject, and page-book entry points. During the LESS to CSS migration, carousel.less had a transitive import of book.less that was dropped. This caused .book component styles (cover height, image box-shadow, border-radius) to be missing from all carousel pages. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Remove CSS_CHANGES.md and LESS_TO_CSS_MIGRATION_PLAN.md as part of the complete migration from LESS to native CSS. All references to LESS have been eliminated, and the documentation is no longer needed. This finalizes the transition to a fully CSS-based styling approach. * Refactor styles across multiple components to transition from LESS to native CSS. This includes removing LESS-specific syntax, updating style definitions, and ensuring consistent styling practices. Key changes involve restructuring CSS rules for better specificity and organization, as well as enhancing hover effects and animations for various UI elements. This finalizes the migration to a fully CSS-based styling approach. * Update pre-commit configuration and workflows to remove LESS references and enforce CSS-only styling. Adjusted stylelint settings to target only CSS files, removed LESS from workflow triggers, and updated documentation to reflect the transition to native CSS. This continues the effort to finalize the migration from LESS to CSS. * Add tagging-menu.css import to page-book entry point (from upstream PR internetarchive#11719) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Add shareLinks.css import to page-book entry point Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * bring back LESS vars as css custom properties * Update .stylelintignore to restore CSS token files and modify SelectionManager.css to disable stylelint rules for hex and named colors. * Refactor CSS variable declaration in MergeTable.vue to use :host selector for improved encapsulation --------- Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Adds "Edit Subjects" button to subjects section of book pages. The button will only be rendered for authenticated members of the following usergroups:
/usergroup/admin/usergroup/super-librarians/usergroup/librariansPressing the button will add the work key to the ILE's selected records and display the bulk tagger. When changes are submitted via a book page, the ILE is reset and the page is reloaded.
Technical
Testing
Screenshot
Stakeholders