-
Notifications
You must be signed in to change notification settings - Fork 61
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
How do I customise? #25
Comments
@mstnorris I'm using this via npm in another project, and this is what my @import 'variables'; // Must appear before tachyons.scss
@import '~tachyons-sass/tachyons.scss'; In the $red: #ff0000; Hope this helps. |
That said, it doesn't have nearly as many customization options as Might be worth looking into that repo if you intend to customize a lot of things. |
Thanks for the assist @ptrikutam! I'm realizing right now that we should probably be transpiling |
For those who are newly arriving to this issue, as of #28 we can now adjust any of the variables that were available to The same approach outlined in this comment applies. |
@ptrikutam, @johnotander What about adding more MQ breakpoints? We can currently override variables (and thus existing breakpoints), but there doesn't seem to be a way to generate a new breakpoint for all affected components, for example Would you have any suggestions or pointers as to how this could be approach using this project? |
@matthewmorek Adding more MQ breakpoints wouldn't do anything by default, since these variables are specific to what various Tachyons classes depend on ( That said, totally makes sense that you'd want to do something like that. One approach to take is to create a separate file with your own custom Tachyons-inspired classes and add the Hopefully this makes sense. @johnotander can of course correct anything I'm saying above because he's far more qualified than I to be answering these questions :) |
I realise that this project depends on the main codebase, but I feel this isn't exactly useful. We use Sass/SCSS not only as a format, but also for its ability to compile different, sometimes very complex structures into solid CSS. Right now, this repo allows us to add Tachyons to our pipeline with cosmetic modifications to its variables, but without a pluggable ability to extend its use beyond defaults. In this context would it not make more sense to have a Sass codebase of this particular project written in a way that automates generation of classes and prefixes/suffixes and is only kept feature-compliant with the main project? If left untouched, it would compile straight to what Just my 2 cents to the pot... PS.: Since I use this project very often, I'd be keen to work on this and help shape/upkeep the project. |
I'm all for implementing this project in a way that allows media queries to be more customizable. I do wonder if this is something that can still be achieved via transpiling from the source repo. Perhaps by stripping media queries and adding a Sass function to mq-ify on a per file basis (when media queries are detected)? Regardless, this is definitely something we'd like to support so happy to look at a WIP PR or discuss potential solutions. And of course we'd be glad to have your help to shape and upkeep this project @matthewmorek 😸 |
As I read this, @johno 's last comment is just shy of three years old. I am finding myself in a similar situation, where I would like to either add additional, or modify existing breakpoints. With three years worth of "water under the bridge", I'm curious if there has been any further progress on this issue? |
I'd like to be able to add some new MQ enabled classes, such as .no-shadow, .no-shadow-ns, etc.. Seems like a common enough use case to justify enabling a way to do so without requiring SCSS transpiling. Perhaps I'm missing something though, and this is entirely possible with an existing workaround? |
I'm using webpack (Laravel Mix) within a Laravel 5.5 project.
In my default app.scss file where I import tachyons.scss, I would also like to define some other colours for example and have them be picked up and prefixed with bg- for background colours.
It would be good to have some more information around how to customise without touching the source files.
The text was updated successfully, but these errors were encountered: