Liness/framadate-responsive
5
0
Fork 0
forked from tykayn/funky-framadate-front
Code Pull Requests Activity

⚡ lang input placement

Browse Source
This commit is contained in:
Baptiste Lemoine 2020-01-20 15:35:33 +01:00
parent f8568eb910
commit ff5c11e79c
10 changed files with 133 additions and 121 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/app.component.html
View File

@ -29,7 +29,7 @@
>
<select
name="language"
class="Language-"
class="language-selector"
(change)="switchLanguage(currentLang)"
[(ngModel)]="currentLang"
>

20
src/app/app.component.scss
View File

@ -1,15 +1,19 @@
@charset "UTF-8";
header {
h1,
a {
&::before,
&::after {
display: none;
h1,
a {
&::before,
&::after {
display: none;
}
}
}
}
i {
display: block;
}
display: block;
}
.language-selector {
width: auto;
}

17
src/app/pages/resume/resume.component.html
View File

@ -31,20 +31,11 @@
</div >
<button
(click)='submitCreationAndGoToEnd()'
class="btn btn--primary btn--full"
i18n="@@confirm" >
<button [routerLink]="'/step/visibility'"
class="btn btn--primary btn--full">
C'est parfait!
<i
class='fa fa-paper-plane'
*ngIf="!config.loading" ></i >
<span
class="loading"
*ngIf="config.loading" >
<i class="fa fa-refresh fa-spin fa-fw" ></i >
</span >
</button >
</button>
<div class="back" >
<a

3
src/app/pages/resume/resume.component.ts
View File

@ -15,7 +15,4 @@ export class ResumeComponent extends BaseComponent {
super(config);
}
submitCreationAndGoToEnd() {
this.config.createPoll();
}
}

20
src/app/pages/visibility/visibility.component.html
View File

@ -94,7 +94,7 @@
</section >
<section class="access" >
<h2 >
<h2 class='title' >
{{"visibility.access"|translate}}
</h2 >
<label for="url" >
@ -159,11 +159,21 @@
</div >
</section >
<a
[routerLink]="'/step/end'"
class="btn btn-link btn--primary" >
<button
(click)='submitCreationAndGoToEnd()'
class="btn btn--primary btn--full"
i18n="@@confirm" >
{{"visibility.validate_btn"|translate}}
</a >
<i
class='fa fa-paper-plane'
*ngIf="!config.loading" ></i >
<span
class="loading"
*ngIf="config.loading" >
<i class="fa fa-refresh fa-spin fa-fw" ></i >
</span >
</button >
<div class="back" >
<a

5
src/app/pages/visibility/visibility.component.scss
View File

@ -0,0 +1,5 @@
:host {
h2 {
margin-top: 1em;
}
}

3
src/app/pages/visibility/visibility.component.ts
View File

@ -21,5 +21,8 @@ export class VisibilityComponent extends BaseComponent implements OnInit {
this.config.expirationDate = (this.config.addDaysToDate(this.config.expiracyDateDefaultInDays, new Date())).toISOString().substring(0, 10);
}
submitCreationAndGoToEnd() {
this.config.createPoll();
}
}

4
src/assets/scss/atoms/_forms.scss
View File

@ -97,10 +97,6 @@ input {
}
}
label {
font-weight: 600;
font-size: 18px;
}
.comment {
border-left: 6px solid $ugly-purple;

108
src/assets/scss/atoms/_links.scss
View File

@ -1,66 +1,66 @@
@charset "UTF-8";
a {
display: inline-block;
position: relative;
font-family: $default_font;
font-weight: 600;
font-size: 1.6rem;
color: $font_color;
&,
&:hover {
text-decoration: none;
}
&::before,
&::after {
content: "";
}
&.next::before,
&.prev::after {
position: absolute;
top: 0;
bottom: 0;
display: block;
width: 100%;
height: 0.6rem;
margin: auto;
background-color: $secondary_color;
z-index: -1;
}
&.next::after,
&.prev::before {
display: inline-block;
width: 1rem;
height: 1rem;
border-bottom: 2px solid #000;
}
position: relative;
font-family: $default_font;
font-weight: 600;
font-size: 1.6rem;
color: $font_color !important;
&.next::after {
margin-right: 1rem;
border-right: 2px solid #000;
transform: rotate(-45deg);
}
&,
&:hover {
text-decoration: none;
}
&.prev::before {
margin-left: 1rem;
border-left: 2px solid #000;
transform: rotate(45deg);
}
&::before,
&::after {
content: "";
}
&:hover {
&.next::before,
&.prev::after {
background-color: rgba($primary_color,0.7);
position: absolute;
top: 0;
bottom: 0;
display: block;
width: 100%;
height: 0.6rem;
margin: auto;
background-color: $secondary_color;
z-index: -1;
}
}
span {
padding-right: 1rem;
padding-left: 1rem;
}
&.next::after,
&.prev::before {
display: inline-block;
width: 1rem;
height: 1rem;
border-bottom: 2px solid #000;
}
&.next::after {
margin-right: 1rem;
border-right: 2px solid #000;
transform: rotate(-45deg);
}
&.prev::before {
margin-left: 1rem;
border-left: 2px solid #000;
transform: rotate(45deg);
}
&:hover {
&.next::before,
&.prev::after {
background-color: rgba($primary_color, 0.7);
}
}
span {
padding-right: 1rem;
padding-left: 1rem;
}
}

72
src/assets/scss/molecules/_logo.scss
View File

@ -1,64 +1,70 @@
.logo_first, .logo_second {
padding-left: 0;
padding-right: 0;
padding-left: 0;
padding-right: 0;
}
.logo_first {
color: $logo_color;
color: $logo_color;
}
.logo_second {
color: $logo_color_2;
color: $logo_color_2;
}
.wrapper {
display: grid;
margin-left: auto;
margin-right: auto;
width: 80px;
margin-top: 1rem;
display: grid;
margin-left: auto;
margin-right: auto;
width: 20em;
margin-top: 1rem;
select {
float: right;
}
}
.lang_icon {
grid-column: 1;
grid-row: 1;
margin-left: auto;
margin-right: auto;
grid-column: 1;
grid-row: 1;
margin-left: auto;
margin-right: auto;
margin-bottom: 1ch;
}
.menu_icon {
grid-column: 2;
grid-row: 1;
margin-left: auto;
margin-right: auto;
grid-column: 2;
grid-row: 1;
margin-left: auto;
margin-right: auto;
}
.lang_label {
grid-column: 1;
grid-row: 2;
grid-column: 1;
grid-row: 2;
}
.menu_label {
grid-column: 2;
grid-row: 2;
font-family: SourceSansPro;
font-size: 11px;
padding-top: 10px;
margin-left: auto;
margin-right: auto;
grid-column: 2;
grid-row: 2;
font-family: SourceSansPro;
font-size: 11px;
padding-top: 10px;
margin-left: auto;
margin-right: auto;
}
.legend_first {
color: $legend_color;
padding-right: 0rem;
padding-left: 0rem;
color: $legend_color;
padding-right: 0rem;
padding-left: 0rem;
}
.legend_second {
color: $legend_color_2;
padding-right: 0rem;
padding-left: 0rem;
color: $legend_color_2;
padding-right: 0rem;
padding-left: 0rem;
}
.legend {
font-size: 10px;
font-size: 10px;
}