Skip to content

Commit

Permalink
styling for eligibility section
Browse files Browse the repository at this point in the history
  • Loading branch information
@jazmynlatimer
jazmynlatimer committed Apr 27, 2016
1 parent dc21dce commit ad0e6ab
Show file tree
Hide file tree
Showing 3 changed files with 85 additions and 35 deletions.
39 changes: 32 additions & 7 deletions frontend/less/custom.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -92,6 +92,38 @@ p.step_headline{
line-height: 1.5;
}

.apply_steps{
margin-top: 20px;
}

.step_headline{
color:@splash-background;
}

.step{
background-color: @brand-note;
color: #fff;
height:100%;
max-height:300px;
padding:12px;
border-radius: 4px;
}

.step-arrow{
color: @splash-background;
text-align: center;
}
.eligibility_headline{
margin-top:70px;
}


.eligibility-list-header{
border: 2px solid #069ED6;
padding:10px;
border-radius: 4px;
color:#069ED6
}

.eligibility_list li{
list-style: disc;
Expand Down Expand Up @@ -134,13 +166,6 @@ span.glyphicon{
color:#004A6C;
}

.time_expectation h2{
text-align: center;
max-width: none;
color:#004A6C;
margin-bottom:40px;
padding-top: 40px;
}


.cfa-staff{
Expand Down
18 changes: 9 additions & 9 deletions typeseam/content_constants.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,19 +11,19 @@
"We are not a law firm and the information on this site is not legal advice.")

benefits_headline = "Clearing your criminal record could help you qualify for jobs, housing, and educational opportunities."
eligibilty_headline = "Most people qualify for some form of record clearance."
eligibilty_headline = "Most people qualify for some form of record clearance"

gov_service_name = "Clean Slate is the San Francisco Public Defender's record clearance program"
gov_service_description = str(
"Clearing your record means you might be able to access more "
"employment, housing, education, and financial opportunities. Clear My Record is "
"a free, non-profit service that lets you apply to your county’s record "
"clearance program from your phone or computer. Once you apply, a Public "
"Defender will pull up your criminal record and figure out what record clearance "
"options make sense for you.")
gov_service_description_1 = str(
"Clear My Record is a free, online service made by Code for America. It is for people who have a criminal record in San Francisco. It was made by Code for America, who works with government to make their services easier to use." )

gov_service_description_2 = str(
"Applications to Clear My Record will go to the San Francisco Public Defender’s Office. Once they receive your application, they will send you a letter with next steps. Code for America is not a law firm and the information on this site is not legal advice." )

journey_headline = "3 Easy Steps to Apply"
about_service_headline = "This is an online service by Code for America for the San Francisco Public Defender"


journey_headline = "Apply to Clear My Record in 3 easy steps"
step_1_headline = "1. Apply online"
step_1_paragraph = "Fill out the pre-screener to help the public defender understand your history."
step_2_headline = "2. Check your eligibility"
Expand Down
63 changes: 44 additions & 19 deletions typeseam/templates/main_splash.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,46 +58,66 @@ <h2 class="subheadline">

<div class="row">
<div class="col-xs-12">
<h2 class="benefits_healine new_section">{{ content.benefits_headline }}</h2>
<h2 class="benefits_healine new_section" id="learn_more_section" name="learn_more_section">{{ content.journey_headline }}</h2>
</div>
</div>

<div class="row">
<div class="apply_steps">
<div class="col-xs-12 col-md-4">
<h4 class="step_headline">{{ content.step_1_headline }}</h4>
<p class="step_paragraph">{{ content.step_1_paragraph }}</p>
<div class="col-xs-12 col-md-3">
<div class="step">
<h4 class="step_headline">{{ content.step_1_headline }}</h4>
<p class="step_paragraph">{{ content.step_1_paragraph }}</p>
</div>
</div>

<div class="col-xs-12 col-md-1">
<h1 class="step-arrow">
<span class="glyphicon glyphicon-arrow-right visible-md visible-lg" aria-hidden="true"></span>
<span class="glyphicon glyphicon-arrow-down visible-xs visible-sm" aria-hidden="true"></span>
</h1>
</div>

<div class="col-xs-12 col-md-3">
<div class="step">
<h4 class="step_headline">{{ content.step_2_headline }}</h4>
<p class="step_paragraph">{{ content.step_2_paragraph }}</p>
</div>
</div>

<div class="col-xs-12 col-md-4">
<h4 class="step_headline">{{ content.step_2_headline }}</h4>
<p class="step_paragraph">{{ content.step_2_paragraph }}</p>
<div class="col-xs-12 col-md-1">
<h1 class="step-arrow">
<span class="glyphicon glyphicon-arrow-right visible-md visible-lg" aria-hidden="true"></span>
<span class="glyphicon glyphicon-arrow-down visible-xs visible-sm" aria-hidden="true"></span>
</h1>
</div>

<div class="col-xs-12 col-md-4">
<h4 class="step_headline">{{ content.step_3_headline }}</h4>
<p class="step_paragraph">{{ content.step_3_paragraph }}</p>
<div class="col-xs-12 col-md-3">
<div class="step">
<h4 class="step_headline">{{ content.step_3_headline }}</h4>
<p class="step_paragraph">{{ content.step_3_paragraph }}</p>
</div>
</div>
</div>
</div>


<div class="row">
<div class="col-xs-12">
<h2 class="eligibility_healine new_section">{{ content.eligibilty_headline }}</h2>
<h2 class="eligibility_headline new_section">{{ content.eligibilty_headline }}</h2>
</div>
</div>

<div class="row">
<div class="eligibility_info">

<div class="yes_qualify">
<div class="col-xs-12 col-md-8">
<div class="col-xs-12 col-md-7">
<h4 class="eligibility-list-header">
<span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
You might qualify
</h4>
<div class="col-xs-12 col-sm-6">
<div class="col-xs-12 col-sm-7">
<ul class="eligibility_list">
<li>Drug possession</li>
<li>Petty theft under $950</li>
Expand All @@ -109,7 +129,7 @@ <h4 class="eligibility-list-header">
</ul>
</div>

<div class="col-xs-12 col-sm-6">
<div class="col-xs-12 col-sm-5">
<ul class="eligibility_list">
<li>Theft</li>
<li>Prostitution</li>
Expand All @@ -125,7 +145,7 @@ <h4 class="eligibility-list-header">


<div class="no-qualify">
<div class="col-xs-12 col-md-4">
<div class="col-xs-12 col-md-4 col-md-offset-1">
<h4 class="eligibility-list-header">
<span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
You do not qualify
Expand All @@ -140,6 +160,7 @@ <h4 class="eligibility-list-header">
<li>On the sex offender registry</li>
<li>Convicted of any superstrikes</li>
</ul>
</div>
</div>
</div>

Expand Down Expand Up @@ -168,16 +189,20 @@ <h2 class="backup_apply_headline new_section">{{ content.backup_apply_headline }

<div class="row">
<div class="col-xs-12 col-md-6">
<div class="gov_service" id="learn_more_section" name="learn_more_section">
<div class="gov_service">
<h2 class="gov_service_name">
{{ content.gov_service_name }}
</h2>
<p class="gov_service_description">
{{ content.gov_service_description }}
<p class="gov_service_description_1)">
{{ content.gov_service_description_1 }}
</p>

<p class="gov_service_description_2)">
{{ content.gov_service_description_2 }}
</p>
</div>

<div class="contact_info new_section">
<div class="contact_info">
<h2>{{ content.contact_headline }}</h2>
<ul>
<li>Email: {{ linkify(content.contact_email) }}</li>
Expand Down

0 comments on commit ad0e6ab

Please sign in to comment.