Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-06-07 18:44:08 +00:00
Code Issues Actions Projects Releases Wiki Activity

socialissues badge style in multiselect

Browse Source
This commit is contained in:
Mathieu Jaumotte 2021-08-21 12:38:26 +02:00
parent 87a917d11c
commit 9c25132216
3 changed files with 19 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/Bundle/ChillPersonBundle/Resources/public/chill/scss/mixins.scss
View File

@ -14,7 +14,7 @@ $social-action-color: $orange;
content: '\f04b';
font-family: ForkAwesome;
color: $social-issue-color;
margin: 0 0.3em 0 -0.7em;
margin: 0 0.3em 0 -0.75em;
}
}
@ -31,6 +31,6 @@ $social-action-color: $orange;
content: '\f04b';
font-family: ForkAwesome;
color: $social-action-color;
margin: 0 0.3em 0 -0.7em;
margin: 0 0.3em 0 -0.75em;
}
}

30
src/Bundle/ChillPersonBundle/Resources/public/chill/scss/person_with_period.scss
View File

@ -41,38 +41,12 @@ div.list-with-period {
div.date {}
div.user {}
}
}
/*
div.header,
div.list-content {
width: calc(100% - 40px);
margin-left: 40px;
}
div.header {
position: relative;
a.btn {
position: absolute;
width: 30px;
height: 30px;
top: 10px;
left: -40px;
padding: 0;
i {
padding: 5px;
}
}
span.user {
margin-left: 1em;
}
}
div.list-content {
div.list {
span.more {
font-style: italic;
}
}
*/
}
}
/// TODO

19
src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/SocialIssue.vue
View File

@ -73,16 +73,27 @@ export default {
</script>
<style src="vue-multiselect/dist/vue-multiselect.css"></style>
<style lang="scss">
@import 'ChillMainAssets/module/bootstrap/shared';
@import 'ChillPersonAssets/chill/scss/mixins';
span.multiselect__tag {
background: var(--bs-chill-orange);
@include badge_social_issue;
background: $chill-l-gray;
color: $dark;
}
span.multiselect__option--highlight {
&::after {
background: var(--bs-chill-green);
background: $green;
}
&.multiselect__option--selected::after {
background: var(--bs-chill-red);
&.multiselect__option--selected {
&::after {
background: $red;
}
}
}
</style>