Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ejecting dark-mode.css prevents the CSS from compiling? #822

Open
swombat opened this issue May 6, 2024 · 2 comments
Open

Ejecting dark-mode.css prevents the CSS from compiling? #822

swombat opened this issue May 6, 2024 · 2 comments

Comments

@swombat
Copy link
Contributor

swombat commented May 6, 2024

Not sure if it's just me. Repeatably works here:

Steps:

bin/dev

Check that everything works fine. Ctrl-C to kill the server.

bin/resolve bullet_train-themes-light-1.7.2/app/assets/stylesheets/light/tailwind/dark-mode.css --eject
bin/dev

CSS compilation now blows up with:

17:42:50 light-css.1        | [Error: ENOENT: no such file or directory, stat '/Users/danieltenner/dev/[redacted]/app/assets/stylesheets/light/application.css'] {
17:42:50 light-css.1        |   errno: -2,
17:42:50 light-css.1        |   code: 'ENOENT',
17:42:50 light-css.1        |   syscall: 'stat',
17:42:50 light-css.1        |   path: '/Users/danieltenner/dev/[redacted]/app/assets/stylesheets/light/application.css'
17:42:50 light-css.1        | }
17:42:52 light-mailer-css.1 | [Error: ENOENT: no such file or directory, stat '/Users/danieltenner/dev/[redacted]/app/assets/stylesheets/light/application.css'] {
17:42:52 light-mailer-css.1 |   errno: -2,
17:42:52 light-mailer-css.1 |   code: 'ENOENT',
17:42:52 light-mailer-css.1 |   syscall: 'stat',
17:42:52 light-mailer-css.1 |   path: '/Users/danieltenner/dev/[redacted]/app/assets/stylesheets/light/application.css'
17:42:52 light-mailer-css.1 | }

Remove the offending CSS:

rm app/assets/stylesheets/light/tailwind/dark-mode.css
bin/dev

Server still bugs out with the same error. Remove the (empty) directory:

rm -rf app/assets/stylesheets/light

Server now starts fine.

I'm guessing that the empty /light directory is the problem. This suggests a workaround of also ejecting application.css in the tailwind directory but... no, that doesn't work either.

This means that there are some hard override of styles that are hardcoded and very hard to get rid of. Not sure what a good solution is here.

@swombat
Copy link
Contributor Author

swombat commented May 6, 2024

Ok, there is a workaround.

Pick up the styles you don't like, and define them at the bottom of you application.css:

/* Override these from the hardcoded theme stuff */
@layer utilities {
  @media (prefers-color-scheme: dark) {
    /* Trix Editor */
    trix-editor {
      @apply bg-primary-900 border-neutral-800 !important;

      &:focus, &:active {
        @apply bg-primary-800 border-primary-500 !important;
      }
    }

    trix-toolbar {
      @apply opacity-50 !important;

      &.visible {
        @apply opacity-100 !important;
      }

      .trix-button-group, .trix-button {
        @apply border-slate-400 !important;
      }

      .trix-button:disabled::before {
        @apply opacity-25;
      }
    }

    .tribute-container {
      ul {
        @apply bg-slate-800 border-slate-900 !important;
      }
    }

    .trix-dialogs {
      @apply bg-slate-800 border-slate-900 !important;
    }

    .trix-content a[href^="bullettrain://"] {
      @apply text-white bg-slate-500;
    }
  }
}

This does the job.

@swombat
Copy link
Contributor Author

swombat commented May 6, 2024

(doesn't solve the fact that these styles probably shouldn't be hidden so deep in the theme?)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant