Skip to content

Commit

Permalink
馃拕 (mon-pix): BEM refacto
Browse files Browse the repository at this point in the history
  • Loading branch information
@AndreiaPena
AndreiaPena committed Jun 17, 2024
1 parent 96e9130 commit 465d47c
Show file tree
Hide file tree
Showing 8 changed files with 204 additions and 189 deletions.
6 changes: 3 additions & 3 deletions mon-pix/app/components/certification-instructions/step-five.hbs
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<div class="certification-instructions__content">
<span class="certification-instructions__question--bold">{{t "pages.certification-instructions.steps.5.text"}}</span>
<ul class="certification-instructions-content__list">
<div class="instructions-content">
<span class="instructions-content__title--bold">{{t "pages.certification-instructions.steps.5.text"}}</span>
<ul class="instructions-content-list">
<li>
<strong>
{{t "pages.certification-instructions.steps.5.list.no-communication.strong-text"}}
Expand Down
2 changes: 1 addition & 1 deletion mon-pix/app/components/certification-instructions/step-four.hbs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,4 +10,4 @@
</strong>

{{t "pages.certification-instructions.steps.4.paragraph.text.2"}}
</p>
</p>
10 changes: 5 additions & 5 deletions mon-pix/app/components/certification-instructions/step-one.hbs
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,17 @@
<div class="certification-instructions__content">
<h3 class="certification-instructions__question--bold">
<div class="instructions-content">
<h3 class="instructions-content__title--bold">
{{t "pages.certification-instructions.steps.1.question"}}
</h3>

<p>
<p class="instructions-content__paragraph">
<strong>
{{t "pages.certification-instructions.steps.1.paragraphs.1.strong-text"}}
</strong>

{{t "pages.certification-instructions.steps.1.paragraphs.1.text"}}
</p>

<p>
<p class="instructions-content__paragraph">
{{t "pages.certification-instructions.steps.1.paragraphs.2.text1"}}

<strong>
Expand All @@ -21,7 +21,7 @@
{{t "pages.certification-instructions.steps.1.paragraphs.2.text2"}}
</p>

<p>
<p class="instructions-content__paragraph">
<strong>
{{t "pages.certification-instructions.steps.1.paragraphs.3.strong-text1"}}
</strong>
Expand Down
70 changes: 36 additions & 34 deletions mon-pix/app/components/certification-instructions/step-three.hbs
View file
Original file line number Diff line number Diff line change
@@ -1,39 +1,41 @@
<div class="certification-instructions-content__images">
<img
class="certification-instructions-content-images__image"
src="/images/illustrations/certification-instructions-steps/regular-challenge-round.svg"
alt={{t "pages.certification-instructions.steps.3.images.regular-challenge"}}
/>
<img
class="certification-instructions-content-images__image"
src="/images/illustrations/certification-instructions-steps/focus-challenge-round.svg"
alt={{t "pages.certification-instructions.steps.3.images.focus-challenge"}}
/>
</div>
<dl class="certification-instructions-content__description-list">
<dt class="certification-instructions__question--bold">
{{t "pages.certification-instructions.steps.3.paragraphs.1.title"}}
</dt>
<dd class="certification-instructions-content-description-list__first-description">
{{t "pages.certification-instructions.steps.3.paragraphs.1.text1"}}
<div class="instructions-content-with-images">
<div class="instructions-content__images">
<img
class="instructions-content__image"
src="/images/illustrations/certification-instructions-steps/regular-challenge-round.svg"
alt={{t "pages.certification-instructions.steps.3.images.regular-challenge"}}
/>
<img
class="instructions-content__image"
src="/images/illustrations/certification-instructions-steps/focus-challenge-round.svg"
alt={{t "pages.certification-instructions.steps.3.images.focus-challenge"}}
/>
</div>
<dl class="instructions-description-list">
<dt class="instructions-content__title--bold">
{{t "pages.certification-instructions.steps.3.paragraphs.1.title"}}
</dt>
<dd class="instructions-description-list__first-description">
{{t "pages.certification-instructions.steps.3.paragraphs.1.text1"}}

<span class="certification-instructions__text--bold">
{{t "pages.certification-instructions.steps.3.paragraphs.1.strong-text"}}
</span>
<span class="instructions-content__text--bold">
{{t "pages.certification-instructions.steps.3.paragraphs.1.strong-text"}}
</span>

{{t "pages.certification-instructions.steps.3.paragraphs.1.text2"}}
</dd>
{{t "pages.certification-instructions.steps.3.paragraphs.1.text2"}}
</dd>

<dt class="certification-instructions__question--bold">
{{t "pages.certification-instructions.steps.3.paragraphs.2.title"}}
</dt>
<dd>
{{t "pages.certification-instructions.steps.3.paragraphs.2.text1"}}
<dt class="instructions-content__title--bold">
{{t "pages.certification-instructions.steps.3.paragraphs.2.title"}}
</dt>
<dd>
{{t "pages.certification-instructions.steps.3.paragraphs.2.text1"}}

<span class="certification-instructions__text--bold">
{{t "pages.certification-instructions.steps.3.paragraphs.2.strong-text"}}
</span>
<span class="instructions-content__text--bold">
{{t "pages.certification-instructions.steps.3.paragraphs.2.strong-text"}}
</span>

