Skip to content

Feature/ecasogp 10808 #418

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 3 commits into
base: toolkit
Choose a base branch
from
Open

Feature/ecasogp 10808 #418

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
78a8359
updated toolkit page
luna-fed-developer Dec 17, 2023
48fb05b
updated link text color
luna-fed-developer Dec 17, 2023
088efd2
Merge branch 'toolkit' into feature/ECASOGP-10808
luna-fed-developer Dec 18, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
96 changes: 59 additions & 37 deletions _pages/evaluation-toolkit.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,50 +14,72 @@ type : evaluation-toolkit
</div>
</section>

<section class="usa-graphic-list">
<div class="grid-container margin-0 padding-0">
<div class="usa-graphic-list__row grid-row grid-gap display-flex">
<div class="usa-media-block">
<h2 class="margin-bottom-0 text-primary">GET STARTED WITH THE TOOLKIT</h2>
<section class="usa-graphic-list margin-y-205">
<div class="grid-row grid-gap toolkit-hero shadow-5 margin-x-0">
<div class="tablet:grid-col-2">
<img class="circle-evaluation-card" alt="Evaluation 101 icon" src="{{site.baseurl}}/assets/images/evaluation/evaluation-101.png">
</div>
<div class="tablet:grid-col-10">
<h2 class="margin-0 text-white">Evaluation 101</h2>
<p class="margin-0 text-white">Learn the basics of evaluation – what it is, why it’s important, and different types</p>
<div class="mobile-lg:grid-col padding-top-1">
<a class="text-no-underline usa-button bg-white border-0 padding-x-4 text-primary toolkit-button"
href="{{site.baseurl}}/evaluation-toolkit/evaluation-101" aria-label="Get started with Evaluation 101">Get Started</a>
</div>
</div>
</div>
</section>

