tykayn/funky-framadate-front
1
1
Fork 1
mirror of https://framagit.org/framasoft/framadate/funky-framadate-front.git synced 2023-08-25 13:53:14 +02:00
Code Issues Projects Releases Wiki Activity

erasable button on first field

Browse Source
This commit is contained in:
Tykayn 2021-05-03 15:10:29 +02:00 committed by tykayn
parent 5d39b7aa3e
commit 6fdb56786a
4 changed files with 66 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

90
src/app/features/administration/form/base-config/base-config.component.html
View File

@ -1,17 +1,9 @@
<form [formGroup]="form">
<div class="columns">
<div class="column">
<p>
<label for="title">
{{ 'creation.choose_title' | translate }}
</p>
<br />
<label class="hidden" for="title">Titre</label>
<!-- errors:-->
<!-- <pre class="debug padded warning">-->
<!-- form.errors :-->
<!-- {{ form.controls.title.errors | json }}-->
<!-- </pre-->
<!-- >-->
</label>
<input
class="input"
@ -23,9 +15,6 @@
required="required"
#title
/>
<div class="hint" *ngIf="form.controls.title.errors">
Ce champ est requis
</div>
<button
mat-button
*ngIf="form.value.title"
@ -36,23 +25,37 @@
>
<i class="fa fa-close"></i>
</button>
<div class="hint" *ngIf="form.controls.title.errors">
Ce champ est requis
</div>
<p>
<label for="creatorPseudo">
<span>
{{ 'creation.email' | translate }}
</span>
</label>
<label for="creatorPseudo">
<span>
{{ 'creation.email' | translate }}
</span>
</label>
<input
#creatorEmail
matInput
placeholder="{{ 'creation.email_placeholder' | translate }}"
formControlName="creatorEmail"
id="creatorEmail"
required
/>
</p>
<input
#creatorEmail
matInput
placeholder="{{ 'creation.email_placeholder' | translate }}"
formControlName="creatorEmail"
id="creatorEmail"
required
/>
<button
mat-button
*ngIf="form.value.creatorEmail"
matSuffix
mat-icon-button
aria-label="Clear"
(click)="form.patchValue({ creatorEmail: '' })"
>
<i class="fa fa-close"></i>
</button>
<div class="hint" *ngIf="form.controls.creatorEmail.errors">
Ce champ est requis
</div>
<br />
<p>
@ -69,33 +72,24 @@
id="creatorPseudo"
required
/>
<button
mat-button
*ngIf="form.value.creatorPseudo"
matSuffix
mat-icon-button
aria-label="Clear"
(click)="form.patchValue({ creatorPseudo: '' })"
>
<i class="fa fa-close"></i>
</button>
</p>
</div>
<hr />
</div>
custom url:
Url personnalisée:
{{ form.value.custom_url }}
<hr />
<div class="columns">
<div class="column">
<!-- <img src="assets/img/undraw_Moving_twwf.svg" alt="image WIP" />-->
<div>
<h2>
{{ 'choices.title' | translate }}
</h2>
{{ 'dates.add' | translate }}
<p>
<i>
{{ 'choices.helper' | translate }}
</i>
</p>
{{ 'choices.answer_preset_1' | translate }}
{{ 'choices.add' | translate }}
{{ 'choices.continue' | translate }}
</div>
</div>
</div>
<div class="column">
<button class="btn btn--warning" (click)="askInitFormDefault()">
<i class="fa fa-refresh"></i>

13
src/app/features/administration/form/date-select/date-select.component.html
View File

@ -1,5 +1,18 @@
<div class="date-selection">
<form [formGroup]="form">
<h2>
{{ 'choices.title' | translate }}
</h2>
{{ 'dates.add' | translate }}
<p>
<i>
{{ 'choices.helper' | translate }}
</i>
</p>
{{ 'choices.answer_preset_1' | translate }}
{{ 'choices.add' | translate }}
{{ 'choices.continue' | translate }}
<!-- interval-->
<button
(click)="showDateInterval = !showDateInterval"

4
src/app/features/administration/form/date-select/date-select.component.ts
View File

@ -26,8 +26,8 @@ export class DateSelectComponent implements OnInit {
@Input()
public form: FormGroup;
public showDateInterval = true;
public allowSeveralHours = true;
public showDateInterval = false;
public allowSeveralHours = false;
today = new Date();
startDateInterval: string;
endDateInterval: string;

25
src/styles/partials/_forms.scss
View File

@ -1,6 +1,7 @@
@charset "UTF-8";
label {
margin-top: 1em;
line-height: 2.5em;
}
.ui-inputswitch {
@ -13,14 +14,13 @@ label {
width: 100%;
}
select {
margin-right: 1ch;
}
input {
margin-right: 1ch;
margin-bottom: 1em;
margin-top: 1em;
+ button,
+ .mat-icon-button {
margin-bottom: 1em;
}
&[type='date']::after {
content: 'au format JJ/MM/AAAA';
@ -32,25 +32,18 @@ input {
input,
select,
textarea {
display: inline-block;
padding: 1rem;
border: 1px solid $secondary_color;
border-bottom: 3px solid $primary_color;
}
input,
select {
display: inline-block;
width: calc(100% - 45px) !important;
max-width: 40em !important;
}
.next {
max-width: 200px;
}
input[type='text'],
textarea {
max-width: 350px;
}
li {
list-style-type: none;
}