{{t "pages.certification-instructions.steps.3.paragraphs.2.text2"}}
</dd>
</dl>
{{t "pages.certification-instructions.steps.3.paragraphs.2.text2"}}
</dd>
</dl>
</div>
71 changes: 36 additions & 35 deletions mon-pix/app/components/certification-instructions/step-two.hbs
View file
Original file line number Diff line number Diff line change
@@ -1,44 +1,45 @@
<div class="certification-instructions-content__image-with-legend">
<img
class="certification-instructions-content__size"
src="/images/illustrations/certification-instructions-steps/clock.svg"
alt=""
/>
<p class="certification-instructions-content-image-with-legend__legend">
<span class="certification-instructions__question--bold">
{{t "pages.certification-instructions.steps.2.legend.strong-text"}}
</span>
<br />
{{t "pages.certification-instructions.steps.2.legend.text"}}
</p>
</div>
<div class="certification-instructions__content">
<div class="instructions-content-with-images">
<div class="instructions-content-with-images__legend">
<img
class="instructions-content__image"
src="/images/illustrations/certification-instructions-steps/clock.svg"
alt=""
/>
<p>
<span class="instructions-content-with-images__legend--bold">
{{t "pages.certification-instructions.steps.2.legend.strong-text"}}
</span>

<p>
<h3 class="certification-instructions__question--bold">
{{t "pages.certification-instructions.steps.2.legend.text"}}
</p>
</div>

<div class="instructions-content-step-two">
<h3 class="instructions-content__title--bold">
{{t "pages.certification-instructions.steps.2.paragraphs.1.question"}}
</h3>
<br />
{{t "pages.certification-instructions.steps.2.paragraphs.1.text"}}

<span class="certification-instructions__text--bold">
{{t "pages.certification-instructions.steps.2.paragraphs.1.strong-text"}}
</span>
</p>
<p class="instructions-content-step-two__paragraph">
{{t "pages.certification-instructions.steps.2.paragraphs.1.text"}}

<span class="instructions-content__text--bold">
{{t "pages.certification-instructions.steps.2.paragraphs.1.strong-text"}}
</span>
</p>

<p>
<h3 class="certification-instructions__question--bold">
<h3 class="instructions-content__title--bold">
{{t "pages.certification-instructions.steps.2.paragraphs.2.question"}}
</h3>
<br />
{{t "pages.certification-instructions.steps.2.paragraphs.2.text"}}
<p>
{{t "pages.certification-instructions.steps.2.paragraphs.2.text"}}

<span class="certification-instructions__text--bold">
{{t "pages.certification-instructions.steps.2.paragraphs.2.strong-text"}}
</span>
<br />
<span class="certification-instructions__text--light">
{{t "pages.certification-instructions.steps.2.paragraphs.2.light-text"}}
</span>
</p>
<span class="instructions-content__text--bold">
{{t "pages.certification-instructions.steps.2.paragraphs.2.strong-text"}}
</span>
<br />
<span class="instructions-content__text--light">
{{t "pages.certification-instructions.steps.2.paragraphs.2.light-text"}}
</span>
</p>
</div>
</div>
42 changes: 20 additions & 22 deletions mon-pix/app/components/certification-instructions/steps.hbs
View file
Original file line number Diff line number Diff line change
@@ -1,34 +1,32 @@
<h2 class="certification-instructions__title">{{this.title}}</h2>
<h2 class="instructions-step__title">{{this.title}}</h2>

<div class="certification-instructions__content">
{{#if (eq this.pageId 1)}}
<CertificationInstructions::StepOne />
{{/if}}
{{#if (eq this.pageId 2)}}
<CertificationInstructions::StepTwo />
{{/if}}
{{#if (eq this.pageId 3)}}
<CertificationInstructions::StepThree />
{{/if}}
{{#if (eq this.pageId 4)}}
<CertificationInstructions::StepFour />
{{/if}}
{{#if (eq this.pageId 5)}}
<CertificationInstructions::StepFive @enableNextButton={{this.enableNextButton}} />
{{/if}}
</div>
{{#if (eq this.pageId 1)}}
<CertificationInstructions::StepOne />
{{/if}}
{{#if (eq this.pageId 2)}}
<CertificationInstructions::StepTwo />
{{/if}}
{{#if (eq this.pageId 3)}}
<CertificationInstructions::StepThree />
{{/if}}
{{#if (eq this.pageId 4)}}
<CertificationInstructions::StepFour />
{{/if}}
{{#if (eq this.pageId 5)}}
<CertificationInstructions::StepFive @enableNextButton={{this.enableNextButton}} />
{{/if}}

<footer class="certification-instructions__footer">
<div class="certification-instructions-footer__dots">
<footer class="instructions-footer">
<div>
{{#each this.paging as |page-class|}}
<img
class="certification-instructions-footer-dots__dot {{page-class}}"
class="instructions-footer__dot {{page-class}}"
src="/images/illustrations/certification-instructions-steps/ellipse.svg"
alt=""
/>
{{/each}}
</div>
<div class="certification-instructions-footer__buttons">
<div class="instructions-footer__buttons">
{{#if this.showPreviousButton}}
<PixButton
@size="large"
Expand Down
Loading

0 comments on commit 465d47c

Please sign in to comment.