Clean up leftover SCSS

Created on 20 December 2021, over 2 years ago
Updated 22 June 2023, about 1 year ago

Problem/Motivation

The 5.x radix theme has removed the ability to compile SASS from the base theme, however there are still 3 SCSS partial files located inside sub-folders of the src/components folder.

  1. src/components/forum/_forum.scss (Drupal core module specific)
  2. src/components/nav/_navbar.scss (Drupal overrides inside bootstrap component context)
  3. src/components/offcanvas/_offcanvas.scss (Drupal component style overrides)

Steps to reproduce

Proposed resolution

Decide whether the SCSS partials should be removed or moved to the starterkit.

Remaining tasks

User interface changes

API changes

Data model changes

πŸ› Bug report
Status

Fixed

Version

5.0

Component

Code

Created by

πŸ‡ͺπŸ‡¨Ecuador jwilson3

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

  • πŸ‡ΊπŸ‡ΈUnited States jcandan

    For those coming here from Google. I also experienced issues in my CI pipeline (not having this issue locally).

    ERROR in ./src/scss/main.style.scss
    Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
    ModuleBuildError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
    SassError: Can't find stylesheet to import.
      β•·
    7 β”‚ @import '../../contrib/radix/src/components/navbar/navbar';
      β”‚         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
      β•΅
      src/scss/main.style.scss 7:9  root stylesheet
    

    Removed these 3 lines from our sub-theme's ./src/scss/main.style.scss. CI pipeline completed without error.

  • Status changed to Needs work over 1 year ago
  • Opening this back again, have to move that to the subtheme itself instead of the parent theme

  • Moved offcanvas within the subtheme and got rid of forum and navbar, it wasn't really necessary to keep those

  • Status changed to Fixed over 1 year ago
    • doxigo β†’ committed 3888561c on 5.0.x
      Issue #3255272 by jwilson3, doxigo, jcandan: Clean up leftover SCSS
      
  • πŸ‡ΊπŸ‡ΈUnited States kbaringer

    Hi @doxigo, thanks for keeping the Radix theme up-to-date!! I only just started using it for a new project this week and found the process to set up a subtheme really straightforward. However, when I updated the Radix parent theme from 5.0.7 to 5.0.8 yesterday it broke the Bootstrap styled Search form in the Navbar of my subtheme.
    Instead of the inline magnifying glass icon inside the form field it now has a separate 'Search' button. This causes the field to wrap, which pushes the whole navbar down (see screenshot).

    I haven't had time to dig into the way Bootstrap is implemented and debug this issue (since the whole point of using the Radix theme was to save time), but it seems like this regression was caused by this change.
    As was mentioned in this thread, I manually commented out the lines in /src/scss/main.style.scss that imported styles from the parent theme (including for the navbar):

    // Parent Drupal related components
    // -----------------------------------------------------------------------------
    // @import "../../contrib/radix/src/components/navbar/navbar";
    // @import "../../contrib/radix/src/components/forum/forum";
    // @import "../../contrib/radix/src/components/offcanvas/offcanvas";

    Is it possible that the scss that was being imported from the parent is what enabled the inline Bootstrap search bar styles?

  • Status changed to Needs work over 1 year ago
  • πŸ‡ΊπŸ‡ΈUnited States tstermitz

    Please add a comment to the release notes for releases after 5.0.7 that it is necessary and safe to comment out these three lines, and move the offcanves.scss to your custom theme - if it is indeed safe to do that. I didn't immediately notice any issues after doing so.

  • Status changed to Fixed about 1 year ago
  • Automatically closed - issue fixed for 2 weeks with no activity.

Production build 0.69.0 2024