Step1Right component was remade

src/components/steps/Step1/Step1Right.vue

@@ -1,20 +1,14 @@
 <template>
   <div>
-    <p>
-      {{ $t("step1.info_line1") }}
-    </p>
-    <p>
-      {{ $t("step1.info_line2") }}
-    </p>
-    <p>
-      {{ $t("step1.info_line3") }}
-    </p>
-    <p>
-      {{ $t("step1.info_line4") }}
-    </p>
-    <p>
-      {{ $t("step1.info_line5") }}
-    </p>
+    <p class="hint-step">{{ $t("general.why_and_how") }}</p>
+    <h2 class="title-step">{{ $t("step1.title_right") }}</h2>
+    <p class="subtitle-step margin-bottom-30">{{ $t("step1.info_line1") }}</p>
+    <p class="hint-step text-uppercase">{{ $t("step1.dac_name") }}</p>
+    <p class="subtitle-step margin-bottom-20">{{ $t("step1.info_line2") }}</p>
+    <p class="hint-step text-uppercase">{{ $t("step1.token_symbol") }}</p>
+    <p class="subtitle-step margin-bottom-20">{{ $t("step1.info_line3") }}</p>
+    <p class="hint-step text-uppercase">{{ $t("step1.description") }}</p>
+    <p class="subtitle-step margin-bottom-20">{{ $t("step1.info_line4") }}</p>
   </div>
 </template>
 

src/components/steps/Step2/Step2Form.vue

@@ -7,7 +7,7 @@
     <my-input
       v-model="issuance"
       color="secondary"
-      :label="`${$t('step2.issuance', { token_symbol: getTokenSymbol })} *`"
+      :label="`${$t('step2.issuance')} ${getTokenSymbol} *`"
       :hint="$t('step2.issuance_hint')"
       :rules="[
         val => !!val || $t('general.required'),

src/components/steps/Step2/Step2Right.vue

@@ -2,7 +2,7 @@
   <div>
     <p class="hint-step">{{ $t("general.why_and_how") }}</p>
     <h2 class="title-step">{{ $t("step2.title_right") }}</h2>
-    <p class="hint-step text-uppercase">issuance</p>
+    <p class="hint-step text-uppercase">{{ $t("step2.issuance") }}</p>
     <p class="subtitle-step">
       {{ $t("step2.info_line1") }}
     </p>

src/components/steps/Step4/index.js

@@ -0,0 +1,2 @@
+export { default as Step4Form } from "./Step4Form";
+export { default as Step4Right } from "./Step4Right";

src/components/steps/Step5/Step5Right.vue

@@ -9,7 +9,7 @@
       <p class="hint-step text-uppercase">{{ $t("step1.description") }}</p>
       <p class="subtitle-step margin-bottom-15 break-text-hyphens">{{ step1.dacDescription }}</p>
       <custom-divider compClass="divider" />
-      <p class="hint-step text-uppercase">{{ $t("step2.issuance", { token_symbol: step1.tokenSymbol }) }}</p>
+      <p class="hint-step text-uppercase">{{ $t("step2.issuance") }} {{ step1.tokenSymbol }}</p>
       <p class="subtitle-step margin-bottom-15">{{ step2.issuance }}</p>
       <p class="hint-step text-uppercase">{{ $t("step2.decimals") }}</p>
       <p class="subtitle-step margin-bottom-15">{{ step2.decimals }}</p>

src/components/steps/Step5/index.js

@@ -0,0 +1,2 @@
+export { default as Step5Form } from "./Step5Form";
+export { default as Step5Right } from "./Step5Right";

src/i18n/en-us/index.js

@@ -76,6 +76,7 @@ export default {
   },
   step1: {
     title: "DAC Profile",
+    title_right: "Understanding of profile",
     dac_name: "DAC Name",
     dac_name_hint: "Enter a name for your DAC",
     dac_name_rule_length_3: "DAC name must be minimum 3 chars.",
@@ -94,14 +95,12 @@ export default {
     info_line3:
       "Your token symbol should contain capital letters only and is limited to 7 characters. Ideally, you’ll want to avoid using a token symbol which might be confused with existing EOS tokens. This token will be your governance token used by your members to elect custodians.",
     info_line4:
-      "A DAC is a group of people with a shared goal. Your DAC Description should let people know what your community goal is all about and why they might want to participate.",
-    info_line5:
-      "The DAC ID is a unique identifier for your DAC used by the system to keep your data organized together and will be generated from your DAC Name."
+      "A DAC is a group of people with a shared goal. Your DAC Description should let people know what your community goal is all about and why they might want to participate."
   },
   step2: {
     title: "Tokenomics",
     title_right: "Understanding of tokenomics",
-    issuance: "Issuance {token_symbol}",
+    issuance: "Issuance",
     issuance_hint: "Issuance for your token",
     decimals: "Decimals",
     info_line1:

src/pages/Steps.vue

@@ -78,10 +78,8 @@ import { STEPS_NUMBER } from "components/constants";
 import { Step1Form, Step1Right } from "components/steps/Step1";
 import { Step2Form, Step2Right } from "components/steps/Step2";
 import { Step3Form, Step3Right } from "components/steps/Step3";
-import Step4Form from "components/steps/Step4/Step4Form";
-import Step4Right from "components/steps/Step4/Step4Right";
-import Step5Form from "components/steps/Step5/Step5Form";
-import Step5Right from "components/steps/Step5/Step5Right";
+import { Step4Form, Step4Right } from "components/steps/Step4";
+import { Step5Form, Step5Right } from "components/steps/Step5";
 
 export default {
   data() {