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.

Sign up for GitHub

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

Jump to bottom

feat(core): add scss mixin support #165

Merged
merged 2 commits into from
Feb 2, 2021
Merged

feat(core): add scss mixin support #165

merged 2 commits into from
Feb 2, 2021

Conversation

WynieCronje
Copy link
Contributor

PR Checklist

Please check if your PR fulfills the following requirements:

  • The commit message follows Conventional Commits
  • Tests for the changes have been added (for bug fixes / features)
  • Docs have been added / updated (for bug fixes / features)

PR Type

What kind of change does this PR introduce?

  • Bugfix
  • Feature
  • Refactoring (no functional changes, no api changes)
  • Other... Please describe:

What is the current behavior?

SASS users cant use

@import '~@taiga-ui/core/styles/taiga-ui-local';

Closes #164

What is the new behavior?

SASS users can safely use below

@import '~@taiga-ui/core/styles/taiga-ui-local';

Does this PR introduce a breaking change?

  • Yes
  • No

Other information

@WynieCronje
Copy link
Contributor Author

I added new files next to less files as a reminder to change scss files when working on less files:

image

@WynieCronje
Copy link
Contributor Author

@waterplea do not accept yet. Found an issue

@WynieCronje
Copy link
Contributor Author

I realized my SASS was outdated from previous branch.

@WynieCronje
Copy link
Contributor Author

@waterplea do not accept yet. Found an issue

Been fixed

MarsiBarsi
MarsiBarsi approved these changes Feb 2, 2021
View reviewed changes
Copy link
Collaborator

@MarsiBarsi MarsiBarsi left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you very much!

@MarsiBarsi MarsiBarsi merged commit 865bbaa into taiga-family:main Feb 2, 2021
fynnfeldpausch added a commit to mindsmash/taiga-ui that referenced this pull request Feb 4, 2021
@fynnfeldpausch
Merge branch 'main' into coyo-ui
452a216 
* main: (29 commits)
  feat(i18n): add Dutch with 100% support (taiga-family#206)
  chore(i18n): add Turkish to exports
  feat(i18n): add Turkish with 100% support (taiga-family#200)
  chore(demo): fix import sample
  chore(changelog): fix incorrect generated logs
  chore(release): 2.4.0
  chore(docs): update styles on getting-started
  feat(core): add scss mixin support (taiga-family#165)
  chore(i18n): add german to exports
  feat(i18n): Add german localisation (taiga-family#198)
  fix(core): `Button` fix margin for right aligned icons (taiga-family#173)
  chore(demo): fix dark theme landing
  feat(i18n): add Spanish with 100% support (taiga-family#191)
  fix(button): fix button loader size for XL (taiga-family#174)
  feat(kit): use lazy loading strategy in avatar component (taiga-family#185)
  chore(demo): fix typo
  chore(demo): fix customization examples
  chore(changelog): fix incorrect generated logs
  chore(release): 2.3.0
  fix(core): `Svg` properly use Angular `Sanitizer` (taiga-family#170)
  ...

# Conflicts:
#	projects/core/components/button/button.style.less
#	projects/core/components/hints-host/hint-box/hint-box.style.less
#	projects/core/components/notification/notification.style.less
#	projects/core/components/primitive-checkbox/primitive-checkbox.style.less
#	projects/core/styles/theme/variables.less
#	projects/demo/src/modules/app/home/home.template.html
#	projects/kit/components/accordion/accordion-item/accordion-item.style.less
#	projects/kit/components/input-count/input-count.style.less
#	projects/kit/components/input-tag/input-tag.style.less
#	projects/kit/components/tag/tag.style.less
@JohanHeyvaert
Copy link

JohanHeyvaert commented Feb 16, 2021 •
edited
Loading

I don't think this change allows us to use the grid mixins from a scss file, or does it?
The grid mixins are in markup/tui-row.less. I don't see a scss version of the files in the markup directory.

Side question 1: why there is not a scss version of taiga-ui-global.less (which import tui-row.less)? Probably because the files in markup don't have a scss version yet either?
Side question 2: when would one use taiga-ui-global.less instead of taiga-ui-local.less?

Thanks for your response!

@waterplea
Copy link
Collaborator

Hi @JohanHeyvaert
Grid is in global styles. These are global classes and not mixins. There is no SCSS global file because it doesn't matter what it uses, you just add it to angular.json and Angular does everything you need. You add global there once. You add local whenever you need to use a mixin in a file.

I would recommend to use your own layout classes or some dedicated library like Tailwind. Global classes are somewhat limited in Taiga UI and I believe we should drop most of them someday in a major release. We cannot compete with dedicated solutions 🙂

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@waterplea waterplea waterplea approved these changes

@MarsiBarsi MarsiBarsi MarsiBarsi approved these changes

Assignees
No one assigned
Labels
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

[FEATURE] Add mixin support for SASS
4 participants
@WynieCronje @JohanHeyvaert @waterplea @MarsiBarsi