Skip to content

New group rounded feature and small color fix control themes#49

Merged
Spiderpig86 merged 5 commits intoSpiderpig86:masterfrom
FlorianWoelki:master
Nov 15, 2020
Merged

New group rounded feature and small color fix control themes#49
Spiderpig86 merged 5 commits intoSpiderpig86:masterfrom
FlorianWoelki:master

Conversation

@FlorianWoelki
Copy link
Copy Markdown
Contributor

Description

Sorry for so much PR's :D

I've added a common use case for actual rounding group tags. I think it should be pretty useful for some use cases. Furthermore, there are rounded tags so why not having grouped rounded tags ;)

In addition, I've added the primary color to the control themes. This fix resolved that primary colored closing tags are not clickable.

Type of change

Please delete options that are not relevant.

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • This change requires a documentation update

How Has This Been Tested?

You can see the result of the new rounded grouping tags in the image below:
image

  1. tag container without grouped or rounded
  2. grouped tag container
  3. grouped and rounded tag container

Copy link
Copy Markdown
Owner

@Spiderpig86 Spiderpig86 left a comment

Choose a reason for hiding this comment

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

Overall, thanks for the new addition of the tags. I see you're hard at work on adding some new things which are welcome. Please address the comments and I'll review again.

Comment thread src/ext/tags.scss Outdated
border-radius: 0;
&.group-tags {
/* Round first and last tag in the grouped tags */
&.group-rounded {
Copy link
Copy Markdown
Owner

Choose a reason for hiding this comment

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

To try to stick to BEM naming conventions moving forward, we should name this group-tags--rounded.

@hound hound Bot deleted a comment from Spiderpig86 Nov 14, 2020
@hound hound Bot deleted a comment from Spiderpig86 Nov 14, 2020
@hound hound Bot deleted a comment from Spiderpig86 Nov 14, 2020
@hound hound Bot deleted a comment from Spiderpig86 Nov 14, 2020
@hound hound Bot deleted a comment from Spiderpig86 Nov 14, 2020
@hound hound Bot deleted a comment from Spiderpig86 Nov 14, 2020
@hound hound Bot deleted a comment from Spiderpig86 Nov 14, 2020
@hound hound Bot deleted a comment from Spiderpig86 Nov 14, 2020
@hound hound Bot deleted a comment from Spiderpig86 Nov 14, 2020
@hound hound Bot deleted a comment from FlorianWoelki Nov 14, 2020
Comment thread src/ext/tags.scss
}

&:last-child {
border-radius: 0 290486px 290486px 0;
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Shorthands of length 4 are not allowed. Value was 0 290486px 290486px 0

Comment thread src/ext/tags.scss
// Round first and last tag in the grouped tags
&--rounded .tag {
&:first-child {
border-radius: 290486px 0 0 290486px;
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Shorthands of length 4 are not allowed. Value was 290486px 0 0 290486px

Comment thread src/ext/tags.scss
}

&:last-child {
border-radius: 0 0.25rem 0.25rem 0;
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Shorthands of length 4 are not allowed. Value was 0 0.25rem 0.25rem 0

Comment thread src/ext/tags.scss
&:not(:first-child):not(:last-child) {
border-radius: 0;
&:first-child {
border-radius: 0.25rem 0 0 0.25rem;
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Shorthands of length 4 are not allowed. Value was 0.25rem 0 0 0.25rem

Comment thread src/ext/tags.scss
&.group-tags {
.tag,
&--rounded .tag {
margin-right: 0 !important;
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

!important should not be used

Comment thread src/ext/tags.scss
/* Used for grouping tags together */
&.group-tags .tag {
margin-right: 0 !important;
&.group-tags {
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Line should be indented 2 spaces, but was indented 4 spaces

Copy link
Copy Markdown
Owner

@Spiderpig86 Spiderpig86 left a comment

Choose a reason for hiding this comment

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

Looks good!

@Spiderpig86 Spiderpig86 merged commit 8efe36e into Spiderpig86:master Nov 15, 2020
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

Successfully merging this pull request may close these issues.

2 participants