From 7a7071e4d000d16b029811f3e2501bc36d783645 Mon Sep 17 00:00:00 2001
From: Bastien DUMONT <bdumont@grandlyon.com>
Date: Tue, 20 Feb 2024 16:03:15 +0000
Subject: [PATCH] chore: remove unused styles
---
.../result-list/result-list.component.scss | 52 -------
src/app/contact/contact.component.scss | 1 -
...ersonal-offer-accompaniment.component.scss | 1 -
.../personal-offer-accompaniment.component.ts | 1 -
.../structure-name-and-address.component.html | 15 +-
...ientation-structure-address.component.html | 18 +--
src/app/header/header.component.scss | 18 ---
src/app/map/components/map.component.scss | 17 ++-
.../post-details/post-details.component.scss | 1 -
.../post-header/post-header.component.scss | 3 +-
.../post-list/post-list.component.scss | 1 -
src/app/profile/edit/edit.component.scss | 2 -
.../personal-offer-edition.component.scss | 2 -
.../profile-structure.component.scss | 1 -
src/app/profile/profile.component.scss | 2 -
.../accompaniment-picker.component.scss | 1 -
.../accompaniment-picker.component.ts | 1 -
.../components/button/button.component.scss | 12 +-
.../data-share-consent.component.scss | 2 -
.../member-card/member-card.component.scss | 1 -
.../structure-detail-print.component.scss | 3 +-
.../tag-item/tag-item.component.scss | 4 +-
.../training-type-picker.component.scss | 6 -
.../components/card/card.component.scss | 2 +-
.../structure-details.component.scss | 2 +-
.../structure-list.component.scss | 1 -
src/assets/scss/_buttons.scss | 105 -------------
src/assets/scss/_color.scss | 33 ++---
src/assets/scss/_ghost.scss | 3 +-
src/assets/scss/_hyperlink.scss | 20 ---
src/assets/scss/_inputs.scss | 14 +-
src/assets/scss/_shapes.scss | 20 ---
src/styles.scss | 138 ++----------------
33 files changed, 62 insertions(+), 441 deletions(-)
delete mode 100644 src/app/form/form-view/personal-offer-form/personal-offer-accompaniment/personal-offer-accompaniment.component.scss
delete mode 100644 src/app/shared/components/accompaniment-picker/accompaniment-picker.component.scss
delete mode 100644 src/assets/scss/_buttons.scss
delete mode 100644 src/assets/scss/_hyperlink.scss
delete mode 100644 src/assets/scss/_shapes.scss
diff --git a/src/app/annuaire/result-list/result-list.component.scss b/src/app/annuaire/result-list/result-list.component.scss
index 565fd658b..79527a574 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 7799d1448..ebd60c113 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 46e81fc09..000000000
--- 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 9ee5fc01e..d9d4b1361 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 44602a6f5..b54bc80a5 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 15d778e82..a77c62534 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 de68e365d..79cd170eb 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 e26bad08b..9f1584742 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 3a25d27d4..7a666d85c 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 74e3b8ada..486ea9c16 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 662ea257f..b39ed183c 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 0010fe1fa..ef12dc1a7 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 55d69e995..581ea7142 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 84b6d4d25..fddf6a306 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 98c22cfa6..953f8df51 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 46e81fc09..000000000
--- 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 955eaca86..44a36ffbe 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 df26c7b95..9d640518b 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 f432f0f49..04a14f9bc 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 ced5eb9a9..66a270be6 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 47e930605..19e1cde56 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 33c628b5c..374d6bda8 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 0f0a584cd..3427d2246 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 a984c434a..c6b7971b7 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 919fd701d..b596c3856 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 977c32f27..20aeea09a 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 f08542518..000000000
--- 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 b5d8d2f59..2f6a9185b 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 b6f27098d..32a51bbb8 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 92d4bbb24..000000000
--- 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 43c5c9296..aae8122f6 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 7c4bd789c..000000000
--- 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 87d49d5e9..7f05c22da 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;
+}
--
GitLab