Skip to content

Commit

Permalink
Addressed some changes
Browse files Browse the repository at this point in the history
  • Loading branch information
@BrahimMahadi
BrahimMahadi committed Dec 9, 2024
1 parent 70a9c18 commit 43b2ae4
Show file tree
Hide file tree
Showing 3 changed files with 28 additions and 19 deletions.
34 changes: 18 additions & 16 deletions méli-mélo/th-empathy/empathy.html
View file
Original file line number Diff line number Diff line change
@@ -1,10 +1,11 @@
---
title: Empathy theme
dateModified: 2024-04-30
dateModified: 2024-12-09
description: Empathy CSS styles
lang: en
pageclass: cnt-wdth-lmtd
css:
- https://use.fontawesome.com/releases/v5.15.4/css/all.css
- style.css
- https://wet-boew.github.io/themes-dist/GCWeb/GCWeb/méli-mélo/2025-04-nahanni.css
script:
Expand Down Expand Up @@ -94,13 +95,13 @@ <h4>Code</h4>
&lt;/div&gt;</code></pre>

<h3>Life Journey Home Page Layout</h3>
<div class="mrgn-tp-lg container">
<div class="mrgn-tp-lg">
<div class="row wb-eqht-grd">
<div class="col-xs-12 col-md-8 empathy main-content small">
<div class="col-xs-12 col-md-8 empathy services-and-information small">
<div class="row wb-eqht-grd">
<div class="col-sm-12 col-md-6 mrgn-bttm-lg">
<div class="empathy cards h-100 full-width">
<a href="#" class="stretched-link"><h2 class="h4">Preparing for end of life</h6></a>
<h4><a href="#" class="stretched-link">Preparing for end of life</a></h4>
<p>Information on how to prepare, organize your affairs and leave instructions to your survivors.
</p>
<span class="fas fa-arrow-right" aria-hidden="true"></span>
Expand All @@ -109,31 +110,31 @@ <h3>Life Journey Home Page Layout</h3>

<div class="col-sm-12 col-md-6 mrgn-bttm-lg">
<div class="empathy cards h-100 full-width">
<a href="#" class="stretched-link"><h2 class="h4">Notify of a death</h2></a>
<h4><a href="#" class="stretched-link">Notify of a death</a></h4>
<p>Programs and departments to notify to cancel benefits or return ineligible benefits.</p>
<span class="fas fa-arrow-right" aria-hidden="true"></span>
</div>
</div>

<div class="col-sm-12 col-md-6 mrgn-bttm-lg">
<div class="empathy cards h-100 full-width">
<a href="#" class="stretched-link"><h2 class="h4">Benefits and Programs</h2></a>
<p>Applying for benefits to which you may be entitled following a death.</p><br>
<h4><a href="#" class="stretched-link">Benefits and Programs</a></h4>
<p>Applying for benefits to which you may be entitled following a death.</p>
<span class="fas fa-arrow-right" aria-hidden="true"></span>
</div>
</div>

<div class="col-sm-12 col-md-6 mrgn-bttm-lg">
<div class="empathy cards h-100 full-width">
<a href="#" class="stretched-link"><h2 class="h4">Representing someone who died</h2></a>
<h4><a href="#" class="stretched-link">Representing someone who died</a></h4>
<p>The legal, financial, estate planning, and other aspects of representing someone who has died.</p>
<span class="fas fa-arrow-right" aria-hidden="true"></span>
</div>
</div>

<div class="col-sm-12 col-md-6 mrgn-bttm-lg">
<div class="empathy cards h-100 full-width">
<a href="#" class="stretched-link"><h2 class="h4">Taxes and finances related to death</h2></a>
<h4><a href="#" class="stretched-link">Taxes and finances related to death</a></h4>
<p>Information on managing finances of an individual who died, including preparing and filing their taxes.
</p>
<span class="fas fa-arrow-right" aria-hidden="true"></span>
Expand All @@ -142,23 +143,23 @@ <h3>Life Journey Home Page Layout</h3>

<div class="col-sm-12 col-md-6 mrgn-bttm-lg">
<div class="empathy cards h-100 full-width">
<a href="#" class="stretched-link"><h2 class="h4">Estates and wills</h2></a>
<h4><a href="#" class="stretched-link">Estates and wills</a></h4>
<p>Find information about estate planning and preparing a will, as well as what to do when there is no will.</p>
<span class="fas fa-arrow-right" aria-hidden="true"></span>
</div>
</div>