<section class="usa-graphic-list">
<div class="grid-container margin-0 padding-0 toolkit-padding">
<div class="usa-graphic-list__row grid-row grid-gap">
<div class="usa-media-block tablet:grid-col-4 text-center padding-bottom-205">
<a href="{{site.baseurl}}/evaluation-toolkit/evaluation-101" class="eoc-link text-no-underline display-inline-block">
<img class="circle-evaluation-card" alt="" src="{{site.baseurl}}/assets/images/evaluation/evaluation-101.png">
<p class="usa-media-block__body evaluation-width"><b>Evaluation 101</b></p>
</a>
<div class="usa-media-block tablet:grid-col-6 text-center padding-bottom-205">
<div class="grid-row grid-gap">
<div class="tablet:grid-col-4">
<img class="circle-evaluation-card" alt="Getting Started icon" src="{{site.baseurl}}/assets/images/evaluation/getting-started.png">
</div>
<div class="tablet:grid-col-8 text-primary toolkit-text">
<h3 class="usa-media-block__body evaluation-width margin-0"><a href="{{site.baseurl}}/evaluation-toolkit/non-evaluator" class="text-no-underline display-inline-block text-primary"><b>Getting Started</b></a></h3>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
</div>
</div>
</div>
<div class="usa-media-block tablet:grid-col-4 text-center padding-bottom-205">
<a href="{{site.baseurl}}/evaluation-toolkit/why-evaluate" class="eoc-link text-no-underline display-inline-block">
<img class="circle-evaluation-card" alt="" src="{{site.baseurl}}/assets/images/evaluation/why-evaluate.png">
<p class="usa-media-block__body evaluation-width"><b>Why Evaluate?</b></p>
</a>
<div class="usa-media-block tablet:grid-col-6 text-center padding-bottom-205">
<div class="grid-row grid-gap">
<div class="tablet:grid-col-4">
<img class="circle-evaluation-card" alt="Using evaluation icon" src="{{site.baseurl}}/assets/images/evaluation/using-evaluation.png">
</div>
<div class="tablet:grid-col-8 text-primary toolkit-text">
<h3 class="usa-media-block__body evaluation-width margin-0"><a href="{{site.baseurl}}/evaluation-toolkit/evaluation" class="text-no-underline display-inline-block text-primary"><b>Using Evaluation</b></a></h3>
<p>Tools to help you be a savvy user of evaluation findings</p>
</div>
</div>
</div>
<div class="usa-media-block tablet:grid-col-4 text-center padding-bottom-205">
<a href="{{site.baseurl}}/evaluation-toolkit/non-evaluator" class="eoc-link text-no-underline display-inline-block">
<img class="circle-evaluation-card" alt="" src="{{site.baseurl}}/assets/images/evaluation/non-evaluator.png">
<p class="usa-media-block__body evaluation-width"><b>Getting Started as a Non-Evaluator</b></p>
</a>
<div class="usa-media-block tablet:grid-col-6 text-center padding-bottom-205">
<div class="grid-row grid-gap">
<div class="tablet:grid-col-4">
<img class="circle-evaluation-card" alt="Promoting evaluation use icon" src="{{site.baseurl}}/assets/images/evaluation/promoting-evaluation.png">
</div>
<div class="tablet:grid-col-8 text-primary toolkit-text">
<h3 class="usa-media-block__body evaluation-width margin-0"><a href="{{site.baseurl}}/evaluation-toolkit/promoting-evaluation" class="text-no-underline display-inline-block text-primary"><b>Promoting Evaluation Use</b></a></h3>
<p>Learn ways to ensure that evaluation findings reach the right audience and are put into action</p>
</div>
</div>
</div>
<div class="usa-media-block tablet:grid-col-4 text-center padding-bottom-205">
<a href="{{site.baseurl}}/evaluation-toolkit/evaluation" class="eoc-link text-no-underline display-inline-block">
<img class="circle-evaluation-card" alt="" src="{{site.baseurl}}/assets/images/evaluation/using-evaluation.png">
<p class="usa-media-block__body evaluation-width"><b>Using Evaluation</b></p>
</a>
</div>
<div class="usa-media-block tablet:grid-col-4 text-center padding-bottom-205">
<a href="{{site.baseurl}}/evaluation-toolkit/promoting-evaluation" class="eoc-link text-no-underline display-inline-block">
<img class="circle-evaluation-card" alt="" src="{{site.baseurl}}/assets/images/evaluation/promoting-evaluation.png">
<p class="usa-media-block__body evaluation-width"><b>Promoting Evaluation Use</b></p>
</a>
</div>
<div class="usa-media-block tablet:grid-col-4 text-center padding-bottom-205">
<a href="{{site.baseurl}}/evaluation-toolkit/about-toolkit" class="eoc-link text-no-underline display-inline-block">
<img class="circle-evaluation-card" alt="" src="{{site.baseurl}}/assets/images/evaluation/about-toolkit.png">
<p class="usa-media-block__body evaluation-width"><b>About the Toolkit</b></p>
</a>
<div class="usa-media-block tablet:grid-col-6 text-center padding-bottom-205">
<div class="grid-row grid-gap">
<div class="tablet:grid-col-4">
<img class="circle-evaluation-card" alt="Why evaluate icon" src="{{site.baseurl}}/assets/images/evaluation/why-evaluate.png">
</div>
<div class="tablet:grid-col-8 text-primary toolkit-text">
<h3 class="usa-media-block__body evaluation-width margin-0"><a href="{{site.baseurl}}/evaluation-toolkit/why-evaluate" class="text-no-underline display-inline-block text-primary"><b>Why Evaluate?</b></a></h3>
<p>Understand the value-add of evaluation and why it is so important</p>
</div>
</div>
</div>
</div>
</div>
<div class="text-center"><a class="usa-button usa-button--outline border-0 padding-x-6"
href="{{site.baseurl}}/evaluation-toolkit/about-toolkit">About the Toolkit</a>
</div>
</section>
3 changes: 0 additions & 3 deletions assets/css/index.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -226,9 +226,6 @@ html {
}
}
@media screen and (max-width: 768px) {
img {
max-width: 33%;
}

img.adward-bio-img {
max-width: 100%;
Expand Down
60 changes: 47 additions & 13 deletions assets/css/main.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -165,7 +165,12 @@ html {
.circle-card {
height: auto;
border-radius: 50%;

@media only screen and (max-width: 768px) {
max-width: 33%;
}
}

.agency-border-top {
border-top:0.5rem solid #0d7ea2;
}
Expand Down Expand Up @@ -774,23 +779,52 @@ blockquote p {
border-radius: 0.7rem;
}
.circle-evaluation-card {
width: 10rem;
border-radius: 50%;
background: linear-gradient(52deg, #162e51 25%, #28a0cb 100%);

@media only screen and (max-width: 640px) {
width: 40rem;
}
width: 10rem;
border-radius: 50%;
background: linear-gradient(52deg, #162e51 25%, #28a0cb 100%);
}
@media only screen and (max-width: 639px) {
.title {
margin-top: 1.1rem;
}
.title {
margin-top: 1.1rem;
}
}

@media only screen and (min-width: 640px) {
.toolkit-text {
text-align: left;
}

.toolkit-padding {
padding-left: 5rem;
padding-right: 5rem;
}
}
.evaluation-width{
width:180px;
margin:auto;

.toolkit-hero {
padding: 40px;
border-radius: 30px;
color: #fff;
padding-bottom: 20px;
background-color: #082643;

@media only screen and (max-width: 639px) {
text-align: center;
}

.circle-evaluation-card {
background: unset;
}
}

.toolkit-button:visited {
color:#005ea2;
}

.toolkit-button::after {
content: '>>';
margin-left: 0.5em;
}

.resource-category {
color: #5b616b;
border-top: 0.15rem solid #5b616b;
Expand Down
Binary file removed assets/images/evaluation/about-toolkit.png
View file
Open in desktop
Binary file not shown.
Binary file added assets/images/evaluation/archive-evaluation-101.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
0 assets/images/evaluation/non-evaluator.png → ...ages/evaluation/archive-non-evaluator.png
View file
Open in desktop
File renamed without changes
Binary file modified assets/images/evaluation/evaluation-101.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/images/evaluation/getting-started.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified assets/images/evaluation/promoting-evaluation.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.