-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathcampaigns.html
More file actions
158 lines (132 loc) · 6.37 KB
/
Copy pathcampaigns.html
File metadata and controls
158 lines (132 loc) · 6.37 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
<!DOCTYPE html>
<html lang="en" dir="ltr" prefix="content: http://purl.org/rss/1.0/modules/content/ dc: http://purl.org/dc/terms/ foaf: http://xmlns.com/foaf/0.1/ og: http://ogp.me/ns# rdfs: http://www.w3.org/2000/01/rdf-schema# schema: http://schema.org/ sioc: http://rdfs.org/sioc/ns# sioct: http://rdfs.org/sioc/types# skos: http://www.w3.org/2004/02/skos/core# xsd: http://www.w3.org/2001/XMLSchema# " class="js">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
<title>Campaign styles</title>
<link rel="stylesheet" href="https://beta.novascotia.ca/themes/ignition/saltire.css">
<link rel="stylesheet" href="https://novascotia.ca/clf/fonts/font-awesome/css/font-awesome.min.css">
<script src="https://beta.novascotia.ca/core/assets/vendor/modernizr/modernizr.min.js?v=3.3.1"></script>
<style>
.timeline ol {list-style-type: none;padding: 0;}
.timeline .timeline-item {counter-increment: section; margin: 0px 0px;}
.timeline-item .highlighted {background: #ffecad; border-radius: 6px; padding: 2em 2em 1em 2em;}
.timeline ol li {margin: 0;}
.timeline .timeline-item .step-content {
border-left: 1px solid #ccc;
padding-left: 120px;
width: 100%;
position: relative;
padding-right: 15px;
margin-left: 20px;
display:block;
}
.timeline .timeline-item:last-of-type .step-content {border-left: none;}
.timeline .timeline-item .step-content, .timeline .timeline-item .step-icon {padding-bottom: 2em;}
.timeline .timeline-item .step-content .step-counter {
font-weight: bold;
position: absolute;
left: -30px;
background: #333;
color: #fff;
text-align: center;
padding: 10px 10px;
border-radius: 6px;
}
.timeline h3 {margin-top: 0px;}
</style>
<!--[if lte IE 8]>
<script src="https://beta.novascotia.ca/core/assets/vendor/html5shiv/html5shiv.min.js?v=3.7.3"></script>
<![endif]-->
<script src="https://beta.novascotia.ca/core/assets/vendor/modernizr/modernizr.min.js?v=3.3.1"></script>
<link rel="stylesheet" href="https://novascotia.ca/clf/fonts/font-awesome/css/font-awesome.min.css" media="all" />
</head>
<body>
<header>
<div class="container">
<div class="row">
<div class="col-xs-12">
<h1>Campaign content patterns</h1>
</div>
</div>
</div>
</header>
<main>
<div class="container">
<div class="row">
<div class="col-xs-12">
<h2>Date notice</h2>
<p>Date notices are used to communicate when a program/service opens or closes, or deadlines for time sensitive things.</p>
<div class="blockquote-alert">
<p><i class="fa fa-clock-o" aria-hidden="true"></i>Applications open 10 December.</p>
</div>
<hr>
<h2>Timeline</h2>
<p>Timelines should be used to provide a brief overview of events or milestones that happened over time. The label should always be a four digit year, and the description should be brief.</p>
<div class="timeline row">
<ol>
<li class="timeline-item col-md-12">
<div class="step-content col-md-12 col-xs-12">
<span class="step-counter">2018</span>
<h3>Milestone</h3>
<p>Some detail about the milestone reached during this year.</p>
</div>
</li>
<li class="timeline-item col-md-12">
<div class="step-content col-md-12 col-xs-12">
<span class="step-counter">2017</span>
<h3>Milestone</h3>
<p>Some detail about the milestone reached during this year.</p>
</div>
</li>
<li class="timeline-item col-md-12">
<div class="step-content col-md-12 col-xs-12">
<span class="step-counter">2016</span>
<h3>Milestone</h3>
<p>Some detail about the milestone reached during this year.</p>
</div>
</li>
<li class="timeline-item col-md-12">
<div class="step-content col-md-12 col-xs-12">
<span class="step-counter">2014</span>
<h3>Milestone</h3>
<p>Some detail about the milestone reached during this year.</p>
</div>
</li>
</ol>
</div>
<h2>Call to action for an online service</h2>
<p>Online services are prioritized over analog methods. The main call to action is a button that links to the online service, while analog methods are rolled into an accordian.</p>
<h2>Apply online</h2>
<p>When you apply online you need to upload your heating bill or receipt and any supporting documents. You can do this by scanning the documents or taking pictures of them. You also need to provide the signatures of all adults in the application.</p>
<p class="call-to-action-button"><a class="btn-lg btn-success" href="https://harp.novascotia.ca/harp/">Start now <i class="fa fa-arrow-right"></i></a></p>
<div class="otherways-accordion accordion" data-aria-accordion>
<div class="accordion__heading">
Other ways to apply
</div>
<div class="accordion__panel">
<p>You can use the <a href="/sites/default/files/documents/2-264/heating-assistance-rebate-application-form-2018-2019-en.pdf" type="application/pdf">Heating Assistance Rebate Application Form (PDF 692 kB)</a>
if you’re unable to apply online. Send your completed application (both sides of the application), heating bill or receipt, and any other supporting documents by mail or fax. If you’d like to receive a paper application by mail, contact us.</p>
</div>
</div>
<div class="otherways-accordion accordion" data-aria-accordion>
<div class="accordion__heading">
Other ways to apply
</div>
<div class="accordion__panel">
<p>You can use the
<a href="/sites/default/files/documents/2-264/heating-assistance-rebate-application-form-2018-2019-en.pdf" type="application/pdf">Heating Assistance Rebate Application Form (PDF 692 kB)</a>
if you’re unable to apply online. Send your completed application (both sides of the application), heating bill or receipt, and any other supporting documents by mail or fax. If you’d like to receive a paper application by mail, contact us.</p>
</div>
</div>
</div>
</div>
</div>
</main>
<footer></footer>
<script src="https://beta.novascotia.ca/themes/ignition/js/respond.js"></script>
<script src="https://novascotia.ca/clf/scripts/xmld.js"></script>
<script src="https://beta.novascotia.ca/themes/ignition/js/script.min.js"></script>
<script src="https://beta.novascotia.ca/themes/ignition/js/aria.accordion.js"></script>
</body>
</html>