ocelot-Social-Community/Ocelot-Social
1
0
Fork 0
mirror of https://github.com/Ocelot-Social-Community/Ocelot-Social.git synced 2025-12-13 07:46:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #6362 from Ocelot-Social-Community/6340-refactor-webapp-event-teaser-ribbon-optimisation

Browse Source 
refactor(webapp): changed color for event-ribbon.
This commit is contained in:
Hannes Heine 2023-06-05 14:37:36 +02:00 committed by GitHub
commit 684b151a24
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 17 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
webapp/assets/_new/styles/tokens.scss
View File

@ -90,6 +90,9 @@ $background-color-primary-inverse: rgb(241, 253, 244);
$background-color-secondary: rgb(0, 142, 230);
$background-color-secondary-active: rgb(10, 161, 255);
$background-color-secondary-inverse: rgb(240, 249, 255);
$background-color-third: rgb(126, 82, 204);
$background-color-third-active: rgb(160, 103, 255);
$background-color-third-inverse: rgb(239, 230, 255);
$background-color-success: rgb(23, 181, 63);
$background-color-success-active: rgb(26, 203, 71);
$background-color-success-inverse: rgb(241, 253, 244);
@ -395,3 +398,12 @@ $color-toast-orange: $color-warning;
$color-toast-yellow: $color-yellow;
$color-toast-blue: $color-secondary;
$color-toast-green: $color-success;
/**
* @tokens Ribbon Color
*/
$color-ribbon-event: $background-color-third;
$color-ribbon-event-active: $background-color-third-active;
$color-ribbon-article: $background-color-secondary;
$color-ribbon-article-active: $background-color-secondary-active;

8
webapp/components/Ribbon/index.vue
View File

@ -25,7 +25,7 @@ export default {
padding: $size-ribbon $size-ribbon;
border-radius: $border-radius-small 0 0 $border-radius-small;
color: $color-neutral-100;
background-color: $background-color-secondary-active;
background-color: $color-ribbon-article-active;
font-size: $font-size-x-small;
font-weight: $font-weight-bold;
@ -36,7 +36,7 @@ export default {
bottom: -$size-ribbon;
border-width: $border-size-large 4px $border-size-large $border-size-large;
border-style: solid;
border-color: $background-color-secondary transparent transparent $background-color-secondary;
border-color: $color-ribbon-article transparent transparent $color-ribbon-article;
}
&.--pinned {
@ -48,10 +48,10 @@ export default {
}
}
.eventBg {
background-color: $color-success-active;
background-color: $color-ribbon-event-active;
&::before {
border-color: $color-success-active transparent transparent $color-success-active;
border-color: $color-ribbon-event transparent transparent $color-ribbon-event;
}
}
</style>

2
webapp/locales/en.json
View File

@ -716,7 +716,7 @@
"unpin": "Unpin post",
"unpinnedSuccessfully": "Post unpinned successfully!"
},
"name": "Post",
"name": "Article",
"pinned": "Announcement",
"takeAction": {
"name": "Take action"