<div class="col-sm-12 col-md-6 mrgn-bttm-lg">
<div class="empathy cards h-100 full-width">
<a href="#" class="stretched-link"><h2 class="h4">Death-related documents</h2></a>
<p>Documents you may need to obtain following a death.</p><br>
<h4><a href="#" class="stretched-link">Death-related documents</a></h4>
<p>Documents you may need to obtain following a death.</p>
<span class="fas fa-arrow-right" aria-hidden="true"></span>
</div>
</div>

<div class="col-sm-12 col-md-6 mrgn-bttm-lg">
<div class="empathy cards h-100 full-width">
<a href="#" class="stretched-link"><h2 class="h4">Contacting services</h2></a>
<h4><a href="#" class="stretched-link">Contacting services</a></h4>
<p>Contact information for various federal or provincial programs, departments, or agencies.</p>
<span class="fas fa-arrow-right" aria-hidden="true"></span>
</div>
Expand All @@ -172,18 +173,19 @@ <h2>Someone died, <br>what do I do?</h2>
<p class="mrgn-tp-lg"><span class="fas fa-clock"></span> This will take less than a minute.</p>
<a href="#" class="mrgn-tp-lg btn btn-default btn-empathy btn-block btn-lg">Start questionnaire</a>

<img class="quiz-img mrgn-tp-lg center-block hidden-xs hidden-sm" src="./images/lloj-direction-cloud.256.png" alt="Someone died, what do I do?">
<img class="quiz-img mrgn-tp-lg center-block hidden-xs hidden-sm" src="images/lloj-direction-cloud.256.png" alt="Someone died, what do I do?">
</div>
</div>
</div>
<h4>Code</h4>
<div class="wb-prettify all-pre hide"></div>
<pre><code>&lt;div class="mrgn-tp-lg container"&gt;
&lt;div class="row wb-eqht-grd"&gt;
&lt;div class="col-xs-12 col-md-8 empathy main-content small"&gt;
&lt;div class="col-xs-12 col-md-8 empathy services-and-information small"&gt;
&lt;div class="row wb-eqht-grd"&gt;
&lt;div class="col-sm-12 col-md-6 mrgn-bttm-lg"&gt;
&lt;div class="empathy cards h-100 full-width"&gt;
&lt;a href="#" class="stretched-link"&gt;&lt;h2 class="h4"&gt; Lorem ipsum &lt;/h2&gt;&lt;/a&gt;
&lt;h4&gt;&lt;a href="#" class="stretched-link"&gt; Lorem ipsum &lt;/a&gt;&lt;/h4&gt;
&lt;p&gt;Lorem ipsum dolor sit amet, consectet&lt;/p&gt;
&lt;span class="fas fa-arrow-right" aria-hidden="true"&gt;&lt;/span&gt;
&lt;/div&gt;
Expand Down
7 changes: 7 additions & 0 deletions méli-mélo/th-empathy/meta.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,5 +20,12 @@ pages:
language: en
path: empathy.html
sponsor: ESDC - Principal Publisher

changes:
- date: 2024-12-02
description: Life Journey home page layout, includes the code and an example to enable the home page layout to be used by current and future Life Journey projects
departmentImpact: Having this layout intergrated will allow Canada.ca to have a more streamlined and consistent theme throughout the Journey Labs projects. Currently the pages that make use of this layout have it hardcoded into the page
publicImpact: The Public at Large, the layout makes it easy for users to know that they are currently on a Journey Labs project page

output: false
---
6 changes: 3 additions & 3 deletions méli-mélo/th-empathy/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -93,14 +93,14 @@ h1#wb-cont.empathy {
border-radius: 10px;
}

.empathy.main-content .empathy.cards:hover {
.empathy.services-and-information .empathy.cards:hover {
background-color: #6c3c9b;
color: #fff;
cursor: pointer;
}

/* Added to specifically target the link*/
.empathy.main-content .empathy.cards:hover a {
.empathy.services-and-information .empathy.cards:hover a {
color: #fff;
}

Expand All @@ -113,7 +113,7 @@ h1#wb-cont.empathy {
Might be able to accomplish something similar by adding the purple box first and floating it right -- doesn't work in a display flex
*/
@media screen and (max-width: 991px) {
.empathy.main-content {
.empathy.services-and-information {
order: 1;
}
}
Expand Down

0 comments on commit 43b2ae4

Please sign in to comment.