Commit 0d2c52e3 authored by Guilhem CARRON's avatar Guilhem CARRON
Browse files

Merge branch 'fix/1.5.1' into 'dev'

fix(design): Design fixs 1.5.1 konnector modal message + css after completing profile

See merge request web-et-numerique/llle_project/ecolyo!496
parents 41efdacc 37908171
......@@ -123,6 +123,7 @@ const KonnectorModal: React.FC<KonnectorModalProps> = ({
})}
>
<p>{text.first}</p>
<p>{text.second}</p>
</div>
))}
</div>
......
......@@ -30,197 +30,197 @@
}
}
}
}
.profile-question-label {
font-weight: bold;
font-size: 1.375rem;
line-height: 150%;
padding: 1rem 0;
}
.profile-question-hint {
font-size: 1rem;
color: $grey-bright;
display: block;
margin-bottom: 1rem;
font-style: italic;
}
.profile-question-answers {
display: flex;
}
.profile-question-answers-radio-long {
flex-wrap: wrap;
}
.profile-question-label {
font-weight: bold;
font-size: 1.375rem;
line-height: 150%;
padding: 1rem 0;
}
.profile-question-hint {
font-size: 1rem;
color: $grey-bright;
display: block;
margin-bottom: 1rem;
font-style: italic;
}
.profile-question-answers {
display: flex;
}
.profile-question-answers-radio-long {
flex-wrap: wrap;
}
.profile-question-answers-other {
flex-direction: column;
}
.radio_short,
.radio_long,
.checkbox {
background: linear-gradient(180deg, #323339 0%, #25262b 100%);
box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);
margin: 0.5rem 0;
display: flex;
align-items: center;
font-weight: bold;
input {
margin: 0.5rem 1rem 0.5rem 0.5rem;
appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
width: 1.2rem;
height: 1.2rem;
border-radius: 50%;
background: $dark-background;
position: relative;
.profile-question-answers-other {
flex-direction: column;
}
.radio_short,
.radio_long,
.checkbox {
background: linear-gradient(180deg, #323339 0%, #25262b 100%);
box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);
margin: 0.5rem 0;
display: flex;
align-items: center;
font-weight: bold;
input {
margin: 0.5rem 1rem 0.5rem 0.5rem;
appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
width: 1.2rem;
height: 1.2rem;
border-radius: 50%;
background: $dark-background;
position: relative;
// &:focus {
// outline: none;
// }
}
}
.checkbox {
input {
border-radius: 1px;
}
}
.radio_short,
.checkbox {
padding: 1.2rem;
border-radius: 4px;
}
.radio_long {
padding: 0.5rem 1rem;
border-radius: 4px;
text-align: center;
}
.answer-checked {
background: radial-gradient(
105.25% 64.58% at 49.68% 70.83%,
rgba(226, 137, 4, 0.5) 0%,
rgba(255, 255, 255, 0) 100%
),
#f1c017;
color: $dark-light-2;
input {
&:before,
&:after {
content: '';
position: absolute;
display: inline-block;
background: $gold-shadow;
border-radius: 0.5rem;
}
&:before {
width: 3px;
height: 12px;
left: 10px;
top: 4px;
transform: rotate(41deg);
}
&:after {
width: 3px;
height: 6px;
left: 5px;
top: 8px;
transform: rotate(133deg);
}
}
}
.number-container {
display: flex;
justify-content: left;
align-items: center;
}
.btn-profile-number {
background: $grey-linear-gradient-background;
background-color: transparent;
border: none;
border-radius: 2px;
width: 2.5rem;
height: 2.5rem;
font-size: 2rem;
color: $white;
display: flex;
align-items: center;
justify-content: center;
margin: 0.5rem;
// &:focus {
// outline: none;
// }
}
}
.checkbox {
input {
border-radius: 1px;
button:disabled {
opacity: 0.5;
}
}
.radio_short,
.checkbox {
padding: 1.2rem;
border-radius: 4px;
}
.radio_long {
padding: 0.5rem 1rem;
border-radius: 4px;
text-align: center;
}
.answer-checked {
background: radial-gradient(
105.25% 64.58% at 49.68% 70.83%,
rgba(226, 137, 4, 0.5) 0%,
rgba(255, 255, 255, 0) 100%
),
#f1c017;
color: $dark-light-2;
input {
&:before,
&:after {
content: '';
position: absolute;
display: inline-block;
background: $gold-shadow;
border-radius: 0.5rem;
.date-select {
margin: 0.5em;
border: 1px solid $gold-shadow;
background: $dark-light-2;
font-weight: bold;
.MuiInput-underline:after {
display: none;
}
&:before {
width: 3px;
height: 12px;
left: 10px;
top: 4px;
transform: rotate(41deg);
.year {
text-align: center;
display: inline-flex;
align-content: center;
font-size: 1.25rem;
font-family: $text-font;
color: $white;
width: 93px;
svg {
top: 0;
background-color: $gold-shadow;
height: 100%;
}
}
&:after {
width: 3px;
height: 6px;
left: 5px;
top: 8px;
transform: rotate(133deg);
.month {
color: $white;
font-size: 1.25rem;
text-align: center;
display: inline-flex;
align-content: center;
font-family: $text-font;
min-width: 130px;
max-width: 150px;
svg {
top: 0;
right: 0;
background-color: $gold-shadow;
height: 100%;
}
}
}
}
.number-container {
display: flex;
justify-content: left;
align-items: center;
}
.btn-profile-number {
background: $grey-linear-gradient-background;
background-color: transparent;
border: none;
border-radius: 2px;
width: 2.5rem;
height: 2.5rem;
font-size: 2rem;
color: $white;
display: flex;
align-items: center;
justify-content: center;
margin: 0.5rem;
// &:focus {
// outline: none;
// }
}
button:disabled {
opacity: 0.5;
}
.date-select {
margin: 0.5em;
border: 1px solid $gold-shadow;
background: $dark-light-2;
font-weight: bold;
.MuiInput-underline:after {
display: none;
}
.year {
text-align: center;
display: inline-flex;
align-content: center;
font-size: 1.25rem;
font-family: $text-font;
color: $white;
width: 93px;
svg {
top: 0;
background-color: $gold-shadow;
height: 100%;
}
.select-container {
display: flex;
}
.month {
.date-option {
color: $white;
font-size: 1.25rem;
text-align: center;
display: inline-flex;
align-content: center;
font-family: $text-font;
min-width: 130px;
max-width: 150px;
svg {
top: 0;
right: 0;
background-color: $gold-shadow;
height: 100%;
}
}
}
.select-container {
display: flex;
}
.date-option {
color: $white;
}
ul {
background: linear-gradient(180deg, #323339 0%, #25262b 100%);
color: $white;
font-weight: normal;
.MuiMenuItem-root {
font-family: $text-font;
text-align: center;
font-size: 1.25rem;
display: flex;
justify-content: space-evenly;
:hover {
ul {
background: linear-gradient(180deg, #323339 0%, #25262b 100%);
color: $white;
font-weight: normal;
.MuiMenuItem-root {
font-family: $text-font;
text-align: center;
font-size: 1.25rem;
display: flex;
justify-content: space-evenly;
:hover {
background-color: $gold-shadow;
}
}
.MuiListItem-root.Mui-selected,
.MuiListItem-root.Mui-selected:hover {
background-color: $gold-shadow;
color: $dark-2;
font-weight: bold;
display: flex;
justify-content: space-evenly;
}
}
.MuiListItem-root.Mui-selected,
.MuiListItem-root.Mui-selected:hover {
background-color: $gold-shadow;
color: $dark-2;
font-weight: bold;
display: flex;
justify-content: space-evenly;
}
}
[
{
"first": "La première fois cela peut prendre quelques minutes, par la suite, seulement quelques secondes."
"first": "La première fois cela peut prendre quelques minutes, par la suite, seulement quelques secondes.",
"second": ""
},
{
"first": "Afin de limiter le temps de ce premier chargement, un historique réduit de vos consommations va être chargé. Vous aurez tout de même accès à un an d'historique dès à présent." },
"first": "Afin de limiter le temps de ce premier chargement, un historique réduit de vos consommations va être chargé. Vous aurez tout de même accès à un an d'historique dès à présent.",
"second": ""
},
{
"first": "Demain matin, vous aurez accès à l'ensemble de vos données (jusqu'à trois ans d'historique)."
"first": "Demain matin, vous aurez accès à l'ensemble de vos données (jusqu'à trois ans d'historique).",
"second": ""
}
]
......@@ -10754,12 +10754,19 @@ mini-css-extract-plugin@0.5.0:
schema-utils "^1.0.0"
webpack-sources "^1.1.0"
 
minilog@3.1.0, "minilog@git+https://github.com/cozy/minilog.git#master":
minilog@3.1.0:
version "3.1.0"
resolved "git+https://github.com/cozy/minilog.git#6da0aa58759c4f1a1a7e0fd093dbe2a67c035c55"
dependencies:
microee "0.0.6"
 
"minilog@https://github.com/cozy/minilog.git#master":
version "3.1.0"
uid "6da0aa58759c4f1a1a7e0fd093dbe2a67c035c55"
resolved "https://github.com/cozy/minilog.git#6da0aa58759c4f1a1a7e0fd093dbe2a67c035c55"
dependencies:
microee "0.0.6"
minimalistic-assert@^1.0.0, minimalistic-assert@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz#2e194de044626d4a10e7f7fbc00ce73e83e4d5c7"
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment