Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
LQDN Adminsys
generateur-slogans
Commits
40db2af3
Verified
Commit
40db2af3
authored
Nov 08, 2017
by
Thibaut Broggi
Browse files
Improve css code
parent
349b4fd4
Pipeline
#1513
passed with stage
in 45 seconds
Changes
1
Pipelines
1
Hide whitespace changes
Inline
Side-by-side
static/style.css
View file @
40db2af3
/* General */
html
{
box-sizing
:
border-box
;
}
...
...
@@ -72,45 +74,6 @@ html[lang="fr"] #frButton {
cursor
:
default
;
}
@media
(
min-width
:
992px
)
{
nav
{
flex-direction
:
column
;
width
:
7vw
;
min-height
:
100vh
;
font-size
:
3vw
;
}
nav
>
*
{
width
:
7vw
;
height
:
7vw
;
border-bottom
:
1px
solid
#3b68b0
;
border-left
:
initial
!important
;
}
nav
>
:nth-child
(
1
)
>
img
{
height
:
initial
;
}
nav
>
*
:not
(
:nth-child
(
1
))
{
padding-top
:
2vw
;
}
#inputs
{
width
:
50%
;
margin-left
:
7vw
;
}
#inputs
>
*
{
padding-left
:
10%
;
padding-right
:
10%
;
}
}
@media
(
max-width
:
991px
)
{
#langPicker
{
display
:
none
;
}
}
nav
>
.active-tab
{
background-color
:
#3b68b0
;
...
...
@@ -187,38 +150,6 @@ a {
border
:
3px
solid
transparent
;
}
@media
(
max-width
:
991px
)
{
.colorpicker
,
.iconpicker
{
flex-wrap
:
nowrap
!important
;
overflow-x
:
auto
;
}
.colorpicker
label
,
.iconpicker
label
{
flex-shrink
:
0
;
}
.iconpicker
{
height
:
110px
;
overflow-y
:
hidden
!important
;
}
#inputs
>
div
>
h2
{
margin-left
:
10px
;
}
}
@media
(
max-width
:
600px
)
{
.iconpicker
{
height
:
60px
;
}
.iconpicker
>
label
{
width
:
50px
!important
;
height
:
50px
!important
;
}
}
div
[
id
^=
"step"
]
{
display
:
none
;
}
...
...
@@ -247,84 +178,6 @@ body, form {
flex-direction
:
row
;
}
@media
(
max-width
:
991px
)
{
#credits
{
display
:
none
;
}
body
,
form
{
flex-direction
:
column
;
}
#inputs
{
margin-top
:
16.66vw
;
padding-bottom
:
20px
;
}
.randomize-button-container
{
display
:
none
!important
;
}
.navButtons
{
display
:
none
;
}
textarea
,
input
[
type
=
"text"
]
{
width
:
90%
!important
;
margin-left
:
5%
!important
;
}
textarea
{
height
:
3.5em
;
}
main
>
div
:nth-child
(
2
)
{
margin
:
auto
;
}
h2
.title-big
{
display
:
none
;
}
div
#step3
>
.fontpicker
{
max-height
:
150px
;
overflow-x
:
auto
;
}
}
@media
(
max-width
:
600px
)
{
main
>
div
:nth-child
(
2
)
>
a
{
padding-left
:
1.5em
;
padding-right
:
1.5em
;
}
main
>
div
:nth-child
(
2
)
button
>
.text
{
display
:
none
;
}
.colorpicker
>
label
{
width
:
60px
!important
;
height
:
60px
!important
;
padding
:
.5em
!important
;
}
}
@media
(
min-width
:
992px
)
{
main
{
min-height
:
100vh
;
padding-left
:
40px
;
}
input
#step2value
{
height
:
200px
;
}
h2
.title-small
,
main
.randomize
{
display
:
none
;
}
}
main
>
div
:nth-child
(
2
)
{
text-align
:
right
;
width
:
600px
;
...
...
@@ -339,12 +192,6 @@ main > #credits {
margin-top
:
50px
;
}
@media
(
min-width
:
992px
)
{
a
#save-image
{
margin-top
:
2em
;
}
}
.iconpicker
{
max-height
:
500px
;
overflow-y
:
auto
;
...
...
@@ -394,6 +241,138 @@ textarea, input[type="text"] {
resize
:
none
;
}
/* big devices >= 992px */
@media
(
min-width
:
992px
)
{
nav
{
flex-direction
:
column
;
width
:
7vw
;
min-height
:
100vh
;
font-size
:
3vw
;
}
nav
>
*
{
width
:
7vw
;
height
:
7vw
;
border-bottom
:
1px
solid
#3b68b0
;
border-left
:
initial
!important
;
}
nav
>
:nth-child
(
1
)
>
img
{
height
:
initial
;
}
nav
>
*
:not
(
:nth-child
(
1
))
{
padding-top
:
2vw
;
}
#inputs
{
width
:
50%
;
margin-left
:
7vw
;
}
#inputs
>
*
{
padding-left
:
10%
;
padding-right
:
10%
;
}
main
{
min-height
:
100vh
;
padding-left
:
40px
;
}
input
#step2value
{
height
:
200px
;
}
h2
.title-small
,
main
.randomize
{
display
:
none
;
}
}
/* small/medium devices < 991px */
@media
(
max-width
:
991px
)
{
#langPicker
,
#credits
,
.randomize-button-container
,
.navButtons
,
h2
.title-big
{
display
:
none
!important
;
}
a
#save-image
{
margin-top
:
2em
;
}
body
,
form
{
flex-direction
:
column
;
}
#inputs
{
margin-top
:
16.66vw
;
padding-bottom
:
20px
;
}
textarea
,
input
[
type
=
"text"
]
{
width
:
90%
!important
;
margin-left
:
5%
!important
;
}
textarea
{
height
:
3.5em
;
}
main
>
div
:nth-child
(
2
)
{
margin
:
auto
;
}
div
#step3
>
.fontpicker
{
max-height
:
150px
;
overflow-x
:
auto
;
}
.colorpicker
,
.iconpicker
{
flex-wrap
:
nowrap
!important
;
overflow-x
:
auto
;
}
.colorpicker
label
,
.iconpicker
label
{
flex-shrink
:
0
;
}
.iconpicker
{
height
:
110px
;
overflow-y
:
hidden
!important
;
}
#inputs
>
div
>
h2
{
margin-left
:
10px
;
}
}
/* very small devices < 600px */
@media
(
max-width
:
600px
)
{
main
>
div
:nth-child
(
2
)
>
a
{
padding-left
:
1.5em
;
padding-right
:
1.5em
;
}
main
>
div
:nth-child
(
2
)
button
>
.text
{
display
:
none
;
}
.colorpicker
>
label
{
width
:
60px
!important
;
height
:
60px
!important
;
padding
:
.5em
!important
;
}
.iconpicker
{
height
:
60px
;
}
.iconpicker
>
label
{
width
:
50px
!important
;
height
:
50px
!important
;
}
}
/* Fonts */
@font-face
{
font-family
:
'FiraSans'
;
src
:
url('https://fonts.lqdn.fr/collections/Fira_Sans/FiraSans-Regular.woff2')
format
(
'woff2'
);
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment