Working with Timber for a new shopify theme from scratch. Typically working with sass in the past i would use node-sass to compile locally. this obviously doesn't work as the timber.scss.liquid file has shopify assets in it. However using theme kit I don't get any feedback for any sass errors.
What's the best way to get feedback from theme-kit / shopify regarding sass compilation errors while developing? Or do we not edit the timber.scss.liquid file at all and write stand alone scss files?
as per #drip answer. I switched back to slate. I first tried it when it first released 1.0 so it was buggy, but now it's usable. Nice little tool.
Related
I have setup a new rails 7 project with Bootstrap 5.2 and Sass, however when it comes to adding in custom styling (with Sass) Rails appears to not be compiling the Sass styling into app/assets/stylesheets/application.css. I have no errors to go off here and after spending far too long on the problem, decided to start fresh with the following setup instructions - https://railsbytes.com/public/templates/V2Gsg9
I had to remove the #import "bootstrap" code below as this throws a compilation error.
append_file 'app/assets/stylesheets/application.scss', <<-CODE
#import "bootstrap";
CODE
I'm unsure if this is relevant to the issue, however I was having issues with the bootstrap setup, where the JavaScript was not working, and followed the following setup from another stackoverflow https://stackoverflow.com/questions/70907799/bootstrap-5-javascript-functions-not-working-in-rails-7-app which has fixed this issue.
In summary, the only problem I'm now facing is that the css is not compiling. I found a number of other resources related to the same issue, however the setup is slightly different and when I try to run the solutions provided it does not work. I have seen multiple posts suggesting to attempt to run rails assets:precompile, which I did, however it broke all the styling setup and couldn't revert it back for some reason (part of the reason whey I started on a new project).
In addition to the new setup, I also tried this suggestion by "stevec" in the following https://stackoverflow.com/questions/71300845/custom-css-not-working-with-css-bundling-for-rails-7. This works, however it doesn't seem to be the Rails way of doing things. This suggests each stylesheet needs to be added to the app/assets/config/manifest.js and also to the application.html.erb file. To my understanding, each view should have its own style sheet which is then imported into application.css.
I feel I'm close to the solution but am finding it challenging at the moment to understand the documentation on the asset pipeline... Some recommendations suggest to install yarn/npm however I thought that's the benefit/job of importmap so have not gone down that path
I'm a graphic designer who just started learning Laravel this week, recently I've been searching how to install the latest bootstrap version in my project correctly, which is all I need to be honest and I'm not too comfortable with other options like Tailwind.
As some tutorials and answers have suggested I ended up compiling and using a famous project named laravel/ui, sadly the resulting version comes with a few changes, that just doesn't look as good in my opinion (different fonts like Nonito, colors and margins)
So now I'm wondering...
Why is it not recommended to just add the CDN links in my master template?
Is it possible to update this compiled CSS somehow to make it look as the CDN?
Sorry if this questions might be opinion based, but I'm really out of places to ask, seems like the documentation for Laravel 8.x has removed everything related to Frontend, which are making thing even more confusing for me with all these options Laravel offers.
I can't get ruby running and i dont want to go through all the hurdles of fighting with my osx version of ruby.
I downloaded dart sass which has no support for compass since it's deprecated. I'm trying to get my old sass code to work while I work on replace all my mixin that I used that rely on compass.
Is there a way I can download the compass/css3 mixin stylesheet?
I found their site http://compass-style.org/reference/compass/css3/ other than going through each page and copying all the code. Is there no master code file that I can download all the mixins?
Thank you.
I am new to SASS. I am using this as a guide to learn Bourbon -
http://www.git-tower.com/learn/bourbon-neat-bitters/getting-ready/introduction
I followed all the instructions and it displays fine on my local machine. But when I edit _layout.scss, it doesn't compile to styles.css. I installed Compass and had it watch the project folder, but same results. My changes won't take.
Am I missing a step?
This is likely more of a sass importing/file-name issue than anything specifically with bourbon. I'd check out http://sass-lang.com/guide . Sass-lang put together a really nice guide to sass that includes things like imports, etc.
Also, Compass app can bring some things to the party that can conflict with Bourbon. I'd recommend using the sass app or a desktop app like https://prepros.io which can be easier starting out.
Hope this helps 🍻
The UI developers touch the CSS, but given that Sass's workflow creates CSS, would any machine that displays the app (servers included?) need to have Ruby and Sass installed to view the app properly?
Or is it enough for anyone just working on the UI to have Ruby and Sass installed, in which case updating the CSS is done by a UI guy, and then the rendered file can be committed to be viewed and used by all?
You only need Ruby to compile Sass, the app will use the CSS (in fact, you don't need Sass files on your production app).
So only the people who are susceptible to work on the UI need to have Ruby (ans Sass) installed.
Sidenote:
Some frameworks allow on-the-fly Sass compilation (I'm thinking to Laravel-SASS for example). In this case, everyone need to have both Ruby ans Sass installed.