diff --git a/src/app/app.component.html b/src/app/app.component.html index 5f46244f..7e33e182 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,25 +1,27 @@
- -

- Frama - date -

+
+

+ Frama + date +

-
-
-
- - -
-

{{"Title"|translate}}

-
- {{"Intro"|translate:user}} -
-
+ +
+ location icon + menu icon +
+ + +
+

{{"Title"|translate}}

+
+ {{"Intro"|translate:user}} +
+
- +
diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 66f42676..d448b962 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -1,5 +1,5 @@ import {BrowserModule} from '@angular/platform-browser'; -import {LOCALE_ID, NgModule} from '@angular/core'; +import {NgModule} from '@angular/core'; import {AppRoutingModule} from './app-routing.module'; import {AppComponent} from './app.component'; @@ -19,7 +19,6 @@ import {PicturesComponent} from './pages/pictures/pictures.component'; import {AnswersComponent} from './pages/answers/answers.component'; import {EndConfirmationComponent} from './pages/end-confirmation/end-confirmation.component'; import {CreateOrRetrieveComponent} from './pages/create-or-retrieve/create-or-retrieve.component'; -import {CalendarComponent} from './calendar/calendar.component'; import localeFr from '@angular/common/locales/fr'; import localeEn from '@angular/common/locales/en'; import {VotingSummaryComponent} from './pages/voting-summary/voting-summary.component'; @@ -29,7 +28,7 @@ import {PasswordComponent} from './pages/password/password.component'; import {HomeComponent} from './pages/home/home.component'; import {VoteChoiceComponent} from './vote-choice/vote-choice.component'; import {HttpClient, HttpClientModule} from '@angular/common/http'; -import { MarkdownModule } from 'ngx-markdown'; +import {MarkdownModule} from 'ngx-markdown'; import { MissingTranslationHandler, MissingTranslationHandlerParams, @@ -38,9 +37,10 @@ import { TranslateService } from '@ngx-translate/core'; import {TranslateHttpLoader} from '@ngx-translate/http-loader'; -import { PollGraphicComponent } from './poll-graphic/poll-graphic.component'; +import {PollGraphicComponent} from './poll-graphic/poll-graphic.component'; -import { AdminComponent } from './pages/admin/admin.component'; +import {AdminComponent} from './pages/admin/admin.component'; +import {SelectorComponent} from './ui/selector/selector.component'; export class MyMissingTranslationHandler implements MissingTranslationHandler { handle(params: MissingTranslationHandlerParams) { @@ -70,7 +70,6 @@ export function HttpLoaderFactory(http: HttpClient) { AnswersComponent, EndConfirmationComponent, CreateOrRetrieveComponent, - CalendarComponent, VotingSummaryComponent, VotingGraphComponent, VotingChoiceComponent, @@ -79,6 +78,7 @@ export function HttpLoaderFactory(http: HttpClient) { PollGraphicComponent, VoteChoiceComponent, AdminComponent, + SelectorComponent, ], imports: [ diff --git a/src/app/calendar/calendar.component.html b/src/app/calendar/calendar.component.html deleted file mode 100644 index 6d8082c2..00000000 --- a/src/app/calendar/calendar.component.html +++ /dev/null @@ -1 +0,0 @@ -

calendar works!

diff --git a/src/app/calendar/calendar.component.html.save b/src/app/calendar/calendar.component.html.save deleted file mode 100644 index 8b137891..00000000 --- a/src/app/calendar/calendar.component.html.save +++ /dev/null @@ -1 +0,0 @@ - diff --git a/src/app/calendar/calendar.component.ts b/src/app/calendar/calendar.component.ts deleted file mode 100644 index a16dd09f..00000000 --- a/src/app/calendar/calendar.component.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { Component, OnInit } from '@angular/core'; - -@Component({ - selector: 'framadate-calendar', - templateUrl: './calendar.component.html', - styleUrls: ['./calendar.component.scss'] -}) -export class CalendarComponent implements OnInit { - - constructor() { } - - ngOnInit() { - } - -} diff --git a/src/app/config/PollConfig.ts b/src/app/config/PollConfig.ts index 722298c6..c34bb98a 100644 --- a/src/app/config/PollConfig.ts +++ b/src/app/config/PollConfig.ts @@ -27,39 +27,47 @@ export const defaultDates = [ timeList: [{literal: 'matin'}, {literal: 'midi'}, {literal: 'soir'}] } ]; +export const defaultAnswers = [{ + id: 0, + text: 'réponse de démo 1' +}, + { + id: 1, + text: 'réponse 2' + }, + { + id: 2, + text: 'la réponse D' + }]; /** * configuration of the poll, add new fields at will */ export class PollConfig { + expiracyDateDefaultInDays = 60; step = 0; stepMax = 3; - pollType = 'classic'; - title = ''; - description = ''; - myName = ''; + pollType = 'classic';// classic or date + title = 'titre'; + description = 'ma description'; + myName = 'mon pseudo'; - // date specific poll + // date specific poll, we have the choice to setup different hours (timeList) for all possible dates (dateList), or use the same hours for all dates allowSeveralHours = 'false'; // access visibility = 'link_only'; // visible to anyone with the link: + voteChoices = 'only_yes'; // possible answers to a vote choice: only "yes", "yes, maybe, no" + expirationDate = ''; // expiracy date + passwordAccess = 0; password = ''; + customUrl = ''; + canModifyAnswers = 1;// everybody, self, nobody (= just admin) + whoModifiesAnswers = "self";// everybody, self, nobody (= just admin) whoCanChangeAnswers = 'everybody';// everybody, self, nobody (= just admin) dateList: DateOption[] = defaultDates; // sets of days as strings, config to set identical time for days in a special days poll timeList: DateOption[] = timeOfDay; // ranges of time expressed as strings - answers: any = [{ - id: 0, - text: 'réponse de démo 1' - }, - { - id: 1, - text: 'réponse 2' - }, - { - id: 2, - text: 'la réponse D' - }]; + answers: any = defaultAnswers; } diff --git a/src/app/pages/admin/admin.component.html b/src/app/pages/admin/admin.component.html index f2ce8400..db4f9c73 100644 --- a/src/app/pages/admin/admin.component.html +++ b/src/app/pages/admin/admin.component.html @@ -1,75 +1,100 @@
-

Nom du sondage

- -

Informations du sondage

- - - - - - - -

Paramètres

-

Visibilité des réponses

-
- - - -
-

Votes

-
- - -
-
- - - - -
+

Nom du sondage

+ +

Informations du sondage

+ + + + + + + +

Paramètres

+

Visibilité des réponses

+
+ + + +
+

Votes

+
+ + +
+
+ + + + +
+ + + +

Commentaires

+ + +

Archivage

+
+ + +
+

Accés au sondage

+
+ + + +
+

Tout supprimer

+ + +

Liens d'accès au sondage

+

Coté administrateur·ice

+ + + +

Côté sondé·es

+ + + +

Recevoir les liens par mail

+ + + + +
+ {{"admin.deletion"|translate}} + {{"admin.deletion_desc"|translate}} + {{"admin.deletion_btn"|translate}} + +
+ - - -

Commentaires

- - -

Archivage

-
- - -
-

Accés au sondage

-
- - - -
-

Tout supprimer

- - -

Liens d'accès au sondage

-

Coté administrateur·ice

- - - -

Côté sondé·es

- - - -

Recevoir les liens par mail

- - -
diff --git a/src/app/pages/answers/answers.component.html b/src/app/pages/answers/answers.component.html index 9ea5719a..fa2027fa 100644 --- a/src/app/pages/answers/answers.component.html +++ b/src/app/pages/answers/answers.component.html @@ -1,7 +1,7 @@
-

- Choisir les propositions -

+

+ Choisir les propositions +

Vous pouvez utiliser la syntaxe markdown @@ -14,9 +14,11 @@ type="text" class="answer" [(ngModel)]="answer.text" + (keyup.enter)="addAnswer()" + (keyup)="navigateOrDelete($event,i)" placeholder="réponse" > - + diff --git a/src/app/pages/answers/answers.component.ts b/src/app/pages/answers/answers.component.ts index 48116555..cf8b169a 100644 --- a/src/app/pages/answers/answers.component.ts +++ b/src/app/pages/answers/answers.component.ts @@ -1,4 +1,4 @@ -import {ChangeDetectorRef, Component, Inject, OnInit} from '@angular/core'; +import {AfterViewInit, ChangeDetectorRef, Component, Inject, OnInit} from '@angular/core'; import {BaseComponent} from '../base-page/base.component'; import {ConfigService} from '../../config.service'; @@ -9,7 +9,7 @@ import {DOCUMENT} from '@angular/common'; templateUrl: './answers.component.html', styleUrls: ['./answers.component.scss'] }) -export class AnswersComponent extends BaseComponent implements OnInit { +export class AnswersComponent extends BaseComponent implements OnInit, AfterViewInit { private answerList = []; @@ -24,6 +24,10 @@ export class AnswersComponent extends BaseComponent implements OnInit { ngOnInit() { } + ngAfterViewInit() { + this.focusOnAnswer(0) + } + trackFunction(index: number, item: any): number { return item.id; } @@ -35,19 +39,30 @@ export class AnswersComponent extends BaseComponent implements OnInit { text: '' }); this.cd.detectChanges(); // to refresh the view before focusing on the new input + this.focusOnAnswer(this.config.answers.length - 1) + } + + focusOnAnswer(i) { const AnswersDomToFocus = this.document.querySelectorAll('.answers .answer'); - const dom = AnswersDomToFocus[AnswersDomToFocus.length - 1]; + const dom = AnswersDomToFocus[i]; if (dom.focus) { dom.focus(); } + if (dom.select) { + dom.select(); + } } - // add a new answer on the press of ENTER in an input - addWhenEnterKey(event) { + navigateOrDelete(event: KeyboardEvent, i) { console.log('event', event); - if (event.keyCode === 13) { - this.addAnswer(); + if (event.ctrlKey && event.key == "d") { + this.config.answers.splice(i, 1) + } + if (event.key == "ArrowUp" && i > 0) { + this.focusOnAnswer(i - 1); + } + if (event.key == "ArrowDown" && i < this.config.answers.length) { + this.focusOnAnswer(i + 1); } - return; } } diff --git a/src/app/pages/kind/kind.component.scss b/src/app/pages/kind/kind.component.scss index 76e12fed..2ac50a89 100644 --- a/src/app/pages/kind/kind.component.scss +++ b/src/app/pages/kind/kind.component.scss @@ -1,22 +1,23 @@ @charset "UTF-8"; section { - &:not(:last-of-type) { - border-bottom: 6px solid #000; - } + &:not(:last-of-type) { + border-bottom: 6px solid #000; + } + + + section { + margin: 0 !important; + } - & + & { - margin-top: 3rem; - } } article { - padding: 2rem 0; - border-top: 3px solid #ffb92c; + padding: 2rem 0; + border-top: 3px solid #ffb92c; - h3 { - &:not(:first-of-type) { - margin-top: 2rem; + h3 { + &:not(:first-of-type) { + margin-top: 2rem; + } } - } } diff --git a/src/app/pages/resume/resume.component.html b/src/app/pages/resume/resume.component.html index 70f6636d..9a812cf3 100644 --- a/src/app/pages/resume/resume.component.html +++ b/src/app/pages/resume/resume.component.html @@ -1,10 +1,31 @@ -

- Résumé avant validation +

+ Récapitulatif

+

+ {{config.title}} +

+
+ créé par + {{config.myName}} +
+
+

+ {{config.description}} +

+
-
- {{questions.id+1}}. {{questions.text}} -
- + +
+ +
+ + Retour + +
diff --git a/src/app/pages/visibility/visibility.component.html b/src/app/pages/visibility/visibility.component.html index b7c58321..8ad30767 100644 --- a/src/app/pages/visibility/visibility.component.html +++ b/src/app/pages/visibility/visibility.component.html @@ -1,14 +1,158 @@

- {{"visibility.title"|translate}} -

-

- {{"visibility.votes"|translate}} -

-

- {{"visibility.archiving"|translate}} + {{"visibility.top_txt"|translate}}

+
+

+ {{"visibility.title"|translate}} +

+ + {{"visibility.visibility_want"|translate}} + + + + {{"visibility.visibility_see"|translate}} + -

- {{"visibility.access"|translate}} -

-C'est parfait! +
+ +
+

+ {{"visibility.votes"|translate}} +

+ + +
+
+ + + +
+ + + + + + +
+ + +
+
+

+ {{"visibility.access"|translate}} +

+ +
+ + + + {{"visibility.access_instructions"|translate}} + +
+ + + + + +
+ + + + +
+
+ + + {{"visibility.validate_btn"|translate}} + +
+ + + Retour + +
diff --git a/src/app/pages/visibility/visibility.component.ts b/src/app/pages/visibility/visibility.component.ts index ab66c675..6dd86867 100644 --- a/src/app/pages/visibility/visibility.component.ts +++ b/src/app/pages/visibility/visibility.component.ts @@ -8,12 +8,36 @@ import {ConfigService} from '../../config.service'; styleUrls: ['./visibility.component.scss'] }) export class VisibilityComponent extends BaseComponent implements OnInit { + showCustomPassword = false; constructor(public config: ConfigService) { super(config); } ngOnInit() { + this.config.customUrl = this.makeUuid(); + this.config.expirationDate = (this.addDaysToDate(this.config.expiracyDateDefaultInDays, new Date())).toISOString().substring(0, 10); } + /** + * generate unique id to have a default url for future poll + */ + makeUuid() { + return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) { + var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8); + return v.toString(16); + }); + } + + /** + * add some days to a date, to compute intervals + * @param days + * @param date + */ + addDaysToDate(days: number, date: Date) { + date = new Date(date.valueOf()); + date.setDate(date.getDate() + days); + return date; + }; + } diff --git a/src/app/ui/navigation/navigation.component.html b/src/app/ui/navigation/navigation.component.html index fcce0856..5aa5ce1e 100644 --- a/src/app/ui/navigation/navigation.component.html +++ b/src/app/ui/navigation/navigation.component.html @@ -26,6 +26,9 @@ Graphique + + Administration + Accueil diff --git a/src/app/ui/selector/selector.component.html b/src/app/ui/selector/selector.component.html new file mode 100644 index 00000000..b75b2232 --- /dev/null +++ b/src/app/ui/selector/selector.component.html @@ -0,0 +1,9 @@ + diff --git a/src/app/calendar/calendar.component.scss b/src/app/ui/selector/selector.component.scss similarity index 100% rename from src/app/calendar/calendar.component.scss rename to src/app/ui/selector/selector.component.scss diff --git a/src/app/calendar/calendar.component.spec.ts b/src/app/ui/selector/selector.component.spec.ts similarity index 55% rename from src/app/calendar/calendar.component.spec.ts rename to src/app/ui/selector/selector.component.spec.ts index 205a029d..13b5c414 100644 --- a/src/app/calendar/calendar.component.spec.ts +++ b/src/app/ui/selector/selector.component.spec.ts @@ -1,20 +1,20 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing'; -import { CalendarComponent } from './calendar.component'; +import { SelectorComponent } from './selector.component'; -describe('CalendarComponent', () => { - let component: CalendarComponent; - let fixture: ComponentFixture; +describe('SelectorComponent', () => { + let component: SelectorComponent; + let fixture: ComponentFixture; beforeEach(async(() => { TestBed.configureTestingModule({ - declarations: [ CalendarComponent ] + declarations: [ SelectorComponent ] }) .compileComponents(); })); beforeEach(() => { - fixture = TestBed.createComponent(CalendarComponent); + fixture = TestBed.createComponent(SelectorComponent); component = fixture.componentInstance; fixture.detectChanges(); }); diff --git a/src/app/ui/selector/selector.component.ts b/src/app/ui/selector/selector.component.ts new file mode 100644 index 00000000..1f4faf8a --- /dev/null +++ b/src/app/ui/selector/selector.component.ts @@ -0,0 +1,30 @@ +import {Component, Input, OnInit} from '@angular/core'; + +interface Item { + label: string, + value: string +} + +interface SelectorConfig { + label: string, + name: string, + id: string, + selectorNgModel: any, + listItems: Item[] +} + +@Component({ + selector: 'framadate-selector', + templateUrl: './selector.component.html', + styleUrls: ['./selector.component.scss'] +}) +export class SelectorComponent implements OnInit { + @Input() selectorConfig: SelectorConfig; + + constructor() { + } + + ngOnInit() { + } + +} diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json index 4bc4ecae..11f74685 100644 --- a/src/assets/i18n/en.json +++ b/src/assets/i18n/en.json @@ -63,14 +63,55 @@ "links_mail": "Receive links by email" }, "visibility": { + "top_txt": "A few settings...", "title": "Visibility of answers", + "visibility_want": "Je veux que", + "visibility_link": "Ceux avec le lien", + "visibility_nobody": "personne ne", + "visibility_see": "puisse voir les réponses au sondage.", "votes": "Votes", - "archiving": "Archiving", - "access": "Access to the pool" + "votes_possible": "Les réponses possibles seront :", + "votes_possible_single": "Uniquement « oui »", + "votes_possible_normal": "« oui » ou « peut-être »", + "votes_possible_full": "« oui » ou « peut-être » ou « non »", + "archiving": "Les personnes sondées pourront voter jusqu’au ", + "archiving_start": "Elles", + "archiving_can": "auront", + "archiving_can_not": "n'auront pas", + "archiving_end": "la possibilité de modifier", + "modfiy_their": "leur vote", + "modfiy_everyone": "tous les votes", + "access": "Accès au sondage", + "access_url": "Les votants pourront y accéder via cette adresse :", + "access_url_key": "URL", + "see_pass": "voir", + "access_instructions": "peut contenir des lettres, chiffres et des tirets", + "access_want": "Je", + "access_want_yes": "souhaite", + "access_want_no": "n'ai pas besoin", + "access_protect": "qu’il soit protégé par un mot de passe.", + "validate_btn": "Créer ce sondage !" }, - "pollGraphic":{ - "choiceColorblind":"I am", - "choiceNotColorblind":"I am not", - "colorblindText":"colorblind." + "admin": { + "deletion": "Tout supprimer", + "deletion_desc": "Dans le cas où vous voudriez tout supprimer, ce bouton est fait pour vous :", + "deletion_btn": "Supprimer le sondage", + "link": "Liens d’accès au sondage", + "link_admin": "Coté administrateur·ice", + "link_admin_desc": "Pour accéder au sondage et à tous ses paramètres :", + "link_admin_btn": "Voir le sondage coté administrateur·ice", + "copy_link": "Copier le lien", + "polled_people": "Côté sondé·es", + "polled_people_desc": "Pour accéder au sondage et à tous ses paramètres : https://framadate.org/urladmindusondage", + "polled_people_btn": "Voir le sondage", + "email_links": "Recevoir les liens par mail", + "email_links_desc": "Pour être sur de retrouver ces liens, nous pouvons vous les envoyer sur votre mail", + "email_links_key": "mail", + "email_links_btn": "Envoyer les liens du sondage" + }, + "pollGraphic": { + "choiceColorblind": "I am", + "choiceNotColorblind": "I am not", + "colorblindText": "colorblind." } } diff --git a/src/assets/i18n/fr.json b/src/assets/i18n/fr.json index 53dc4aa1..bc0d6e64 100644 --- a/src/assets/i18n/fr.json +++ b/src/assets/i18n/fr.json @@ -65,14 +65,55 @@ "links_mail": "Recevoir les liens par e-mail" }, "visibility": { + "top_txt": "Un peu de paramétrage…", "title": "Visibilité des réponses", + "visibility_want": "Je veux que", + "visibility_link": "Tout le monde", + "visibility_nobody": "seulement moi", + "visibility_see": "puisse voir les réponses au sondage.", "votes": "Votes", - "archiving": "Archivage", - "access": "Accès au sondage" + "votes_possible": "Les réponses possibles seront :", + "votes_possible_single": "Uniquement « oui »", + "votes_possible_normal": "« oui » ou « peut-être »", + "votes_possible_full": "« oui » ou « peut-être » ou « non »", + "archiving": "Les personnes sondées pourront voter jusqu’au ", + "archiving_start": "Elles", + "archiving_can": "auront", + "archiving_can_not": "n'auront pas", + "archiving_end": "la possibilité de modifier", + "modfiy_their": "leur vote", + "modfiy_everyone": "tous les votes", + "access": "Accès au sondage", + "access_url": "Les votants pourront y accéder via cette adresse :", + "access_url_key": "URL", + "see_pass": "voir", + "access_instructions": "peut contenir des lettres, chiffres et des tirets", + "access_want": "Je", + "access_want_yes": "souhaite", + "access_want_no": "n'ai pas besoin", + "access_protect": "qu’il soit protégé par un mot de passe.", + "validate_btn": "Créer ce sondage !" }, - "pollGraphic":{ - "choiceColorblind":"Je suis", - "choiceNotColorblind":"Je ne suis pas", - "colorblindText":"daltonien." + "admin": { + "deletion": "Tout supprimer", + "deletion_desc": "Dans le cas où vous voudriez tout supprimer, ce bouton est fait pour vous :", + "deletion_btn": "Supprimer le sondage", + "link": "Liens d’accès au sondage", + "link_admin": "Coté administrateur·ice", + "link_admin_desc": "Pour accéder au sondage et à tous ses paramètres :", + "link_admin_btn": "Voir le sondage coté administrateur·ice", + "copy_link": "Copier le lien", + "polled_people": "Côté sondé·es", + "polled_people_desc": "Pour accéder au sondage et à tous ses paramètres : https://framadate.org/urladmindusondage", + "polled_people_btn": "Voir le sondage", + "email_links": "Recevoir les liens par mail", + "email_links_desc": "Pour être sur de retrouver ces liens, nous pouvons vous les envoyer sur votre mail", + "email_links_key": "mail", + "email_links_btn": "Envoyer les liens du sondage" + }, + "pollGraphic": { + "choiceColorblind": "Je suis", + "choiceNotColorblind": "Je ne suis pas", + "colorblindText": "daltonien." } } diff --git a/src/assets/img/icone-langue.svg b/src/assets/img/icone-langue.svg new file mode 100644 index 00000000..bde0be9f --- /dev/null +++ b/src/assets/img/icone-langue.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/img/icone-menu.svg b/src/assets/img/icone-menu.svg new file mode 100644 index 00000000..8f9fde21 --- /dev/null +++ b/src/assets/img/icone-menu.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/scss/atoms/_buttons.scss b/src/assets/scss/atoms/_buttons.scss index e84c9276..881cf7d0 100644 --- a/src/assets/scss/atoms/_buttons.scss +++ b/src/assets/scss/atoms/_buttons.scss @@ -1,6 +1,6 @@ @charset "UTF-8"; -@mixin btnTheme ($color) { +@mixin btnTheme($color) { background-color: $color; color: $white; &.btn--outline { @@ -12,6 +12,7 @@ &:hover, &:active { background-color: rgba($color, .8); + &.btn--outline { background-color: rgba($color, .2); } @@ -43,9 +44,16 @@ display: block; min-width: 100%; } - &--mini{ - background-color: $mini-button-color; + + &--mini { + background-color: $mini-button-color; } + &--link { + min-width: 219.3px; + margin: 0 auto; + display: block; + } + } diff --git a/src/assets/scss/atoms/_forms.scss b/src/assets/scss/atoms/_forms.scss index cc0fde2f..70ce9843 100644 --- a/src/assets/scss/atoms/_forms.scss +++ b/src/assets/scss/atoms/_forms.scss @@ -1,63 +1,78 @@ @charset "UTF-8"; -input[type="date"]::after{ - content:"au format JJ/MM/AAAA"; - display: inline-block; - position: relative; + +.input-lg { + display: block; + width: 100%; } + +select { + margin-right: 1ch; +} + +input { + margin-right: 1ch; + + &[type="date"]::after { + content: "au format JJ/MM/AAAA"; + display: inline-block; + position: relative; + } +} + input, select, textarea { - padding: 1rem; - border: 1px solid $secondary_color; - border-bottom: 3px solid $primary_color; + padding: 1rem; + border: 1px solid $secondary_color; + border-bottom: 3px solid $primary_color; } input, select { - display: inline-block; - margin-bottom:10px; - margin-left:5px; + display: inline-block; + margin-bottom: 10px; + margin-left: 5px; } textarea { - width: 100%; - border-left: 3px solid $primary_color; + width: 100%; + border-left: 3px solid $primary_color; } select, option { - // delete default display - -webkit-appearance : none; - -moz-appearance : none; + // delete default display + -webkit-appearance: none; + -moz-appearance: none; - background: none; - border-radius: 0; + background: none; + border-radius: 0; - background-color: transparent; - background-image: url("./assets/img/fleche_bas.svg"); - padding-right:1.5rem; + background-color: transparent; + background-image: url("./assets/img/fleche_bas.svg"); + padding-right: 1.5rem; - background-repeat: no-repeat; - background-size: 9px 8px; - background-position: right 1rem center; + background-repeat: no-repeat; + background-size: 9px 8px; + background-position: right 1rem center; - background-clip: border-box; + background-clip: border-box; - // TODO -> check what angular can do + // TODO -> check what angular can do } label { - &[for] { - cursor: pointer; - } - - &:not([for]) { - color: $dusty-orange; - - &:before { - content: "ce label n'a pas d'attribut for, c'est mal."; - color: $violet; + &[for] { + cursor: pointer; + } + + &:not([for]) { + color: $dusty-orange; + + &:before { + content: "ce label n'a pas d'attribut for, c'est mal."; + color: $violet; + } } - } } diff --git a/src/assets/scss/atoms/_headings.scss b/src/assets/scss/atoms/_headings.scss index 2a78ef80..6fcbcf84 100644 --- a/src/assets/scss/atoms/_headings.scss +++ b/src/assets/scss/atoms/_headings.scss @@ -2,14 +2,15 @@ h1, h2 { - font-family: $title_font; + font-family: $title_font; } h1 { - font-size: 2rem; - font-weight: 600; + font-size: 2.5rem; + font-weight: 600; } -h1::after{ - background-color: $primary_color; - height:2px; + +h1::after { + background-color: $primary_color; + height: 2px; } diff --git a/src/assets/scss/atoms/_section.scss b/src/assets/scss/atoms/_section.scss index a07953ea..9f44090c 100644 --- a/src/assets/scss/atoms/_section.scss +++ b/src/assets/scss/atoms/_section.scss @@ -1,7 +1 @@ @charset "UTF-8"; - -section { - & + & { - margin-top: 6rem; - } -} \ No newline at end of file diff --git a/src/assets/scss/useful_classes.scss b/src/assets/scss/useful_classes.scss index 49725305..c19b4116 100644 --- a/src/assets/scss/useful_classes.scss +++ b/src/assets/scss/useful_classes.scss @@ -3,4 +3,8 @@ .align-right { display: flex; justify-content: flex-end; -} \ No newline at end of file +} + +.pull-right { + float: right; +}