diff --git a/src/app/annuaire/result-list/result-list.component.scss b/src/app/annuaire/result-list/result-list.component.scss
index 565fd658bd5e96002efd5af0296f0acdd1abd9a1..79527a574a9d799e4deadabe2471aede1c26cf0c 100644
--- a/src/app/annuaire/result-list/result-list.component.scss
+++ b/src/app/annuaire/result-list/result-list.component.scss
@@ -45,58 +45,6 @@
flex-direction: column;
gap: 16px;
padding-right: 8px;
- .singleUser {
- display: flex;
- align-items: center;
- min-height: 100px;
- padding: 1rem;
- box-sizing: border-box;
- cursor: pointer;
- border-radius: 8px;
- border: 1px solid $grey-7;
- justify-content: space-between;
- gap: 1rem;
- transition: all 0.2s ease-in-out;
-
- &:hover {
- border-color: $grey-4;
- }
-
- .left {
- display: flex;
- align-items: center;
- gap: 1.5rem;
- .identity {
- display: flex;
- flex-direction: column;
- gap: 0.5rem;
- max-width: 330px;
- .name {
- font-weight: bold;
- }
- .job {
- color: $grey-3;
- }
- .appointment {
- display: flex;
- align-items: center;
- gap: 0.5rem;
- span {
- @include font-bold-14;
- }
- }
- }
- }
- .right {
- display: flex;
- align-items: center;
- gap: 1.5rem;
- color: $grey-4;
- .employer {
- color: $grey-3;
- }
- }
- }
}
.noResult {
diff --git a/src/app/contact/contact.component.scss b/src/app/contact/contact.component.scss
index 7799d1448a375fd46233e60027b293e4e46d9533..ebd60c1133466c28facc227a1cbd2bd4abb5f6a5 100644
--- a/src/app/contact/contact.component.scss
+++ b/src/app/contact/contact.component.scss
@@ -2,7 +2,6 @@
@import 'layout';
@import 'breakpoint';
@import 'typography';
-@import 'shapes';
@import 'z-index';
.contactForm {
diff --git a/src/app/form/form-view/personal-offer-form/personal-offer-accompaniment/personal-offer-accompaniment.component.scss b/src/app/form/form-view/personal-offer-form/personal-offer-accompaniment/personal-offer-accompaniment.component.scss
deleted file mode 100644
index 46e81fc093176def48681a01e61f2bd8cd3435b4..0000000000000000000000000000000000000000
--- a/src/app/form/form-view/personal-offer-form/personal-offer-accompaniment/personal-offer-accompaniment.component.scss
+++ /dev/null
@@ -1 +0,0 @@
-@import 'buttons';
diff --git a/src/app/form/form-view/personal-offer-form/personal-offer-accompaniment/personal-offer-accompaniment.component.ts b/src/app/form/form-view/personal-offer-form/personal-offer-accompaniment/personal-offer-accompaniment.component.ts
index 9ee5fc01ea1334270d185dec0b2443157d7d08c5..d9d4b13619a9ff9874aec44be39a8a9009ba2a91 100644
--- a/src/app/form/form-view/personal-offer-form/personal-offer-accompaniment/personal-offer-accompaniment.component.ts
+++ b/src/app/form/form-view/personal-offer-form/personal-offer-accompaniment/personal-offer-accompaniment.component.ts
@@ -5,7 +5,6 @@ import { Category } from '../../../../structure-list/models/category.model';
@Component({
selector: 'app-personal-offer-accompaniment',
templateUrl: './personal-offer-accompaniment.component.html',
- styleUrls: ['./personal-offer-accompaniment.component.scss'],
})
export class PersonalOfferAccompanimentComponent implements OnInit {
@Input() structureName: string;
diff --git a/src/app/form/form-view/structure-form/structure-name-and-address/structure-name-and-address.component.html b/src/app/form/form-view/structure-form/structure-name-and-address/structure-name-and-address.component.html
index 44602a6f50c4d4fec7c5f81790a0ed5400fc27a1..b54bc80a592a49db29fc006f9924fb2f706a587b 100644
--- a/src/app/form/form-view/structure-form/structure-name-and-address/structure-name-and-address.component.html
+++ b/src/app/form/form-view/structure-form/structure-name-and-address/structure-name-and-address.component.html
@@ -12,13 +12,12 @@
[value]="structureForm.get('structureName').value"
(valueChange)="structureForm.get('structureName').setValue($event); setValidationsForm()"
/>
- <div class="addressRow">
- <app-address-autocomplete
- [form]="structureForm"
- [address]="structureForm.get('address').valid ? structureForm.get('address').value : null"
- (inputAddress)="setAddressStructure()"
- (selectedAddress)="setAddressStructure($event)"
- />
- </div>
+
+ <app-address-autocomplete
+ [form]="structureForm"
+ [address]="structureForm.get('address').valid ? structureForm.get('address').value : null"
+ (inputAddress)="setAddressStructure()"
+ (selectedAddress)="setAddressStructure($event)"
+ />
</div>
</form>
diff --git a/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-address/orientation-structure-address.component.html b/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-address/orientation-structure-address.component.html
index 15d778e82bfcab89b78facc96d79c69acaf82e14..a77c625340b2b63d8c24053379fc794a19059cbc 100644
--- a/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-address/orientation-structure-address.component.html
+++ b/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-address/orientation-structure-address.component.html
@@ -4,15 +4,13 @@
<p>Facultatif</p>
</div>
<div class="form-group">
- <div class="addressRow">
- <app-address-autocomplete
- [form]="form"
- [wide]="true"
- [required]="false"
- [address]="form.get('address').valid ? form.get('address').value : null"
- (inputAddress)="setAddressStructure()"
- (selectedAddress)="setAddressStructure($event)"
- />
- </div>
+ <app-address-autocomplete
+ [form]="form"
+ [wide]="true"
+ [required]="false"
+ [address]="form.get('address').valid ? form.get('address').value : null"
+ (inputAddress)="setAddressStructure()"
+ (selectedAddress)="setAddressStructure($event)"
+ />
</div>
</form>
diff --git a/src/app/header/header.component.scss b/src/app/header/header.component.scss
index de68e365d3281aee8609af37569d998b8e96687a..79cd170eb32120456dae5672029e2ae507150c49 100644
--- a/src/app/header/header.component.scss
+++ b/src/app/header/header.component.scss
@@ -2,8 +2,6 @@
@import 'layout';
@import 'color';
@import 'breakpoint';
-@import 'shapes';
-@import 'buttons';
@import 'z-index';
header {
@@ -52,22 +50,6 @@ header {
}
}
-button {
- @include btn-grey;
- &.red {
- @include btn-red;
- border: none;
- // user name ellipsis handling
- white-space: nowrap;
- width: 100px;
- overflow: hidden;
- text-overflow: ellipsis;
- }
- &:focus-visible {
- outline: 1px solid $black;
- }
-}
-
a {
color: $grey-2;
height: 100%;
diff --git a/src/app/map/components/map.component.scss b/src/app/map/components/map.component.scss
index e26bad08b5569579902ef9547eee995f2aae65d3..9f1584742f7517e10e2c97285c7e98282db34b99 100644
--- a/src/app/map/components/map.component.scss
+++ b/src/app/map/components/map.component.scss
@@ -1,8 +1,6 @@
@import 'color';
@import 'layout';
@import 'typography';
-@import 'shapes';
-@import 'buttons';
@import 'breakpoint';
@import 'z-index';
@@ -57,7 +55,7 @@
fill: $gold;
}
&.france-service {
- fill: $primary-color;
+ fill: $red;
}
}
}
@@ -74,9 +72,16 @@
}
button {
- @include btn-search-filter;
- @include font-bold-14;
- font-size: 16px;
+ @include font-regular-16;
+ background: $red;
+ height: 36px;
+ color: $white;
+ padding: 4px 37px;
+ border-radius: 4px;
+ outline: none;
+ border: 1px solid transparent;
+ cursor: pointer;
+ line-break: 18px;
}
span {
diff --git a/src/app/post/components/post-details/post-details.component.scss b/src/app/post/components/post-details/post-details.component.scss
index 3a25d27d420438cbc42eba1502135d2b51d28fa9..7a666d85c2ef16d29593df06e9ae3aa3f458108a 100644
--- a/src/app/post/components/post-details/post-details.component.scss
+++ b/src/app/post/components/post-details/post-details.component.scss
@@ -2,7 +2,6 @@
@import 'typography';
@import 'layout';
@import 'breakpoint';
-@import 'hyperlink';
@import 'ghost';
h1 {
diff --git a/src/app/post/components/post-header/post-header.component.scss b/src/app/post/components/post-header/post-header.component.scss
index 74e3b8ada5a24f55d9ddca0a2154ec422cb5baf0..486ea9c16fc75205f9fe29fd0972b441c0d6646a 100644
--- a/src/app/post/components/post-header/post-header.component.scss
+++ b/src/app/post/components/post-header/post-header.component.scss
@@ -1,5 +1,4 @@
@import 'color';
-@import 'buttons';
@import 'typography';
@import 'breakpoint';
@import 'layout';
@@ -45,7 +44,7 @@ header {
border-color: $grey-4;
}
&:focus {
- outline-color: $primary-color;
+ outline-color: $red;
}
}
}
diff --git a/src/app/post/components/post-list/post-list.component.scss b/src/app/post/components/post-list/post-list.component.scss
index 662ea257fe487ea79d24cbd307187ce8e201006d..b39ed183cff29d81281e136f951a7483544d3dd5 100644
--- a/src/app/post/components/post-list/post-list.component.scss
+++ b/src/app/post/components/post-list/post-list.component.scss
@@ -1,6 +1,5 @@
@import 'color';
@import 'typography';
-@import 'shapes';
@import 'breakpoint';
.news {
diff --git a/src/app/profile/edit/edit.component.scss b/src/app/profile/edit/edit.component.scss
index 0010fe1fa5a272d0ea3419559cbfe9b5f1fe42fe..ef12dc1a71d6dc6c8fab6d2bead1db205969b95c 100644
--- a/src/app/profile/edit/edit.component.scss
+++ b/src/app/profile/edit/edit.component.scss
@@ -1,7 +1,5 @@
@import 'color';
@import 'typography';
-@import 'hyperlink';
-@import 'shapes';
@import 'breakpoint';
.content-container {
diff --git a/src/app/profile/personal-offer-edition/personal-offer-edition.component.scss b/src/app/profile/personal-offer-edition/personal-offer-edition.component.scss
index 55d69e9955ffeb14685a32d6e5683a6d12cad130..581ea7142e803d9d5e9e2abe620e48bc0a5f6a4f 100644
--- a/src/app/profile/personal-offer-edition/personal-offer-edition.component.scss
+++ b/src/app/profile/personal-offer-edition/personal-offer-edition.component.scss
@@ -1,7 +1,5 @@
@import 'color';
@import 'typography';
-@import 'hyperlink';
-@import 'shapes';
@import 'breakpoint';
.content-container {
diff --git a/src/app/profile/profile-structure/profile-structure.component.scss b/src/app/profile/profile-structure/profile-structure.component.scss
index 84b6d4d256688eeb6bcec30679bb31c3161eae42..fddf6a306e4d20b0286127a683687679a185e55e 100644
--- a/src/app/profile/profile-structure/profile-structure.component.scss
+++ b/src/app/profile/profile-structure/profile-structure.component.scss
@@ -1,7 +1,6 @@
@import 'color';
@import 'typography';
@import 'breakpoint';
-@import 'shapes';
.collapseHeader {
width: 100%;
diff --git a/src/app/profile/profile.component.scss b/src/app/profile/profile.component.scss
index 98c22cfa6eb1684017b8f98cf9d88dde62e97a08..953f8df51b7891d1dca41df6198884a021610cdc 100644
--- a/src/app/profile/profile.component.scss
+++ b/src/app/profile/profile.component.scss
@@ -1,7 +1,5 @@
@import 'color';
@import 'typography';
-@import 'hyperlink';
-@import 'shapes';
@import 'breakpoint';
@import 'layout';
diff --git a/src/app/shared/components/accompaniment-picker/accompaniment-picker.component.scss b/src/app/shared/components/accompaniment-picker/accompaniment-picker.component.scss
deleted file mode 100644
index 46e81fc093176def48681a01e61f2bd8cd3435b4..0000000000000000000000000000000000000000
--- a/src/app/shared/components/accompaniment-picker/accompaniment-picker.component.scss
+++ /dev/null
@@ -1 +0,0 @@
-@import 'buttons';
diff --git a/src/app/shared/components/accompaniment-picker/accompaniment-picker.component.ts b/src/app/shared/components/accompaniment-picker/accompaniment-picker.component.ts
index 955eaca86596e4953c23975e5580dff72247b83e..44a36ffbea88416c23c46c0ff3c84f04c8632b3f 100644
--- a/src/app/shared/components/accompaniment-picker/accompaniment-picker.component.ts
+++ b/src/app/shared/components/accompaniment-picker/accompaniment-picker.component.ts
@@ -6,7 +6,6 @@ import { Module } from '../../../structure-list/models/module.model';
@Component({
selector: 'app-accompaniment-picker',
templateUrl: './accompaniment-picker.component.html',
- styleUrls: ['./accompaniment-picker.component.scss'],
})
export class AccompanimentPickerComponent implements OnInit, OnChanges {
@Input() personalOfferForm: UntypedFormGroup;
diff --git a/src/app/shared/components/button/button.component.scss b/src/app/shared/components/button/button.component.scss
index df26c7b95bddaa53aafc762559de5858e5cf7b49..9d640518b8dfd82eaeb7f752ca9730d31e97bdc9 100644
--- a/src/app/shared/components/button/button.component.scss
+++ b/src/app/shared/components/button/button.component.scss
@@ -60,7 +60,7 @@ button {
color: $grey-3;
}
&:active {
- background-color: $red-pressed;
+ background-color: $red-light;
}
}
@@ -114,15 +114,15 @@ button {
color: $grey-1;
border-color: $grey-1;
&:hover {
- background-color: $grey-3;
+ background-color: $grey-7;
}
&:disabled {
background-color: $white;
- color: $grey-5;
- border-color: $grey-5;
+ color: $grey-4;
+ border-color: $grey-4;
}
&:active {
- background-color: $grey-3;
+ background-color: $grey-8;
}
}
@@ -174,7 +174,7 @@ button {
color: $grey-3;
}
&:active {
- background-color: $grey-9;
+ background-color: $grey-8;
}
}
}
diff --git a/src/app/shared/components/data-share-consent/data-share-consent.component.scss b/src/app/shared/components/data-share-consent/data-share-consent.component.scss
index f432f0f49c6b9ef4b71aad25dacc8ca4fa2f58bc..04a14f9bcad1ee0335768242d15d9da74ccf3b87 100644
--- a/src/app/shared/components/data-share-consent/data-share-consent.component.scss
+++ b/src/app/shared/components/data-share-consent/data-share-consent.component.scss
@@ -1,9 +1,7 @@
@import 'typography';
@import 'breakpoint';
@import 'color';
-@import 'buttons';
@import 'z-index';
-@import 'hyperlink';
h1 {
@include font-bold-26;
diff --git a/src/app/shared/components/member-card/member-card.component.scss b/src/app/shared/components/member-card/member-card.component.scss
index ced5eb9a9a0282b7307a7a786ab2b47e30c7e696..66a270be69038af1a7ef872a5df7c180bb340393 100644
--- a/src/app/shared/components/member-card/member-card.component.scss
+++ b/src/app/shared/components/member-card/member-card.component.scss
@@ -1,7 +1,6 @@
@import 'color';
@import 'typography';
@import 'breakpoint';
-@import 'shapes';
.structureMember {
@include font-regular-14;
diff --git a/src/app/shared/components/structure-detail-print/structure-detail-print.component.scss b/src/app/shared/components/structure-detail-print/structure-detail-print.component.scss
index 47e930605d21073c113eed4e898c94c0cdcad1a0..19e1cde56e9355ab37c805702b9bae1ff6ae2b18 100644
--- a/src/app/shared/components/structure-detail-print/structure-detail-print.component.scss
+++ b/src/app/shared/components/structure-detail-print/structure-detail-print.component.scss
@@ -3,7 +3,6 @@
@import 'z-index';
@import 'layout';
@import 'breakpoint';
-@import 'buttons';
h2 {
margin-top: 0;
@@ -88,7 +87,7 @@ a {
}
.info {
- color: $primary-color;
+ color: $red;
}
.wrapper {
diff --git a/src/app/shared/components/tag-item/tag-item.component.scss b/src/app/shared/components/tag-item/tag-item.component.scss
index 33c628b5c344aa3d30d5288a2a938ce74d15a4ea..374d6bda881197ee035c9fc2926f8e5669eeee07 100644
--- a/src/app/shared/components/tag-item/tag-item.component.scss
+++ b/src/app/shared/components/tag-item/tag-item.component.scss
@@ -70,8 +70,8 @@ button {
}
&.red {
- color: $red-darker;
- background-color: $red-light;
+ color: $red-dark;
+ background-color: $red-lighter;
}
&.black {
diff --git a/src/app/shared/components/training-type-picker/training-type-picker.component.scss b/src/app/shared/components/training-type-picker/training-type-picker.component.scss
index 0f0a584cdcdbb6397aab225c2aa6489dbc3c97aa..3427d224600b703128dc0d49adb37e6b875273fb 100644
--- a/src/app/shared/components/training-type-picker/training-type-picker.component.scss
+++ b/src/app/shared/components/training-type-picker/training-type-picker.component.scss
@@ -1,8 +1,6 @@
@import 'typography';
-@import 'shapes';
@import 'color';
@import 'breakpoint';
-@import 'buttons';
.trainingContainer {
display: flex;
@@ -15,10 +13,6 @@
padding: 8px 12px;
gap: 1.5rem;
- .checkbox {
- width: 2.25rem;
- margin-top: 0.2rem;
- }
.titleCollapse {
@include font-bold-16;
color: $grey-1;
diff --git a/src/app/structure-list/components/card/card.component.scss b/src/app/structure-list/components/card/card.component.scss
index a984c434a6ec752e330432019600a14746f9e323..c6b7971b7f91056193b35b5f007711eeb97009b8 100644
--- a/src/app/structure-list/components/card/card.component.scss
+++ b/src/app/structure-list/components/card/card.component.scss
@@ -51,7 +51,7 @@
.structureName {
@include font-bold-18;
&.notClaimed {
- color: $primary-color;
+ color: $red;
}
}
.inline {
diff --git a/src/app/structure-list/components/structure-details/structure-details.component.scss b/src/app/structure-list/components/structure-details/structure-details.component.scss
index 919fd701d520f711df20a3e076378219490a66aa..b596c385664cbacef3fd36b23101c93280afb106 100644
--- a/src/app/structure-list/components/structure-details/structure-details.component.scss
+++ b/src/app/structure-list/components/structure-details/structure-details.component.scss
@@ -117,7 +117,7 @@ section.informations {
section.description {
.info {
@include font-bold-16;
- color: $red-1;
+ color: $red;
}
}
diff --git a/src/app/structure-list/structure-list.component.scss b/src/app/structure-list/structure-list.component.scss
index 977c32f2742427c19d3ee7e549a1556f01271b8d..20aeea09a408a02f6f281c6e4e5f3e6cfb55750f 100644
--- a/src/app/structure-list/structure-list.component.scss
+++ b/src/app/structure-list/structure-list.component.scss
@@ -1,6 +1,5 @@
@import 'color';
@import 'typography';
-@import 'buttons';
.structureList-container {
overflow-y: auto;
diff --git a/src/assets/scss/_buttons.scss b/src/assets/scss/_buttons.scss
deleted file mode 100644
index f0854251863b80121f0ae1b72ce2f3ef6c0cf1b0..0000000000000000000000000000000000000000
--- a/src/assets/scss/_buttons.scss
+++ /dev/null
@@ -1,105 +0,0 @@
-@import './color';
-@import './shapes';
-@import './typography';
-
-@mixin btn-filter {
- background: $white;
- height: 40px;
- width: 190px;
- border: 1px solid $grey-5;
- padding: 3px 8px 3px 16px;
- outline: none;
- border-radius: 4px;
- cursor: pointer;
- @include btn-normal;
- @include font-regular-13;
- transition: all 300ms ease;
- & > * {
- transition: all 300ms ease;
- }
-}
-
-@mixin btn-search-filter {
- background: $primary-color;
- height: 36px;
- color: $white;
- padding: 4px 37px;
- border-radius: 4px;
- outline: none;
- border: 1px solid transparent;
- cursor: pointer;
- @include font-regular-13;
- line-break: 18px;
-}
-
-@mixin btn-grey {
- box-sizing: border-box;
- border-radius: 6px;
- background: $white;
- color: $grey-1;
- border: 1px solid $grey-1;
- cursor: pointer;
- @include font-regular-12;
- line-height: 18px;
- padding: 8px 15px;
-}
-@mixin btn-red {
- border-radius: 6px;
- background: $red;
- color: $white;
- cursor: pointer;
- @include font-regular-12;
- line-height: 18px;
- padding: 8px 15px;
-}
-
-button {
- transition: all 0.1s;
-}
-
-.btn-primary {
- background: $primary-color;
- border-radius: 4px;
- outline: none;
- cursor: pointer;
- color: $white;
- height: 40px;
- width: 192px;
- @include btn-bold;
- stroke: $white;
- border: 1px solid $grey-1;
- &.small {
- width: 149px;
- }
- &.invalid {
- opacity: 0.4;
- }
- &:focus {
- background: $white;
- color: $primary-color;
- border: 1px solid $primary-color;
- stroke: $primary-color;
- }
-}
-
-.tagList {
- display: inline-flex;
- flex-wrap: wrap;
- gap: 12px 8px;
-}
-
-.tags-cloud {
- font-style: normal;
- justify-content: center;
- align-items: center;
- height: 28px;
- border-radius: 20px;
- padding: 5px 15px;
- color: $white;
- border-style: none;
- margin-top: 5px;
- background: $grey-1;
- &.unchecked {
- background: $grey-5;
- }
-}
diff --git a/src/assets/scss/_color.scss b/src/assets/scss/_color.scss
index b5d8d2f59359abce743eaea747ade3e25ffc3bd6..2f6a9185b86e0ee7bd48d0d8b8dddb1e33af6f41 100644
--- a/src/assets/scss/_color.scss
+++ b/src/assets/scss/_color.scss
@@ -1,8 +1,7 @@
$black: #000000;
$white: #ffffff;
-/* GREYS */
+/* GREYS */
$grey-0: $black;
-$grey: #b4bbbf;
$grey-1: #333333;
$grey-2: #4c4d53;
$grey-3: #696969;
@@ -13,15 +12,20 @@ $grey-7: #e9e9e9;
$grey-8: #f4f4f4;
$grey-9: #f8f8f8;
$grey-10: $white;
-/* GREY Accessibility Ratio 4,5:1 */
+/* GREY Accessibility Ratio 4,5:1 */
$grey-4-5-1: #767676;
/* REDS */
$red-darker: #a50f0e;
-$red-dark: #ba1615;
+$red-dark: #cd2524;
$red: #da3635;
-$red-light: #ffe5e4;
-$red-pressed: #ff4544;
+$red-20: #da363533; // main red with 20% opacity
+$red-light: #ff5d5c;
+$red-lighter: #ffe5e4;
+
+/* Element state colors */
+$blue-focus: #0078f3;
+$red-hover: #c02423;
/* Border color for hours */
$border-hours: #ff6e6e;
@@ -31,8 +35,6 @@ $info-success: #1d8844;
$info-warning: #cf4b00;
$info-blue: #0073e9;
$info-error: #da3635;
-/* BLUE */
-$blue-focus: #0078f3; // not referenced in figma doc, keep it ?
// Additional colors for button effects
$warning-hover: #b24000;
@@ -40,11 +42,6 @@ $warning-pressed: #f1742e;
$success-hover: #066629;
$success-pressed: #46c374;
-$red-20: #da363533; // main red with 20% opacity
-$red-hover: #c02423;
-$red-1: #f35453;
-$red-error: #ff0000;
-
/* GOLD */
$gold: #bd9e6a;
/* form colors */
@@ -59,16 +56,6 @@ $red-error: #e1000f;
$blue: #348899;
$blue-light: #c9ecf3;
/* APP COLORS */
-$primary-color: $red;
-$primary-color-dark: $red-dark;
-$primary-color-light: #fef0f0;
-$default-link-color: $grey-2;
-$button-secondary: $red-dark;
-$app-background: $grey-9;
$modal-background-transparent: rgba($grey-1, 0);
$modal-background: rgba($grey-1, 0.25);
-$app-background: $grey-9;
-$scrollbar-track: rgba($grey-9, 0.65);
-$scrollbar-thumb: $grey-1;
-$focus-color: $grey-1;
$box-shadow: 0px 12px 24px 0px rgba(0, 0, 0, 0.1);
diff --git a/src/assets/scss/_ghost.scss b/src/assets/scss/_ghost.scss
index b6f27098d64bf1eac6ec249ee124ca8a6ffafa38..32a51bbb8aa63e99a7346e4ff9bb2bf363f0a020 100644
--- a/src/assets/scss/_ghost.scss
+++ b/src/assets/scss/_ghost.scss
@@ -1,12 +1,11 @@
@import 'color';
@import 'layout';
@import 'breakpoint';
-@import 'hyperlink';
$margin-post: 20px;
:root {
- --ghost-accent-color: #{$primary-color};
+ --ghost-accent-color: #{$red};
}
.postContainer {
diff --git a/src/assets/scss/_hyperlink.scss b/src/assets/scss/_hyperlink.scss
deleted file mode 100644
index 92d4bbb241e95f5a5d4e2748c3c78c1f30cb5a58..0000000000000000000000000000000000000000
--- a/src/assets/scss/_hyperlink.scss
+++ /dev/null
@@ -1,20 +0,0 @@
-@import './typography.scss';
-@mixin hyperlink {
- border: 1px solid transparent;
- padding: 8px 8px 6px 8px;
- color: $primary-color;
- outline: none;
- @include btn-bold-underline;
- &:hover {
- color: $primary-color-dark;
- }
- &:focus {
- color: $primary-color;
- border-color: $primary-color;
- border-radius: 4px;
- }
- &:active {
- border: none;
- color: $blue-light;
- }
-}
diff --git a/src/assets/scss/_inputs.scss b/src/assets/scss/_inputs.scss
index 43c5c9296a3c31fd58c9df9c5bf218e87aaf3e50..aae8122f6e42507e3346e408e5b0871e599cb233 100644
--- a/src/assets/scss/_inputs.scss
+++ b/src/assets/scss/_inputs.scss
@@ -1,23 +1,13 @@
@import './color';
-@import './shapes';
@import './typography';
-@mixin input-search {
- width: 100%;
- border: none;
- text-overflow: ellipsis;
- background-color: $grey-9;
- color: $grey-3;
- outline: none;
- font-style: italic;
-}
-
+// V3REMOVE
.form-input {
width: 296px;
background: $grey-9;
border: 1px solid $grey-5;
box-sizing: border-box;
- border-radius: $input-radius;
+ border-radius: 4px;
height: 36px;
padding: 8px;
@include font-regular-14;
diff --git a/src/assets/scss/_shapes.scss b/src/assets/scss/_shapes.scss
deleted file mode 100644
index 7c4bd789cf3ba4968bbbf2cb1f0893723942225a..0000000000000000000000000000000000000000
--- a/src/assets/scss/_shapes.scss
+++ /dev/null
@@ -1,20 +0,0 @@
-@import './color';
-
-$card-radius: 0.625em;
-$bouton-radius: 0.625em;
-$input-radius: 4px;
-$bouton-width: 12.25em;
-$round-bouton-radius: 1.25em;
-$round-radius: 50%;
-$round-button: 40px;
-$simple-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25);
-$menu-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25);
-$mat-tab-shadow: 0px 2px 7px rgba(0, 0, 0, 0.25);
-
-@mixin background-hash($color) {
- background: $color !important;
- padding: 0 0 1px 1px;
- .body-wrap {
- background-color: $white;
- }
-}
diff --git a/src/styles.scss b/src/styles.scss
index 87d49d5e9e02f18bd1367eca2733dca6cb7e684b..7f05c22dae26a24919450433b5fb111e7de752bb 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -5,9 +5,7 @@
@import 'color';
@import 'breakpoint';
@import 'inputs';
-@import 'hyperlink';
@import 'layout';
-@import 'buttons';
@import '../node_modules/leaflet.locatecontrol/dist/L.Control.Locate.css';
@import '../node_modules/leaflet/dist/leaflet.css';
@import '../node_modules/ngx-toastr/toastr';
@@ -54,23 +52,7 @@ body {
a {
color: $grey-1;
- background-color: transparent;
cursor: pointer;
- &:focus {
- text-decoration: none;
- outline-color: $primary-color;
- }
- &:hover {
- text-decoration: underline;
- outline-color: $primary-color;
- }
- &.primary {
- @include hyperlink;
- width: 100%;
- }
- &.right {
- text-align: right;
- }
}
.clickable {
@@ -182,9 +164,6 @@ form p.notRequired {
}
/** Inputs **/
-.form-group .addressRow {
- padding-bottom: 1.5rem;
-}
.formView {
form {
padding-bottom: 1rem;
@@ -195,11 +174,12 @@ form p.notRequired {
}
/** Textarea **/
+// V3REMOVE
textarea {
padding: 13px 8px;
background: $grey-9;
border: 1px solid $grey-5;
- border-radius: $input-radius;
+ border-radius: 4px;
resize: none;
outline: none;
@include font-regular-16;
@@ -209,92 +189,11 @@ textarea {
}
/** Buttons **/
+// V3REMOVE
button {
&:focus,
&:focus-within {
- outline-color: $primary-color;
- }
-}
-
-/** Checkboxes **/
-.checkbox {
- list-style-type: none;
- width: 100%;
- input {
- opacity: 0;
- display: none;
- &:checked ~ .customCheck {
- background-color: $grey-3;
- border-color: transparent;
- }
- &:checked ~ .customCheckPrimary {
- background-color: $grey-1;
- border-color: transparent;
- }
- &:checked ~ .customCheck:after {
- display: block;
- }
- }
- label {
- grid-template-columns: min-content auto;
- display: inline-grid;
- cursor: pointer;
- }
- .label {
- padding-left: 8px;
- padding-right: 10px;
- @include btn-pass;
- &.pass {
- @include font-regular-16;
- }
- }
- .customCheck {
- display: inline-grid;
- width: 18px;
- height: 18px;
- min-width: 18px;
- min-height: 18px;
- background-color: $white;
- border: 1px solid $grey-3;
- cursor: pointer;
- position: relative;
- border-radius: 4px;
- top: 0;
- left: 0;
- &:hover {
- background-color: $grey-9;
- }
- &:after {
- content: '';
- position: absolute;
- display: none;
- left: 7px;
- top: 3px;
- width: 4px;
- height: 8px;
- border: solid $white;
- border-width: 0 2px 2px 0;
- transform: rotate(45deg);
- -webkit-transform: rotate(45deg);
- -ms-transform: rotate(45deg);
- }
- }
- &.no-width {
- width: unset;
- }
-}
-.halfCheck {
- position: relative;
- &:before {
- content: '';
- position: absolute;
- display: block;
- width: 10px;
- left: 4px;
- top: 8px;
- transform: rotate(0deg);
- border-bottom: solid 2px $grey-2;
- border-radius: 0;
+ outline-color: $red;
}
}
@@ -324,7 +223,6 @@ button {
}
// PRINT
-
@media print {
body,
html,
@@ -350,26 +248,6 @@ button {
margin: 0 !important;
}
-.userList {
- max-width: 50%;
-}
-
-.userBlock {
- max-width: 50%;
- margin: 0 auto;
-}
-
-.tooltip {
- position: absolute;
- bottom: 100%;
- white-space: nowrap;
- left: 0;
- padding: 10px;
- background: $grey;
- color: $white;
- box-shadow: 0 2px 1px rgba(0, 0, 0, 0.6);
-}
-
.hide-on-desktop {
display: none;
@media #{$tablet} {
@@ -383,7 +261,6 @@ button {
}
// AUTOCOMPLETE
-
.autocomplete-items {
width: 100%;
padding-right: 16px;
@@ -470,9 +347,16 @@ sup {
max-width: 600px;
}
+/* CONTAINERS */
div.inline {
display: flex;
flex-direction: row;
align-items: center;
gap: 8px;
}
+
+.tagList {
+ display: inline-flex;
+ flex-wrap: wrap;
+ gap: 12px 8px;
+}