diff --git a/src/assets/icons/tabbar/analysis/analysis-off.svg b/src/assets/icons/tabbar/analysis/analysis-off.svg
index 32ef11bb2f7f77fee4a99f3938a3a12f57ab2be3..712a7f5204bd1b128cf059a408e50584e9681bb0 100644
--- a/src/assets/icons/tabbar/analysis/analysis-off.svg
+++ b/src/assets/icons/tabbar/analysis/analysis-off.svg
@@ -3,15 +3,15 @@
<rect fill="white" x="6" y="9" width="16" height="19"/>
<path d="M20.0953 10.2014C18.0606 9.80662 15.9559 9.99468 14.0235 10.7439C12.0911 11.4931 10.4097 12.773 9.17301 14.4361C7.93629 16.0993 7.19458 18.0779 7.03334 20.1442C6.8721 22.2105 7.29788 24.2803 8.26163 26.1151L18 21L20.0953 10.2014Z"/>
</mask>
-<path d="M20.0953 10.2014C18.0606 9.80662 15.9559 9.99468 14.0235 10.7439C12.0911 11.4931 10.4097 12.773 9.17301 14.4361C7.93629 16.0993 7.19458 18.0779 7.03334 20.1442C6.8721 22.2105 7.29788 24.2803 8.26163 26.1151L18 21L20.0953 10.2014Z" stroke="#ABABAB" stroke-width="2" mask="url(#path-1-outside-1_6562:815)"/>
+<path d="M20.0953 10.2014C18.0606 9.80662 15.9559 9.99468 14.0235 10.7439C12.0911 11.4931 10.4097 12.773 9.17301 14.4361C7.93629 16.0993 7.19458 18.0779 7.03334 20.1442C6.8721 22.2105 7.29788 24.2803 8.26163 26.1151L18 21L20.0953 10.2014Z" stroke="currentColor" stroke-width="2" mask="url(#path-1-outside-1_6562:815)"/>
<mask id="path-2-outside-2_6562:815" maskUnits="userSpaceOnUse" x="6" y="9" width="24" height="24" fill="black">
<rect fill="white" x="6" y="9" width="24" height="24"/>
<path d="M20.0953 10.2014C17.2708 9.65336 14.344 10.2338 11.9424 11.8182C9.54076 13.4027 7.85554 15.865 7.24802 18.6773C6.64049 21.4896 7.15902 24.428 8.69243 26.8625C10.2258 29.297 12.6521 31.0338 15.4509 31.7006C18.2498 32.3673 21.1985 31.9109 23.6648 30.4292C26.1311 28.9475 27.9187 26.5585 28.6444 23.7744C29.3701 20.9902 28.976 18.0325 27.5467 15.5355C26.1174 13.0384 23.7666 11.2008 20.9984 10.4165L18 21L20.0953 10.2014Z"/>
</mask>
-<path d="M20.0953 10.2014C17.2708 9.65336 14.344 10.2338 11.9424 11.8182C9.54076 13.4027 7.85554 15.865 7.24802 18.6773C6.64049 21.4896 7.15902 24.428 8.69243 26.8625C10.2258 29.297 12.6521 31.0338 15.4509 31.7006C18.2498 32.3673 21.1985 31.9109 23.6648 30.4292C26.1311 28.9475 27.9187 26.5585 28.6444 23.7744C29.3701 20.9902 28.976 18.0325 27.5467 15.5355C26.1174 13.0384 23.7666 11.2008 20.9984 10.4165L18 21L20.0953 10.2014Z" stroke="#ABABAB" stroke-width="2" stroke-linejoin="round" mask="url(#path-2-outside-2_6562:815)"/>
+<path d="M20.0953 10.2014C17.2708 9.65336 14.344 10.2338 11.9424 11.8182C9.54076 13.4027 7.85554 15.865 7.24802 18.6773C6.64049 21.4896 7.15902 24.428 8.69243 26.8625C10.2258 29.297 12.6521 31.0338 15.4509 31.7006C18.2498 32.3673 21.1985 31.9109 23.6648 30.4292C26.1311 28.9475 27.9187 26.5585 28.6444 23.7744C29.3701 20.9902 28.976 18.0325 27.5467 15.5355C26.1174 13.0384 23.7666 11.2008 20.9984 10.4165L18 21L20.0953 10.2014Z" stroke="currentColor" stroke-width="2" stroke-linejoin="round" mask="url(#path-2-outside-2_6562:815)"/>
<mask id="path-3-outside-3_6562:815" maskUnits="userSpaceOnUse" x="6" y="17" width="13" height="11" fill="black">
<rect fill="white" x="6" y="17" width="13" height="11"/>
<path d="M8.29428 26.1768C7.09512 23.9285 6.71367 21.3337 7.21507 18.8354L18 21L8.29428 26.1768Z"/>
</mask>
-<path d="M8.29428 26.1768C7.09512 23.9285 6.71367 21.3337 7.21507 18.8354L18 21L8.29428 26.1768Z" stroke="#ABABAB" stroke-width="2" stroke-linejoin="round" mask="url(#path-3-outside-3_6562:815)"/>
+<path d="M8.29428 26.1768C7.09512 23.9285 6.71367 21.3337 7.21507 18.8354L18 21L8.29428 26.1768Z" stroke="currentColor" stroke-width="2" stroke-linejoin="round" mask="url(#path-3-outside-3_6562:815)"/>
</svg>
diff --git a/src/assets/icons/tabbar/conso/conso-off.svg b/src/assets/icons/tabbar/conso/conso-off.svg
index 6413c7c8b02449f4a838a7cd2a25c0d9865e2803..c94c7c04cce56d2c18b7540ca5b056c2070c4266 100644
--- a/src/assets/icons/tabbar/conso/conso-off.svg
+++ b/src/assets/icons/tabbar/conso/conso-off.svg
@@ -1,3 +1,3 @@
<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M22.5 28.992V29.492H23H27H27.5V28.992V12C27.5 11.6022 27.342 11.2206 27.0607 10.9393C26.7794 10.658 26.3978 10.5 26 10.5H24C23.6022 10.5 23.2206 10.658 22.9393 10.9393C22.658 11.2206 22.5 11.6022 22.5 12V28.992ZM15.5 28.992V29.492H16H20H20.5V28.992V18C20.5 17.6022 20.342 17.2206 20.0607 16.9393C19.7794 16.658 19.3978 16.5 19 16.5H17C16.6022 16.5 16.2206 16.658 15.9393 16.9393C15.658 17.2206 15.5 17.6022 15.5 18V28.992ZM8.5 28.992V29.492H9H13H13.5V28.992V24C13.5 23.6022 13.342 23.2206 13.0607 22.9393C12.7794 22.658 12.3978 22.5 12 22.5H10C9.60217 22.5 9.22064 22.658 8.93934 22.9393C8.65804 23.2206 8.5 23.6022 8.5 24V28.992Z" stroke="#ABABAB"/>
+<path d="M22.5 28.992V29.492H23H27H27.5V28.992V12C27.5 11.6022 27.342 11.2206 27.0607 10.9393C26.7794 10.658 26.3978 10.5 26 10.5H24C23.6022 10.5 23.2206 10.658 22.9393 10.9393C22.658 11.2206 22.5 11.6022 22.5 12V28.992ZM15.5 28.992V29.492H16H20H20.5V28.992V18C20.5 17.6022 20.342 17.2206 20.0607 16.9393C19.7794 16.658 19.3978 16.5 19 16.5H17C16.6022 16.5 16.2206 16.658 15.9393 16.9393C15.658 17.2206 15.5 17.6022 15.5 18V28.992ZM8.5 28.992V29.492H9H13H13.5V28.992V24C13.5 23.6022 13.342 23.2206 13.0607 22.9393C12.7794 22.658 12.3978 22.5 12 22.5H10C9.60217 22.5 9.22064 22.658 8.93934 22.9393C8.65804 23.2206 8.5 23.6022 8.5 24V28.992Z" stroke="currentColor"/>
</svg>
diff --git a/src/assets/icons/tabbar/defi/defi-off.svg b/src/assets/icons/tabbar/defi/defi-off.svg
index 2c2c66c1c13cce203c76724e0820d5ef0efc4be1..78b8169ede427745cdc31589b0813157cab1e0ea 100644
--- a/src/assets/icons/tabbar/defi/defi-off.svg
+++ b/src/assets/icons/tabbar/defi/defi-off.svg
@@ -1,3 +1,3 @@
<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M18.3104 29.4627L18.5 29.5404L18.6896 29.4627C22.9601 27.7125 25.0253 25.5476 25.9126 22.8119C26.7071 20.3625 26.5302 17.5035 26.3304 14.2741C26.3126 13.9877 26.2947 13.6983 26.2773 13.406L26.2505 12.957L25.8012 12.9363C23.2157 12.8171 20.9183 11.9841 18.7737 10.5815L18.5 10.4026L18.2263 10.5815C16.0817 11.9841 13.7843 12.8171 11.1988 12.9363L10.7495 12.957L10.7227 13.406C10.7053 13.6983 10.6874 13.9877 10.6696 14.2741C10.4698 17.5035 10.2929 20.3625 11.0874 22.8119C11.9747 25.5476 14.0399 27.7125 18.3104 29.4627Z" stroke="#A0A0A0"/>
+<path d="M18.3104 29.4627L18.5 29.5404L18.6896 29.4627C22.9601 27.7125 25.0253 25.5476 25.9126 22.8119C26.7071 20.3625 26.5302 17.5035 26.3304 14.2741C26.3126 13.9877 26.2947 13.6983 26.2773 13.406L26.2505 12.957L25.8012 12.9363C23.2157 12.8171 20.9183 11.9841 18.7737 10.5815L18.5 10.4026L18.2263 10.5815C16.0817 11.9841 13.7843 12.8171 11.1988 12.9363L10.7495 12.957L10.7227 13.406C10.7053 13.6983 10.6874 13.9877 10.6696 14.2741C10.4698 17.5035 10.2929 20.3625 11.0874 22.8119C11.9747 25.5476 14.0399 27.7125 18.3104 29.4627Z" stroke="currentColor"/>
</svg>
diff --git a/src/assets/icons/tabbar/parametre/parametre-off.svg b/src/assets/icons/tabbar/parametre/parametre-off.svg
index 106ff4754968736898580475fd8866076406d549..d3556acce91dd95bf9b45d68b7731cde71185c16 100644
--- a/src/assets/icons/tabbar/parametre/parametre-off.svg
+++ b/src/assets/icons/tabbar/parametre/parametre-off.svg
@@ -1,8 +1,8 @@
<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
-<line x1="7.5" y1="11.5" x2="28.5" y2="11.5" stroke="#A0A0A0" stroke-linecap="round"/>
-<line x1="7.5" y1="18.5" x2="28.5" y2="18.5" stroke="#A0A0A0" stroke-linecap="round"/>
-<line x1="7.5" y1="25.5" x2="28.5" y2="25.5" stroke="#A0A0A0" stroke-linecap="round"/>
-<circle cx="21.5" cy="11.5" r="2.5" fill="#A0A0A0"/>
-<circle cx="13.5" cy="18.5" r="2.5" fill="#A0A0A0"/>
-<circle cx="22.5" cy="25.5" r="2.5" fill="#A0A0A0"/>
+<line x1="7.5" y1="11.5" x2="28.5" y2="11.5" stroke="currentColor" stroke-linecap="round"/>
+<line x1="7.5" y1="18.5" x2="28.5" y2="18.5" stroke="currentColor" stroke-linecap="round"/>
+<line x1="7.5" y1="25.5" x2="28.5" y2="25.5" stroke="currentColor" stroke-linecap="round"/>
+<circle cx="21.5" cy="11.5" r="2.5" fill="currentColor"/>
+<circle cx="13.5" cy="18.5" r="2.5" fill="currentColor"/>
+<circle cx="22.5" cy="25.5" r="2.5" fill="currentColor"/>
</svg>
diff --git a/src/components/Action/ActionChoose.tsx b/src/components/Action/ActionChoose.tsx
index 09f328f2fe1f25351d247ccc27b6eac747b16d0c..afdf64117986538b49a5040f2f8ffcb84261bbee 100644
--- a/src/components/Action/ActionChoose.tsx
+++ b/src/components/Action/ActionChoose.tsx
@@ -2,6 +2,8 @@ import React, { useState } from 'react'
import { Ecogesture, UserChallenge } from 'models'
import ActionBegin from 'components/Action/ActionBegin'
import ActionList from 'components/Action/ActionList'
+import './actionChoose.scss'
+
interface ActionChooseProps {
userChallenge: UserChallenge
}
diff --git a/src/components/Action/actionBegin.scss b/src/components/Action/actionBegin.scss
index 7548ee19c779011fc63f6acec0b088af174025f0..7f22e91b58a302c20e7c0d932d01aeebdc9d81a5 100644
--- a/src/components/Action/actionBegin.scss
+++ b/src/components/Action/actionBegin.scss
@@ -6,6 +6,8 @@
flex-direction: column;
justify-content: center;
align-items: center;
+ margin: auto;
+ padding: 1.5rem;
}
.action-begin-container {
display: flex;
@@ -13,7 +15,6 @@
align-items: center;
justify-content: space-around;
box-sizing: border-box;
- margin: 8rem 1.5rem auto;
box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);
border-radius: 4px;
transition: all 300ms ease;
diff --git a/src/components/Action/actionChoose.scss b/src/components/Action/actionChoose.scss
new file mode 100644
index 0000000000000000000000000000000000000000..380667b4d295a202f77b38a17a77a908910ec05b
--- /dev/null
+++ b/src/components/Action/actionChoose.scss
@@ -0,0 +1,3 @@
+.action-choose {
+ margin: auto;
+}
diff --git a/src/components/Challenge/challengeView.scss b/src/components/Challenge/challengeView.scss
index 54f3d7438599531f9a22b568f24d9fb5830d0a02..694fcbcad650b5d18b0279daf8a3148b0098b995 100644
--- a/src/components/Challenge/challengeView.scss
+++ b/src/components/Challenge/challengeView.scss
@@ -5,14 +5,12 @@
.challengeSlider {
position: relative;
- min-height: inherit;
user-select: none;
display: flex;
+ flex: 1;
flex-direction: column;
align-items: center;
- flex: 1;
padding: 0 2rem;
- margin: 1rem auto;
}
.challenge-container {
position: relative;
diff --git a/src/components/Connection/SGEConnect/SgeConnect.scss b/src/components/Connection/SGEConnect/SgeConnect.scss
index 1a2d9a29ff2ace0b5ee51be74a21d3c837605e80..eac53f570ecf9178c52e45ffb7f0d35a8316857d 100644
--- a/src/components/Connection/SGEConnect/SgeConnect.scss
+++ b/src/components/Connection/SGEConnect/SgeConnect.scss
@@ -1,69 +1,77 @@
@import 'src/styles/base/color';
@import 'src/styles/base/mixins';
+
.sge-view {
box-sizing: border-box;
min-height: inherit;
width: inherit;
- padding: 1rem;
- padding-bottom: 4rem;
- .sge-step-container {
- color: $grey-bright;
- .title,
- .head {
- margin-top: 1.5rem;
- }
- label {
- display: block;
- margin-top: 1rem;
- margin-bottom: 0.625rem;
- cursor: pointer;
- span span {
- color: $gold-shadow;
- }
- }
- #zipCode {
- max-width: 115px;
- }
- @include checkBox();
- input:not([type='checkbox']) {
- appearance: none;
- max-width: 280px;
- width: 100%;
- height: 45px;
- border-radius: 4px;
- border: 1px solid $grey-dark;
- background: rgba(0, 0, 0, 0.3);
- transition: all 300ms ease;
+ display: flex;
+ flex: 1;
+ flex-direction: column;
+ justify-content: space-between;
+ .sge-container {
+ padding: 1rem;
+
+ .sge-step-container {
color: $grey-bright;
- padding: 0 0.5rem;
- &:focus,
- &:focus-visible {
- outline: 1px solid $gold-shadow;
+ .title,
+ .head {
+ margin-top: 1.5rem;
}
- }
- /* Chrome, Safari, Edge, Opera */
- input::-webkit-outer-spin-button,
- input::-webkit-inner-spin-button {
- -webkit-appearance: none;
- margin: 0;
- }
- /* Firefox */
- input[type='number'] {
- -moz-appearance: textfield;
- }
- .pdl-hint {
- cursor: pointer;
- border-bottom: solid 1px $grey-bright;
- text-align: center;
- margin: 1rem auto;
- padding: 0.2rem;
- width: 175px;
- }
- ul {
- padding: 0 1rem;
- line-height: 130%;
- li {
- margin: 0.5rem 0;
+ label {
+ display: block;
+ margin-top: 1rem;
+ margin-bottom: 0.625rem;
+ cursor: pointer;
+ span span {
+ color: $gold-shadow;
+ }
+ }
+ #zipCode {
+ max-width: 115px;
+ }
+ @include checkBox();
+ input:not([type='checkbox']) {
+ appearance: none;
+ max-width: 280px;
+ width: 100%;
+ height: 45px;
+ border-radius: 4px;
+ border: 1px solid $grey-dark;
+ background: rgba(0, 0, 0, 0.3);
+ transition: all 300ms ease;
+ color: $grey-bright;
+ padding: 0 0.5rem;
+ &:focus,
+ &:focus-visible {
+ outline: 1px solid $gold-shadow;
+ }
+ }
+ /* Chrome, Safari, Edge, Opera */
+ input::-webkit-outer-spin-button,
+ input::-webkit-inner-spin-button {
+ -webkit-appearance: none;
+ margin: 0;
+ }
+ /* Firefox */
+ input[type='number'] {
+ -moz-appearance: textfield;
+ }
+ .pdl-hint {
+ cursor: pointer;
+ border-bottom: solid 1px $grey-bright;
+ text-align: center;
+ margin: 1rem auto;
+ padding: 0.2rem;
+ width: 175px;
+ }
+ ul {
+ padding: 0 1rem 1rem;
+ line-height: 130%;
+ border-bottom: 1px solid $grey-dark;
+ li {
+ margin: 0.5rem 0;
+ }
}
}
}
diff --git a/src/components/Connection/SGEConnect/SgeConnectView.tsx b/src/components/Connection/SGEConnect/SgeConnectView.tsx
index 3ca4f7369a30dffde112dee2b36a7b64592cfca3..0997681185bdede2cdc3dd98f053a3a2d2ff279f 100644
--- a/src/components/Connection/SGEConnect/SgeConnectView.tsx
+++ b/src/components/Connection/SGEConnect/SgeConnectView.tsx
@@ -125,8 +125,10 @@ const SgeConnectView: React.FC = () => {
></Header>
<Content height={headerHeight}>
<div className="sge-view">
- <FormProgress step={currentStep} formType={'sge'} />
- {renderStep(currentStep)}
+ <div className="sge-container">
+ <FormProgress step={currentStep} formType={'sge'} />
+ {renderStep(currentStep)}
+ </div>
<FormNavigation
step={currentStep}
handlePrevious={handlePrev}
diff --git a/src/components/Connection/SGEConnect/StepConsent.tsx b/src/components/Connection/SGEConnect/StepConsent.tsx
index 198e33268c04ae69cf49e66515da8ed93730ad54..53c09677e9f12f52c421d59aa9793266103416dc 100644
--- a/src/components/Connection/SGEConnect/StepConsent.tsx
+++ b/src/components/Connection/SGEConnect/StepConsent.tsx
@@ -28,7 +28,6 @@ const StepConsent: React.FC<StepConsentProps> = ({
<li>{t('auth.enedissgegrandlyon.consentLi3')}</li>
<li>{t('auth.enedissgegrandlyon.consentLi4')}</li>
</ul>
- <hr />
<label
className={classNames('checkbox', {
['answer-checked']: sgeState.dataConsent,
diff --git a/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap b/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap
index 1aa26c6a5c185ed36a3f4852e907a444658e193b..547f2248cc2817e52a3d4d25d25c1f665ae3709d 100644
--- a/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap
+++ b/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap
@@ -625,465 +625,469 @@ exports[`SgeConnectView component should be rendered correctly 1`] = `
<div
className="sge-view"
>
- <mock-formprogress
- formType="sge"
- step={0}
- />
- <StepIdentityAndPdl
- onChange={[Function]}
- sgeState={
- Object {
- "address": "",
- "city": "",
- "currentStep": 0,
- "dataConsent": false,
- "firstName": "",
- "lastName": "",
- "pdl": null,
- "pdlConfirm": false,
- "shouldLaunchAccount": false,
- "zipCode": null,
- }
- }
+ <div
+ className="sge-container"
>
- <div
- className="sge-step-container stepIdentity"
+ <mock-formprogress
+ formType="sge"
+ step={0}
+ />
+ <StepIdentityAndPdl
+ onChange={[Function]}
+ sgeState={
+ Object {
+ "address": "",
+ "city": "",
+ "currentStep": 0,
+ "dataConsent": false,
+ "firstName": "",
+ "lastName": "",
+ "pdl": null,
+ "pdlConfirm": false,
+ "shouldLaunchAccount": false,
+ "zipCode": null,
+ }
+ }
>
<div
- className="title text-22-bold"
- >
- auth.enedissgegrandlyon.identityTitle
- </div>
- <label
- className="text-16-normal"
- htmlFor="firstName"
- >
- auth.enedissgegrandlyon.firstName
- </label>
- <input
- id="firstName"
- name="firstName"
- onChange={[Function]}
- required={true}
- type="text"
- value=""
- />
- <label
- className="text-16-normal"
- htmlFor="lastName"
- >
- auth.enedissgegrandlyon.lastName
- </label>
- <input
- id="lastName"
- name="lastName"
- onChange={[Function]}
- required={true}
- type="text"
- value=""
- />
- <div
- className="title text-22-bold"
- >
- auth.enedissgegrandlyon.pdlTitle
- </div>
- <label
- className="text-16-normal"
- htmlFor="pdl"
- >
- auth.enedissgegrandlyon.pdlLabel
- </label>
- <input
- id="pdl"
- inputMode="numeric"
- min={0}
- name="pdl"
- onChange={[Function]}
- required={true}
- type="number"
- />
- <div
- className="pdl-hint text-16-normal"
- onClick={[Function]}
+ className="sge-step-container stepIdentity"
>
- auth.enedissgegrandlyon.pdlHint
- </div>
- <SgeModalHint
- handleCloseClick={[Function]}
- open={false}
- >
- <WithStyles(ForwardRef(Dialog))
- aria-labelledby="accessibility-title"
- classes={
- Object {
- "paper": "modal-paper",
- "root": "modal-root",
- }
- }
- disableEscapeKeyDown={true}
- onClose={[Function]}
+ <div
+ className="title text-22-bold"
+ >
+ auth.enedissgegrandlyon.identityTitle
+ </div>
+ <label
+ className="text-16-normal"
+ htmlFor="firstName"
+ >
+ auth.enedissgegrandlyon.firstName
+ </label>
+ <input
+ id="firstName"
+ name="firstName"
+ onChange={[Function]}
+ required={true}
+ type="text"
+ value=""
+ />
+ <label
+ className="text-16-normal"
+ htmlFor="lastName"
+ >
+ auth.enedissgegrandlyon.lastName
+ </label>
+ <input
+ id="lastName"
+ name="lastName"
+ onChange={[Function]}
+ required={true}
+ type="text"
+ value=""
+ />
+ <div
+ className="title text-22-bold"
+ >
+ auth.enedissgegrandlyon.pdlTitle
+ </div>
+ <label
+ className="text-16-normal"
+ htmlFor="pdl"
+ >
+ auth.enedissgegrandlyon.pdlLabel
+ </label>
+ <input
+ id="pdl"
+ inputMode="numeric"
+ min={0}
+ name="pdl"
+ onChange={[Function]}
+ required={true}
+ type="number"
+ />
+ <div
+ className="pdl-hint text-16-normal"
+ onClick={[Function]}
+ >
+ auth.enedissgegrandlyon.pdlHint
+ </div>
+ <SgeModalHint
+ handleCloseClick={[Function]}
open={false}
>
- <ForwardRef(Dialog)
+ <WithStyles(ForwardRef(Dialog))
aria-labelledby="accessibility-title"
classes={
Object {
- "container": "MuiDialog-container",
- "paper": "MuiDialog-paper modal-paper",
- "paperFullScreen": "MuiDialog-paperFullScreen",
- "paperFullWidth": "MuiDialog-paperFullWidth",
- "paperScrollBody": "MuiDialog-paperScrollBody",
- "paperScrollPaper": "MuiDialog-paperScrollPaper",
- "paperWidthFalse": "MuiDialog-paperWidthFalse",
- "paperWidthLg": "MuiDialog-paperWidthLg",
- "paperWidthMd": "MuiDialog-paperWidthMd",
- "paperWidthSm": "MuiDialog-paperWidthSm",
- "paperWidthXl": "MuiDialog-paperWidthXl",
- "paperWidthXs": "MuiDialog-paperWidthXs",
- "root": "MuiDialog-root modal-root",
- "scrollBody": "MuiDialog-scrollBody",
- "scrollPaper": "MuiDialog-scrollPaper",
+ "paper": "modal-paper",
+ "root": "modal-root",
}
}
disableEscapeKeyDown={true}
onClose={[Function]}
open={false}
>
- <ForwardRef(Modal)
- BackdropComponent={
+ <ForwardRef(Dialog)
+ aria-labelledby="accessibility-title"
+ classes={
Object {
- "$$typeof": Symbol(react.forward_ref),
- "Naked": Object {
+ "container": "MuiDialog-container",
+ "paper": "MuiDialog-paper modal-paper",
+ "paperFullScreen": "MuiDialog-paperFullScreen",
+ "paperFullWidth": "MuiDialog-paperFullWidth",
+ "paperScrollBody": "MuiDialog-paperScrollBody",
+ "paperScrollPaper": "MuiDialog-paperScrollPaper",
+ "paperWidthFalse": "MuiDialog-paperWidthFalse",
+ "paperWidthLg": "MuiDialog-paperWidthLg",
+ "paperWidthMd": "MuiDialog-paperWidthMd",
+ "paperWidthSm": "MuiDialog-paperWidthSm",
+ "paperWidthXl": "MuiDialog-paperWidthXl",
+ "paperWidthXs": "MuiDialog-paperWidthXs",
+ "root": "MuiDialog-root modal-root",
+ "scrollBody": "MuiDialog-scrollBody",
+ "scrollPaper": "MuiDialog-scrollPaper",
+ }
+ }
+ disableEscapeKeyDown={true}
+ onClose={[Function]}
+ open={false}
+ >
+ <ForwardRef(Modal)
+ BackdropComponent={
+ Object {
"$$typeof": Symbol(react.forward_ref),
- "propTypes": Object {
- "children": [Function],
- "className": [Function],
- "classes": [Function],
- "invisible": [Function],
- "open": [Function],
- "transitionDuration": [Function],
- },
- "render": [Function],
- },
- "displayName": "WithStyles(ForwardRef(Backdrop))",
- "options": Object {
- "defaultTheme": Object {
- "breakpoints": Object {
- "between": [Function],
- "down": [Function],
- "keys": Array [
- "xs",
- "sm",
- "md",
- "lg",
- "xl",
- ],
- "only": [Function],
- "up": [Function],
- "values": Object {
- "lg": 1280,
- "md": 960,
- "sm": 600,
- "xl": 1920,
- "xs": 0,
- },
- "width": [Function],
+ "Naked": Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "propTypes": Object {
+ "children": [Function],
+ "className": [Function],
+ "classes": [Function],
+ "invisible": [Function],
+ "open": [Function],
+ "transitionDuration": [Function],
},
- "direction": "ltr",
- "mixins": Object {
- "gutters": [Function],
- "toolbar": Object {
- "@media (min-width:0px) and (orientation: landscape)": Object {
- "minHeight": 48,
- },
- "@media (min-width:600px)": Object {
- "minHeight": 64,
+ "render": [Function],
+ },
+ "displayName": "WithStyles(ForwardRef(Backdrop))",
+ "options": Object {
+ "defaultTheme": Object {
+ "breakpoints": Object {
+ "between": [Function],
+ "down": [Function],
+ "keys": Array [
+ "xs",
+ "sm",
+ "md",
+ "lg",
+ "xl",
+ ],
+ "only": [Function],
+ "up": [Function],
+ "values": Object {
+ "lg": 1280,
+ "md": 960,
+ "sm": 600,
+ "xl": 1920,
+ "xs": 0,
},
- "minHeight": 56,
- },
- },
- "overrides": Object {},
- "palette": Object {
- "action": Object {
- "activatedOpacity": 0.12,
- "active": "rgba(0, 0, 0, 0.54)",
- "disabled": "rgba(0, 0, 0, 0.26)",
- "disabledBackground": "rgba(0, 0, 0, 0.12)",
- "disabledOpacity": 0.38,
- "focus": "rgba(0, 0, 0, 0.12)",
- "focusOpacity": 0.12,
- "hover": "rgba(0, 0, 0, 0.04)",
- "hoverOpacity": 0.04,
- "selected": "rgba(0, 0, 0, 0.08)",
- "selectedOpacity": 0.08,
- },
- "augmentColor": [Function],
- "background": Object {
- "default": "#fafafa",
- "paper": "#fff",
- },
- "common": Object {
- "black": "#000",
- "white": "#fff",
- },
- "contrastThreshold": 3,
- "divider": "rgba(0, 0, 0, 0.12)",
- "error": Object {
- "contrastText": "#fff",
- "dark": "#d32f2f",
- "light": "#e57373",
- "main": "#f44336",
- },
- "getContrastText": [Function],
- "grey": Object {
- "100": "#f5f5f5",
- "200": "#eeeeee",
- "300": "#e0e0e0",
- "400": "#bdbdbd",
- "50": "#fafafa",
- "500": "#9e9e9e",
- "600": "#757575",
- "700": "#616161",
- "800": "#424242",
- "900": "#212121",
- "A100": "#d5d5d5",
- "A200": "#aaaaaa",
- "A400": "#303030",
- "A700": "#616161",
- },
- "info": Object {
- "contrastText": "#fff",
- "dark": "#1976d2",
- "light": "#64b5f6",
- "main": "#2196f3",
- },
- "primary": Object {
- "contrastText": "#fff",
- "dark": "#303f9f",
- "light": "#7986cb",
- "main": "#3f51b5",
- },
- "secondary": Object {
- "contrastText": "#fff",
- "dark": "#c51162",
- "light": "#ff4081",
- "main": "#f50057",
- },
- "success": Object {
- "contrastText": "rgba(0, 0, 0, 0.87)",
- "dark": "#388e3c",
- "light": "#81c784",
- "main": "#4caf50",
- },
- "text": Object {
- "disabled": "rgba(0, 0, 0, 0.38)",
- "hint": "rgba(0, 0, 0, 0.38)",
- "primary": "rgba(0, 0, 0, 0.87)",
- "secondary": "rgba(0, 0, 0, 0.54)",
- },
- "tonalOffset": 0.2,
- "type": "light",
- "warning": Object {
- "contrastText": "rgba(0, 0, 0, 0.87)",
- "dark": "#f57c00",
- "light": "#ffb74d",
- "main": "#ff9800",
- },
- },
- "props": Object {},
- "shadows": Array [
- "none",
- "0px 2px 1px -1px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 1px 3px 0px rgba(0,0,0,0.12)",
- "0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)",
- "0px 3px 3px -2px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 1px 8px 0px rgba(0,0,0,0.12)",
- "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
- "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
- "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
- "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
- "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
- "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
- "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
- "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
- "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
- "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
- "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
- "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
- "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
- "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
- "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
- "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
- "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
- "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
- "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
- "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
- "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
- ],
- "shape": Object {
- "borderRadius": 4,
- },
- "spacing": [Function],
- "transitions": Object {
- "create": [Function],
- "duration": Object {
- "complex": 375,
- "enteringScreen": 225,
- "leavingScreen": 195,
- "short": 250,
- "shorter": 200,
- "shortest": 150,
- "standard": 300,
+ "width": [Function],
},
- "easing": Object {
- "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
- "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
- "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
- "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
- },
- "getAutoHeightDuration": [Function],
- },
- "typography": Object {
- "body1": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "1rem",
- "fontWeight": 400,
- "letterSpacing": "0.00938em",
- "lineHeight": 1.5,
- },
- "body2": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "0.875rem",
- "fontWeight": 400,
- "letterSpacing": "0.01071em",
- "lineHeight": 1.43,
- },
- "button": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "0.875rem",
- "fontWeight": 500,
- "letterSpacing": "0.02857em",
- "lineHeight": 1.75,
- "textTransform": "uppercase",
- },
- "caption": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "0.75rem",
- "fontWeight": 400,
- "letterSpacing": "0.03333em",
- "lineHeight": 1.66,
- },
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": 14,
- "fontWeightBold": 700,
- "fontWeightLight": 300,
- "fontWeightMedium": 500,
- "fontWeightRegular": 400,
- "h1": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "6rem",
- "fontWeight": 300,
- "letterSpacing": "-0.01562em",
- "lineHeight": 1.167,
- },
- "h2": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "3.75rem",
- "fontWeight": 300,
- "letterSpacing": "-0.00833em",
- "lineHeight": 1.2,
- },
- "h3": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "3rem",
- "fontWeight": 400,
- "letterSpacing": "0em",
- "lineHeight": 1.167,
- },
- "h4": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "2.125rem",
- "fontWeight": 400,
- "letterSpacing": "0.00735em",
- "lineHeight": 1.235,
+ "direction": "ltr",
+ "mixins": Object {
+ "gutters": [Function],
+ "toolbar": Object {
+ "@media (min-width:0px) and (orientation: landscape)": Object {
+ "minHeight": 48,
+ },
+ "@media (min-width:600px)": Object {
+ "minHeight": 64,
+ },
+ "minHeight": 56,
+ },
},
- "h5": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "1.5rem",
- "fontWeight": 400,
- "letterSpacing": "0em",
- "lineHeight": 1.334,
+ "overrides": Object {},
+ "palette": Object {
+ "action": Object {
+ "activatedOpacity": 0.12,
+ "active": "rgba(0, 0, 0, 0.54)",
+ "disabled": "rgba(0, 0, 0, 0.26)",
+ "disabledBackground": "rgba(0, 0, 0, 0.12)",
+ "disabledOpacity": 0.38,
+ "focus": "rgba(0, 0, 0, 0.12)",
+ "focusOpacity": 0.12,
+ "hover": "rgba(0, 0, 0, 0.04)",
+ "hoverOpacity": 0.04,
+ "selected": "rgba(0, 0, 0, 0.08)",
+ "selectedOpacity": 0.08,
+ },
+ "augmentColor": [Function],
+ "background": Object {
+ "default": "#fafafa",
+ "paper": "#fff",
+ },
+ "common": Object {
+ "black": "#000",
+ "white": "#fff",
+ },
+ "contrastThreshold": 3,
+ "divider": "rgba(0, 0, 0, 0.12)",
+ "error": Object {
+ "contrastText": "#fff",
+ "dark": "#d32f2f",
+ "light": "#e57373",
+ "main": "#f44336",
+ },
+ "getContrastText": [Function],
+ "grey": Object {
+ "100": "#f5f5f5",
+ "200": "#eeeeee",
+ "300": "#e0e0e0",
+ "400": "#bdbdbd",
+ "50": "#fafafa",
+ "500": "#9e9e9e",
+ "600": "#757575",
+ "700": "#616161",
+ "800": "#424242",
+ "900": "#212121",
+ "A100": "#d5d5d5",
+ "A200": "#aaaaaa",
+ "A400": "#303030",
+ "A700": "#616161",
+ },
+ "info": Object {
+ "contrastText": "#fff",
+ "dark": "#1976d2",
+ "light": "#64b5f6",
+ "main": "#2196f3",
+ },
+ "primary": Object {
+ "contrastText": "#fff",
+ "dark": "#303f9f",
+ "light": "#7986cb",
+ "main": "#3f51b5",
+ },
+ "secondary": Object {
+ "contrastText": "#fff",
+ "dark": "#c51162",
+ "light": "#ff4081",
+ "main": "#f50057",
+ },
+ "success": Object {
+ "contrastText": "rgba(0, 0, 0, 0.87)",
+ "dark": "#388e3c",
+ "light": "#81c784",
+ "main": "#4caf50",
+ },
+ "text": Object {
+ "disabled": "rgba(0, 0, 0, 0.38)",
+ "hint": "rgba(0, 0, 0, 0.38)",
+ "primary": "rgba(0, 0, 0, 0.87)",
+ "secondary": "rgba(0, 0, 0, 0.54)",
+ },
+ "tonalOffset": 0.2,
+ "type": "light",
+ "warning": Object {
+ "contrastText": "rgba(0, 0, 0, 0.87)",
+ "dark": "#f57c00",
+ "light": "#ffb74d",
+ "main": "#ff9800",
+ },
},
- "h6": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "1.25rem",
- "fontWeight": 500,
- "letterSpacing": "0.0075em",
- "lineHeight": 1.6,
+ "props": Object {},
+ "shadows": Array [
+ "none",
+ "0px 2px 1px -1px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 1px 3px 0px rgba(0,0,0,0.12)",
+ "0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)",
+ "0px 3px 3px -2px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 1px 8px 0px rgba(0,0,0,0.12)",
+ "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+ "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+ "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+ "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+ "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+ "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+ "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+ "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+ "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+ "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+ "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+ "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+ "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+ "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+ "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+ "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+ "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+ "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+ "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+ "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+ "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+ ],
+ "shape": Object {
+ "borderRadius": 4,
},
- "htmlFontSize": 16,
- "overline": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "0.75rem",
- "fontWeight": 400,
- "letterSpacing": "0.08333em",
- "lineHeight": 2.66,
- "textTransform": "uppercase",
+ "spacing": [Function],
+ "transitions": Object {
+ "create": [Function],
+ "duration": Object {
+ "complex": 375,
+ "enteringScreen": 225,
+ "leavingScreen": 195,
+ "short": 250,
+ "shorter": 200,
+ "shortest": 150,
+ "standard": 300,
+ },
+ "easing": Object {
+ "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+ "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+ "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+ "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+ },
+ "getAutoHeightDuration": [Function],
},
- "pxToRem": [Function],
- "round": [Function],
- "subtitle1": Object {
+ "typography": Object {
+ "body1": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.00938em",
+ "lineHeight": 1.5,
+ },
+ "body2": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.875rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.01071em",
+ "lineHeight": 1.43,
+ },
+ "button": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.875rem",
+ "fontWeight": 500,
+ "letterSpacing": "0.02857em",
+ "lineHeight": 1.75,
+ "textTransform": "uppercase",
+ },
+ "caption": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.75rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.03333em",
+ "lineHeight": 1.66,
+ },
"fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "1rem",
- "fontWeight": 400,
- "letterSpacing": "0.00938em",
- "lineHeight": 1.75,
+ "fontSize": 14,
+ "fontWeightBold": 700,
+ "fontWeightLight": 300,
+ "fontWeightMedium": 500,
+ "fontWeightRegular": 400,
+ "h1": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "6rem",
+ "fontWeight": 300,
+ "letterSpacing": "-0.01562em",
+ "lineHeight": 1.167,
+ },
+ "h2": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "3.75rem",
+ "fontWeight": 300,
+ "letterSpacing": "-0.00833em",
+ "lineHeight": 1.2,
+ },
+ "h3": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "3rem",
+ "fontWeight": 400,
+ "letterSpacing": "0em",
+ "lineHeight": 1.167,
+ },
+ "h4": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "2.125rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.00735em",
+ "lineHeight": 1.235,
+ },
+ "h5": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1.5rem",
+ "fontWeight": 400,
+ "letterSpacing": "0em",
+ "lineHeight": 1.334,
+ },
+ "h6": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1.25rem",
+ "fontWeight": 500,
+ "letterSpacing": "0.0075em",
+ "lineHeight": 1.6,
+ },
+ "htmlFontSize": 16,
+ "overline": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.75rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.08333em",
+ "lineHeight": 2.66,
+ "textTransform": "uppercase",
+ },
+ "pxToRem": [Function],
+ "round": [Function],
+ "subtitle1": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.00938em",
+ "lineHeight": 1.75,
+ },
+ "subtitle2": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.875rem",
+ "fontWeight": 500,
+ "letterSpacing": "0.00714em",
+ "lineHeight": 1.57,
+ },
},
- "subtitle2": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "0.875rem",
- "fontWeight": 500,
- "letterSpacing": "0.00714em",
- "lineHeight": 1.57,
+ "zIndex": Object {
+ "appBar": 1100,
+ "drawer": 1200,
+ "mobileStepper": 1000,
+ "modal": 1300,
+ "snackbar": 1400,
+ "speedDial": 1050,
+ "tooltip": 1500,
},
},
- "zIndex": Object {
- "appBar": 1100,
- "drawer": 1200,
- "mobileStepper": 1000,
- "modal": 1300,
- "snackbar": 1400,
- "speedDial": 1050,
- "tooltip": 1500,
- },
+ "name": "MuiBackdrop",
},
- "name": "MuiBackdrop",
- },
- "propTypes": Object {
- "classes": [Function],
- "innerRef": [Function],
- },
- "render": [Function],
- "useStyles": [Function],
+ "propTypes": Object {
+ "classes": [Function],
+ "innerRef": [Function],
+ },
+ "render": [Function],
+ "useStyles": [Function],
+ }
}
- }
- BackdropProps={
- Object {
- "transitionDuration": Object {
- "enter": 225,
- "exit": 195,
- },
+ BackdropProps={
+ Object {
+ "transitionDuration": Object {
+ "enter": 225,
+ "exit": 195,
+ },
+ }
}
- }
- className="MuiDialog-root modal-root"
- closeAfterTransition={true}
- disableEscapeKeyDown={true}
- onClose={[Function]}
- open={false}
- />
- </ForwardRef(Dialog)>
- </WithStyles(ForwardRef(Dialog))>
- </SgeModalHint>
- </div>
- </StepIdentityAndPdl>
+ className="MuiDialog-root modal-root"
+ closeAfterTransition={true}
+ disableEscapeKeyDown={true}
+ onClose={[Function]}
+ open={false}
+ />
+ </ForwardRef(Dialog)>
+ </WithStyles(ForwardRef(Dialog))>
+ </SgeModalHint>
+ </div>
+ </StepIdentityAndPdl>
+ </div>
<FormNavigation
disableNextButton={true}
handleNext={[Function]}
diff --git a/src/components/Connection/SGEConnect/__snapshots__/StepConsent.spec.tsx.snap b/src/components/Connection/SGEConnect/__snapshots__/StepConsent.spec.tsx.snap
index ae2a3ae75c32bc99b19d0150bf843cd930829f14..f5fd68d492c79666b431eae5ce7719273b7005d1 100644
--- a/src/components/Connection/SGEConnect/__snapshots__/StepConsent.spec.tsx.snap
+++ b/src/components/Connection/SGEConnect/__snapshots__/StepConsent.spec.tsx.snap
@@ -59,7 +59,6 @@ exports[`StepConsent component should be rendered correctly 1`] = `
auth.enedissgegrandlyon.consentLi4
</li>
</ul>
- <hr />
<label
className="checkbox"
>
diff --git a/src/components/EcogestureForm/EcogestureFormEquipment.tsx b/src/components/EcogestureForm/EcogestureFormEquipment.tsx
index cd3fc09d24825af786ef22bb48ec32c6d4a340e4..4a53fc968dc8c6648572fdeaaa0ab3430a9ac219 100644
--- a/src/components/EcogestureForm/EcogestureFormEquipment.tsx
+++ b/src/components/EcogestureForm/EcogestureFormEquipment.tsx
@@ -83,43 +83,45 @@ const EcogestureFormEquipment: React.FC<EcogestureFormEquipmentProps> = ({
)
return (
- <div className="ecogesture-profile-container">
- <div className={'equipment-form-container'}>
- <div className={'equipment-label text-22-normal'}>
- {t(
- `ecogesture_profile.${EcogestureStepForm[
- EcogestureStepForm.EQUIPMENTS
- ].toLowerCase()}.question`
- )}
- </div>
- <div className={'equipment-hint text-16-normal'}>
- {t(
- `ecogesture_profile.${EcogestureStepForm[
- EcogestureStepForm.EQUIPMENTS
- ].toLowerCase()}.hint`
- )}
- </div>
- <div className="icons-container">
- {Object.values(EquipmentType).map((equipment, index) => {
- return (
- <label key={index} className={'checkbox-equipment'}>
- <input
- type={'checkbox'}
- value={equipment}
- name={equipment.toString()}
- onChange={() => handleChange(equipment)}
- checked={isChecked(equipment)}
- className={
- isChecked(equipment) ? 'item-eq checked' : 'item-eq'
- }
- />
- <EquipmentIcon
- equipment={equipment}
- isChecked={answer.includes(equipment)}
- />
- </label>
- )
- })}
+ <>
+ <div className="ecogesture-profile-container">
+ <div className={'equipment-form-container'}>
+ <div className={'equipment-label text-22-normal'}>
+ {t(
+ `ecogesture_profile.${EcogestureStepForm[
+ EcogestureStepForm.EQUIPMENTS
+ ].toLowerCase()}.question`
+ )}
+ </div>
+ <div className={'equipment-hint text-16-normal'}>
+ {t(
+ `ecogesture_profile.${EcogestureStepForm[
+ EcogestureStepForm.EQUIPMENTS
+ ].toLowerCase()}.hint`
+ )}
+ </div>
+ <div className="icons-container">
+ {Object.values(EquipmentType).map((equipment, index) => {
+ return (
+ <label key={index} className={'checkbox-equipment'}>
+ <input
+ type={'checkbox'}
+ value={equipment}
+ name={equipment.toString()}
+ onChange={() => handleChange(equipment)}
+ checked={isChecked(equipment)}
+ className={
+ isChecked(equipment) ? 'item-eq checked' : 'item-eq'
+ }
+ />
+ <EquipmentIcon
+ equipment={equipment}
+ isChecked={answer.includes(equipment)}
+ />
+ </label>
+ )
+ })}
+ </div>
</div>
</div>
<FormNavigation
@@ -129,7 +131,7 @@ const EcogestureFormEquipment: React.FC<EcogestureFormEquipmentProps> = ({
disableNextButton={answer === []}
isEcogesture={true}
/>
- </div>
+ </>
)
}
diff --git a/src/components/EcogestureForm/__snapshots__/EcogestureFormEquipment.spec.tsx.snap b/src/components/EcogestureForm/__snapshots__/EcogestureFormEquipment.spec.tsx.snap
index a08a4156645b4c4ccfa291c711dcb5b4602a0e3b..ddc81916dc8bfdab84df561049c7ef8387b9ccf8 100644
--- a/src/components/EcogestureForm/__snapshots__/EcogestureFormEquipment.spec.tsx.snap
+++ b/src/components/EcogestureForm/__snapshots__/EcogestureFormEquipment.spec.tsx.snap
@@ -302,70 +302,88 @@ exports[`EcogestureFormEquipment component should be rendered correctly 1`] = `
</label>
</div>
</div>
- <FormNavigation
- disableNextButton={false}
- handleNext={[Function]}
- handlePrevious={[Function]}
- isEcogesture={true}
- step={0}
+ </div>
+ <FormNavigation
+ disableNextButton={false}
+ handleNext={[Function]}
+ handlePrevious={[Function]}
+ isEcogesture={true}
+ step={0}
+ >
+ <div
+ className="profile-navigation"
>
- <div
- className="profile-navigation"
+ <WithStyles(ForwardRef(Button))
+ aria-label="profile_type.accessibility.button_previous"
+ className="profile-navigation-button"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-profile-back",
+ }
+ }
+ disabled={true}
+ onClick={[Function]}
>
- <WithStyles(ForwardRef(Button))
+ <ForwardRef(Button)
aria-label="profile_type.accessibility.button_previous"
className="profile-navigation-button"
classes={
Object {
- "label": "text-16-bold",
- "root": "btn-profile-back",
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-profile-back",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
}
}
disabled={true}
onClick={[Function]}
>
- <ForwardRef(Button)
+ <WithStyles(ForwardRef(ButtonBase))
aria-label="profile_type.accessibility.button_previous"
- className="profile-navigation-button"
- classes={
- Object {
- "colorInherit": "MuiButton-colorInherit",
- "contained": "MuiButton-contained",
- "containedPrimary": "MuiButton-containedPrimary",
- "containedSecondary": "MuiButton-containedSecondary",
- "containedSizeLarge": "MuiButton-containedSizeLarge",
- "containedSizeSmall": "MuiButton-containedSizeSmall",
- "disableElevation": "MuiButton-disableElevation",
- "disabled": "Mui-disabled",
- "endIcon": "MuiButton-endIcon",
- "focusVisible": "Mui-focusVisible",
- "fullWidth": "MuiButton-fullWidth",
- "iconSizeLarge": "MuiButton-iconSizeLarge",
- "iconSizeMedium": "MuiButton-iconSizeMedium",
- "iconSizeSmall": "MuiButton-iconSizeSmall",
- "label": "MuiButton-label text-16-bold",
- "outlined": "MuiButton-outlined",
- "outlinedPrimary": "MuiButton-outlinedPrimary",
- "outlinedSecondary": "MuiButton-outlinedSecondary",
- "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
- "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
- "root": "MuiButton-root btn-profile-back",
- "sizeLarge": "MuiButton-sizeLarge",
- "sizeSmall": "MuiButton-sizeSmall",
- "startIcon": "MuiButton-startIcon",
- "text": "MuiButton-text",
- "textPrimary": "MuiButton-textPrimary",
- "textSecondary": "MuiButton-textSecondary",
- "textSizeLarge": "MuiButton-textSizeLarge",
- "textSizeSmall": "MuiButton-textSizeSmall",
- }
- }
+ className="MuiButton-root btn-profile-back MuiButton-text profile-navigation-button Mui-disabled"
+ component="button"
disabled={true}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
onClick={[Function]}
+ type="button"
>
- <WithStyles(ForwardRef(ButtonBase))
+ <ForwardRef(ButtonBase)
aria-label="profile_type.accessibility.button_previous"
className="MuiButton-root btn-profile-back MuiButton-text profile-navigation-button Mui-disabled"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
component="button"
disabled={true}
focusRipple={true}
@@ -373,106 +391,106 @@ exports[`EcogestureFormEquipment component should be rendered correctly 1`] = `
onClick={[Function]}
type="button"
>
- <ForwardRef(ButtonBase)
+ <button
aria-label="profile_type.accessibility.button_previous"
- className="MuiButton-root btn-profile-back MuiButton-text profile-navigation-button Mui-disabled"
- classes={
- Object {
- "disabled": "Mui-disabled",
- "focusVisible": "Mui-focusVisible",
- "root": "MuiButtonBase-root",
- }
- }
- component="button"
+ className="MuiButtonBase-root MuiButton-root btn-profile-back MuiButton-text profile-navigation-button Mui-disabled Mui-disabled"
disabled={true}
- focusRipple={true}
- focusVisibleClassName="Mui-focusVisible"
+ onBlur={[Function]}
onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={-1}
type="button"
>
- <button
- aria-label="profile_type.accessibility.button_previous"
- className="MuiButtonBase-root MuiButton-root btn-profile-back MuiButton-text profile-navigation-button Mui-disabled Mui-disabled"
- disabled={true}
- onBlur={[Function]}
- onClick={[Function]}
- onDragLeave={[Function]}
- onFocus={[Function]}
- onKeyDown={[Function]}
- onKeyUp={[Function]}
- onMouseDown={[Function]}
- onMouseLeave={[Function]}
- onMouseUp={[Function]}
- onTouchEnd={[Function]}
- onTouchMove={[Function]}
- onTouchStart={[Function]}
- tabIndex={-1}
- type="button"
+ <span
+ className="MuiButton-label text-16-bold"
>
- <span
- className="MuiButton-label text-16-bold"
- >
- < profile_type.form.button_previous
- </span>
- </button>
- </ForwardRef(ButtonBase)>
- </WithStyles(ForwardRef(ButtonBase))>
- </ForwardRef(Button)>
- </WithStyles(ForwardRef(Button))>
- <WithStyles(ForwardRef(Button))
+ < profile_type.form.button_previous
+ </span>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ <WithStyles(ForwardRef(Button))
+ aria-label="profile_type.accessibility.button_next"
+ className="profile-navigation-button"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-profile-next",
+ }
+ }
+ disabled={false}
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
aria-label="profile_type.accessibility.button_next"
className="profile-navigation-button"
classes={
Object {
- "label": "text-16-bold",
- "root": "btn-profile-next",
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-profile-next",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
}
}
disabled={false}
onClick={[Function]}
>
- <ForwardRef(Button)
+ <WithStyles(ForwardRef(ButtonBase))
aria-label="profile_type.accessibility.button_next"
- className="profile-navigation-button"
- classes={
- Object {
- "colorInherit": "MuiButton-colorInherit",
- "contained": "MuiButton-contained",
- "containedPrimary": "MuiButton-containedPrimary",
- "containedSecondary": "MuiButton-containedSecondary",
- "containedSizeLarge": "MuiButton-containedSizeLarge",
- "containedSizeSmall": "MuiButton-containedSizeSmall",
- "disableElevation": "MuiButton-disableElevation",
- "disabled": "Mui-disabled",
- "endIcon": "MuiButton-endIcon",
- "focusVisible": "Mui-focusVisible",
- "fullWidth": "MuiButton-fullWidth",
- "iconSizeLarge": "MuiButton-iconSizeLarge",
- "iconSizeMedium": "MuiButton-iconSizeMedium",
- "iconSizeSmall": "MuiButton-iconSizeSmall",
- "label": "MuiButton-label text-16-bold",
- "outlined": "MuiButton-outlined",
- "outlinedPrimary": "MuiButton-outlinedPrimary",
- "outlinedSecondary": "MuiButton-outlinedSecondary",
- "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
- "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
- "root": "MuiButton-root btn-profile-next",
- "sizeLarge": "MuiButton-sizeLarge",
- "sizeSmall": "MuiButton-sizeSmall",
- "startIcon": "MuiButton-startIcon",
- "text": "MuiButton-text",
- "textPrimary": "MuiButton-textPrimary",
- "textSecondary": "MuiButton-textSecondary",
- "textSizeLarge": "MuiButton-textSizeLarge",
- "textSizeSmall": "MuiButton-textSizeSmall",
- }
- }
+ className="MuiButton-root btn-profile-next MuiButton-text profile-navigation-button"
+ component="button"
disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
onClick={[Function]}
+ type="button"
>
- <WithStyles(ForwardRef(ButtonBase))
+ <ForwardRef(ButtonBase)
aria-label="profile_type.accessibility.button_next"
className="MuiButton-root btn-profile-next MuiButton-text profile-navigation-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
component="button"
disabled={false}
focusRipple={true}
@@ -480,83 +498,65 @@ exports[`EcogestureFormEquipment component should be rendered correctly 1`] = `
onClick={[Function]}
type="button"
>
- <ForwardRef(ButtonBase)
+ <button
aria-label="profile_type.accessibility.button_next"
- className="MuiButton-root btn-profile-next MuiButton-text profile-navigation-button"
- classes={
- Object {
- "disabled": "Mui-disabled",
- "focusVisible": "Mui-focusVisible",
- "root": "MuiButtonBase-root",
- }
- }
- component="button"
+ className="MuiButtonBase-root MuiButton-root btn-profile-next MuiButton-text profile-navigation-button"
disabled={false}
- focusRipple={true}
- focusVisibleClassName="Mui-focusVisible"
+ onBlur={[Function]}
onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
type="button"
>
- <button
- aria-label="profile_type.accessibility.button_next"
- className="MuiButtonBase-root MuiButton-root btn-profile-next MuiButton-text profile-navigation-button"
- disabled={false}
- onBlur={[Function]}
- onClick={[Function]}
- onDragLeave={[Function]}
- onFocus={[Function]}
- onKeyDown={[Function]}
- onKeyUp={[Function]}
- onMouseDown={[Function]}
- onMouseLeave={[Function]}
- onMouseUp={[Function]}
- onTouchEnd={[Function]}
- onTouchMove={[Function]}
- onTouchStart={[Function]}
- tabIndex={0}
- type="button"
+ <span
+ className="MuiButton-label text-16-bold"
>
- <span
- className="MuiButton-label text-16-bold"
- >
- profile_type.form.button_next >
- </span>
- <WithStyles(memo)
+ profile_type.form.button_next >
+ </span>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
center={false}
- >
- <ForwardRef(TouchRipple)
- center={false}
- classes={
- Object {
- "child": "MuiTouchRipple-child",
- "childLeaving": "MuiTouchRipple-childLeaving",
- "childPulsate": "MuiTouchRipple-childPulsate",
- "ripple": "MuiTouchRipple-ripple",
- "ripplePulsate": "MuiTouchRipple-ripplePulsate",
- "rippleVisible": "MuiTouchRipple-rippleVisible",
- "root": "MuiTouchRipple-root",
- }
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
}
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
>
- <span
- className="MuiTouchRipple-root"
- >
- <TransitionGroup
- childFactory={[Function]}
- component={null}
- exit={true}
- />
- </span>
- </ForwardRef(TouchRipple)>
- </WithStyles(memo)>
- </button>
- </ForwardRef(ButtonBase)>
- </WithStyles(ForwardRef(ButtonBase))>
- </ForwardRef(Button)>
- </WithStyles(ForwardRef(Button))>
- </div>
- </FormNavigation>
- </div>
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ </div>
+ </FormNavigation>
</EcogestureFormEquipment>
</Provider>
`;
diff --git a/src/components/EcogestureForm/ecogestureFormSingleChoice.scss b/src/components/EcogestureForm/ecogestureFormSingleChoice.scss
index 48c3d4c9dc5ccd82e7a6ac81a655847e9a09550b..1afea74c1b4db91656df55458e5cc0d5a3f43880 100644
--- a/src/components/EcogestureForm/ecogestureFormSingleChoice.scss
+++ b/src/components/EcogestureForm/ecogestureFormSingleChoice.scss
@@ -2,13 +2,19 @@
@import '../../styles/base/breakpoint';
.ecogesture-profile-container {
- position: relative;
- height: 100%;
- min-height: inherit;
+ overflow-y: scroll;
display: flex;
- justify-content: center;
+ flex-direction: column;
+ flex: 1;
+ justify-content: space-between;
+
+ // 100 -header -navigation -bottom -navbar
+ height: calc(100vh - 60px - 72px - 56px);
+ @media (min-width: $width-large-phone) {
+ // 100 -cozyBar -header -navigation -bottom -navbar
+ height: calc(100vh - 48px - 148px - 72px - 0px);
+ }
.ecogesture-form-single {
- width: 100%;
max-width: 53rem;
color: $white;
margin: 1rem 1rem 3.5rem;
diff --git a/src/components/Exploration/explorationOngoing.scss b/src/components/Exploration/explorationOngoing.scss
index f533e291e45e70b4a40709cb7f6b5803fd44954f..8d6dd1ebeb78f78203b688661477f47268cc9682 100644
--- a/src/components/Exploration/explorationOngoing.scss
+++ b/src/components/Exploration/explorationOngoing.scss
@@ -6,13 +6,14 @@
flex-direction: column;
justify-content: center;
align-items: center;
+ margin: auto;
+ padding: 1.5rem;
}
.exploration-begin-container {
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-around;
- margin: 8rem 1.5rem auto;
padding: 2rem 1rem;
box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);
border-radius: 4px;
diff --git a/src/components/FormGlobal/formProgress.scss b/src/components/FormGlobal/formProgress.scss
index 2a7d6d5a7690e1b621074a4a5d95dfbcb36caadd..d14628b00b61b1a07769ddd104ad634db475a383 100644
--- a/src/components/FormGlobal/formProgress.scss
+++ b/src/components/FormGlobal/formProgress.scss
@@ -1,12 +1,13 @@
@import '../../styles/base/color';
-.profile-type-progress{
+.profile-type-progress {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
.profile-type-progress-label {
font-size: 0.938rem;
+ font-weight: 700;
width: 1.875rem;
color: $gold-shadow;
text-align: right;
@@ -22,4 +23,4 @@
border-radius: 12px;
}
}
-}
\ No newline at end of file
+}
diff --git a/src/components/Navbar/navBar.scss b/src/components/Navbar/navBar.scss
index d324820e81ed9f86a44cf9ddff6caa300b84ab2e..eec9e331f0a42e72d97906fe970aa40d60de7d70 100644
--- a/src/components/Navbar/navBar.scss
+++ b/src/components/Navbar/navBar.scss
@@ -50,50 +50,54 @@
max-width: 100px;
margin: auto;
}
-.c-nav-link {
- padding: 0 1rem;
- font-size: 0.9rem;
- .on {
- display: none;
- }
- .off {
- display: block;
- }
-}
-a.c-nav-link,
-a.c-nav-link:visited {
- color: $white-light;
-}
-@media #{$tablet} {
- .c-nav-item {
- height: 54px;
- margin: -0.3rem 0 0 0;
+.c-nav-item {
+ &:hover {
+ a,
+ svg {
+ color: $white !important;
+ &.is-active {
+ color: $gold;
+ }
+ }
}
-}
-
-.c-nav-link .c-nav-icon {
- width: 60px;
- height: 36px;
- fill: none;
-}
-
-.c-nav-link.is-active .c-nav-icon {
- fill: $gold !important;
-}
+ .c-nav-link {
+ color: $white-light;
+ padding: 0 1rem;
+ font-size: 0.9rem;
+ &:visited {
+ color: $white-light;
+ }
+ .c-nav-icon {
+ width: 60px;
+ height: 36px;
+ fill: none;
+ }
+ .on {
+ display: none;
+ }
+ .off {
+ display: block;
+ }
-.c-nav-link.is-active {
- color: $white;
- box-shadow: inset 0.25rem 0 0 0 $gold;
- text-decoration: none;
- &:focus-visible {
- box-shadow: inset 0 0 0 1px $grey-bright, inset 0.25rem 0 0 0 $gold;
- }
- .on {
- display: block;
- }
- .off {
- display: none;
+ &.is-active {
+ color: $white;
+ box-shadow: inset 0.25rem 0 0 0 $gold;
+ text-decoration: none;
+ svg.c-nav-icon {
+ fill: $gold;
+ color: $gold !important;
+ }
+ &:focus-visible {
+ box-shadow: inset 0 0 0 1px $grey-bright, inset 0.25rem 0 0 0 $gold;
+ }
+ .on {
+ display: block;
+ }
+ .off {
+ display: none;
+ }
+ }
}
}
@@ -101,19 +105,22 @@ a.c-nav-link:visited {
.o-sidebar {
height: 56px;
}
- .c-nav-link {
- padding: 0;
- }
-
- .c-nav-link .c-nav-icon {
- padding: 0;
- margin: auto;
- }
- .c-nav-link.is-active {
- box-shadow: unset;
- &:focus {
- box-shadow: unset;
+ .c-nav-item {
+ height: 54px;
+ margin: -0.3rem 0 0 0;
+ .c-nav-link {
+ padding: 0;
+ .c-nav-icon {
+ padding: 0;
+ margin: auto;
+ }
+ &.is-active {
+ box-shadow: unset;
+ &:focus {
+ box-shadow: unset;
+ }
+ }
}
}
}
diff --git a/src/components/Options/ProfileTypeOptions.tsx b/src/components/Options/ProfileTypeOptions.tsx
index c22a535b6a7b3c25419a46f28ef8f9a4fd0f7f3f..230e6f90eff29ae1d736bbcbb6262ff781b9a8a5 100644
--- a/src/components/Options/ProfileTypeOptions.tsx
+++ b/src/components/Options/ProfileTypeOptions.tsx
@@ -239,7 +239,7 @@ const ProfileTypeOptions: React.FC = () => {
</AccordionDetails>
</Accordion>
)}
- {profile.isProfileTypeCompleted === false && (
+ {!profile.isProfileTypeCompleted && (
<StyledCard onClick={goToForm} className="profile-link">
<StyledIcon className="profile-icon" icon={profileIcon} size={42} />
<span className="link-label text-16-normal">
diff --git a/src/components/Options/exportOptions.scss b/src/components/Options/exportOptions.scss
index 9c291d0a334df0e1ac6df0087ff47f4cc97a6109..f5b3e357e5435447b11631c819194e7d8e4ca96b 100644
--- a/src/components/Options/exportOptions.scss
+++ b/src/components/Options/exportOptions.scss
@@ -21,6 +21,7 @@ div.expansion-panel-root.Mui-expanded:last-child {
}
.accordion-title {
padding-left: 1rem;
+ color: $white;
}
.expansion-panel-details {
flex-direction: column;
diff --git a/src/components/Options/profileTypeOptions.scss b/src/components/Options/profileTypeOptions.scss
index 9781a99617dfbd29a014ce4f7bd323dcf6b1789e..819bdedbceba809b0215f4fb418dc1065935b208 100644
--- a/src/components/Options/profileTypeOptions.scss
+++ b/src/components/Options/profileTypeOptions.scss
@@ -11,8 +11,8 @@
width: 45.75rem;
}
.MuiButtonBase-root {
- height: 4rem;
- margin: 0 -6px 0 0;
+ height: 40px;
+ margin: 0;
}
}
.value {
@@ -60,7 +60,7 @@
button.profile-link {
color: $grey-bright;
text-decoration: none;
- max-height: 5rem;
+ min-height: 4rem;
.profile-icon {
vertical-align: middle;
}
diff --git a/src/components/ProfileType/profileTypeFinished.scss b/src/components/ProfileType/profileTypeFinished.scss
index e967775202f6933af1463599f9d09ac5c507b835..62ae712b28c62a7c5367cdf4c99850bcb202f8cb 100644
--- a/src/components/ProfileType/profileTypeFinished.scss
+++ b/src/components/ProfileType/profileTypeFinished.scss
@@ -2,11 +2,7 @@
@import '../../styles/base/breakpoint';
.profile-type-finished-card {
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
- margin: 2rem 1.25rem;
+ margin: auto;
box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);
border-radius: 4px;
transition: all 300ms ease;
@@ -14,7 +10,7 @@
background: $grey-linear-gradient-background;
width: 80%;
text-align: center;
- padding: 0.5rem 1rem 1rem;
+ padding: 1rem;
@media (min-width: $width-tablet) {
width: 50%;
min-height: 28.75rem;
diff --git a/src/components/Quiz/quizBegin.scss b/src/components/Quiz/quizBegin.scss
index a9bf7ddf2a4138c3847855ae14aad109e93b3009..c1b59893cf0acceefa0ad75f1234e1c279f36fed 100644
--- a/src/components/Quiz/quizBegin.scss
+++ b/src/components/Quiz/quizBegin.scss
@@ -6,12 +6,13 @@
flex-direction: column;
justify-content: center;
align-items: center;
+ margin: auto;
+ padding: 1.5rem;
}
.quiz-begin-container {
display: flex;
flex-direction: column;
align-items: center;
- margin: 8rem 1.5rem auto;
padding: 2rem 1rem;
box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);
border-radius: 4px;
diff --git a/src/components/Quiz/quizFinish.scss b/src/components/Quiz/quizFinish.scss
index b85d44272a53171aa78cf82ecf2f71bd1597f69b..e9ad331c0086bf78094f3ad6e46d12c480697dfa 100644
--- a/src/components/Quiz/quizFinish.scss
+++ b/src/components/Quiz/quizFinish.scss
@@ -6,7 +6,8 @@
flex-direction: column;
justify-content: center;
align-items: center;
- margin: 8rem 1.5rem auto;
+ margin: auto;
+ padding: 1.5rem;
box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);
border-radius: 4px;
transition: all 300ms ease;
@@ -15,7 +16,6 @@
height: 100%;
width: 80%;
text-align: center;
- padding: 0.5rem 1rem 2rem;
@media (min-width: $width-tablet) {
width: 50%;
}
diff --git a/src/components/Quiz/quizQuestion.scss b/src/components/Quiz/quizQuestion.scss
index 4534723f9a741ea5d3931c22c51d4de98e05dde6..4caa1793678243176a9117d155a82c8dabf3c252 100644
--- a/src/components/Quiz/quizQuestion.scss
+++ b/src/components/Quiz/quizQuestion.scss
@@ -7,7 +7,8 @@
flex-direction: column;
justify-content: center;
align-items: center;
- margin: 8rem 1.5rem auto;
+ margin: auto;
+ padding: 1.5rem;
padding: 0.5rem 1rem;
box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);
border-radius: 4px;
diff --git a/src/locales/fr.json b/src/locales/fr.json
index 8297703c9141082301214e4cd1998d328d5b14f0..5a9bf8c94ae86a08ac08ade542a365cd296b30c2 100644
--- a/src/locales/fr.json
+++ b/src/locales/fr.json
@@ -477,7 +477,7 @@
},
"warming_fluid": {
"title": "Source chauffage",
- "question": "Quelle source d’énergie principale utilisez-vous pour votre chauffage ?",
+ "question": "Quelle source d’énergie principale utilisez-vous pour votre chauffage\u00a0?",
"0": "Électricité",
"2": "Gaz",
"3": "Bois",
@@ -485,14 +485,14 @@
},
"hot_water_type": {
"title": "Eau chaude",
- "question": "Quel est votre type de production d’eau chaude ?",
+ "question": "Quel est votre type de production d’eau chaude\u00a0?",
"individual": "Individuelle",
"collective": "Collective"
}
},
"ecogesture_profile": {
"equipments": {
- "question": "Quels équipements possédez-vous ?",
+ "question": "Quels équipements possédez-vous\u00a0?",
"hint": "Plusieurs réponses possibles",
"air_conditioning": "Climatisation",
"computer": "Ordinateur",
@@ -517,7 +517,7 @@
"ecogesture_selection": {
"header": "Sélection des astuces",
"title": "Vous avez parcouru un groupe de %{smart_count} astuces",
- "text": "Voulez-vous continuer sur votre lancée ou remettre cette sélection à plus tard ?",
+ "text": "Voulez-vous continuer sur votre lancée ou remettre cette sélection à plus tard\u00a0??",
"title_final": "Félicitations !",
"text_final_1": "Vous avez terminé la sélection des astuces adaptées à votre consommation.",
"text_final_2": "Vous pouvez les retrouver dans les sections “Objectifs” et “Je fais déjà” selon que vous les pratiquiez déjà ou non.",
@@ -805,7 +805,7 @@
"later": "Plus tard",
"go": "J'y vais",
"no": "Non",
- "yes":"Oui"
+ "yes": "Oui"
},
"delete_grdf_modal": {
"text1": "La suppression de la connexion avec GRDF s’accompagne de la suppression de votre consentement à partager vos données gaz avec Ecolyo.",
@@ -1077,7 +1077,7 @@
},
"heater_replacement": {
"title": "Pompe à chaleur ou poêle à bois",
- "question": "Au cours de ces 10 dernières années, avez-vous remplacé votre chaudière ou vous êtes-vous équipé d'une pompe à chaleur ou d'un poêle à bois ?",
+ "question": "Au cours de ces 10 dernières années, avez-vous remplacé votre chaudière ou vous êtes-vous équipé d'une pompe à chaleur ou d'un poêle à bois\u00a0?",
"yes": "Oui",
"no": "Non",
"unknown": "Je ne sais pas",