-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathscorecard.html
131 lines (127 loc) · 9.3 KB
/
scorecard.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>WellSAT Home Page</title>
<link rel="stylesheet" href="https://use.typekit.net/crt1krp.css">
<link rel="stylesheet" href="https://use.typekit.net/yvl7cdi.css">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
<link rel="stylesheet" href="css/wellsat.css">
<link rel="stylesheet" href="css/scorecard.css">
</head>
<body>
<header class="grey-background">
<nav class="navbar navbar-expand-lg ">
<div class="container">
<a href="index.html"><h3 class="navbar-brand rund-400 text-red">WellSAT</h3></a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item frank-400">
<a class="nav-link" href="index.html">Home</a>
</li>
<li class="nav-item frank-400">
<a class="nav-link" href="about.html">About</a>
</li>
<li class="nav-item frank-400">
<a class="nav-link" href="triennial.html">Triennial Assessment</a>
</li>
<li class="nav-item frank-400">
<a class="nav-link" href="resources.html">Resources</a>
</li>
<li class="nav-item frank-400">
<a class="nav-link" href="faq.html">FAQ</a>
</li>
<li class="nav-item frank-400">
<a class="nav-link" href="contact.html">Contact</a>
</li>
</ul>
<div class="d-flex">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item frank-400">
<a class="nav-link" href="dashboard.html">Dashboard</a>
</li>
<li class="nav-item frank-400">
<a class="nav-link" href="log_in.html">Log In</a>
</li>
</ul>
<button class="frank-400 text-red register"><a href="register.html">Register</a></button>
</div>
</div>
</div>
</nav>
</header>
<main>
<section class="policy-info container">
<div>
<h1 class="rund-400 score-heading">Your District's Scorecard</h1>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" style="width: 30px; fill: #cb2c3b;"><path d="M0 64C0 28.7 28.7 0 64 0L224 0l0 128c0 17.7 14.3 32 32 32l128 0 0 144-208 0c-35.3 0-64 28.7-64 64l0 144-48 0c-35.3 0-64-28.7-64-64L0 64zm384 64l-128 0L256 0 384 128zM176 352l32 0c30.9 0 56 25.1 56 56s-25.1 56-56 56l-16 0 0 32c0 8.8-7.2 16-16 16s-16-7.2-16-16l0-48 0-80c0-8.8 7.2-16 16-16zm32 80c13.3 0 24-10.7 24-24s-10.7-24-24-24l-16 0 0 48 16 0zm96-80l32 0c26.5 0 48 21.5 48 48l0 64c0 26.5-21.5 48-48 48l-32 0c-8.8 0-16-7.2-16-16l0-128c0-8.8 7.2-16 16-16zm32 128c8.8 0 16-7.2 16-16l0-64c0-8.8-7.2-16-16-16l-16 0 0 96 16 0zm80-112c0-8.8 7.2-16 16-16l48 0c8.8 0 16 7.2 16 16s-7.2 16-16 16l-32 0 0 32 32 0c8.8 0 16 7.2 16 16s-7.2 16-16 16l-32 0 0 48c0 8.8-7.2 16-16 16s-16-7.2-16-16l0-64 0-64z"/></svg>
</div>
<h2 class="frank-400">Policy Assessment Name: <span style="color: #cb2c3b;">Assessment Test 1 (10/2024)</span></h2>
<h2 class="frank-400">District Name: <span style="color: #cb2c3b;">Test District</span></h2>
<p class="roboto-400">Congratulations! You have completed the WellSAT. Check out your scorecard below. It contains details of how you scored on each item and section of the assessment. It also provides resources that will help you improve your district’s school wellness policy.</p>
<p class="roboto-400">Items with a rating of “0” (item not addressed in the policy) or “1” (general or weak statement addressing the item) can be improved by referring to the resource links next to the items. Multiple resources addressing school wellness policy topics are available online. To avoid duplicative information, we have included a small selection, rather than a comprehensive listing.</p>
</section>
<section class="table-sect container">
<table class="table-header">
<thead>
<tr>
<th class="align-left"><h2 class="frank-400">Section 1. Federal Requirements</h2></th>
<th class="align-right"><h3 class="frank-400">Rating</h3></th>
</tr>
</thead>
</table>
<table>
<tbody>
<tr class="content-row">
<td class="align-center"><p class="frank-400">FR3</p></td>
<td class="align-left">
<p class="roboto-400"><img src="images/federal_requirement.png" alt="" style="width:15px; margin-right: 4px;">Lorem ipsum dolor sit amet consectetur adipisicing elit. Ea quibusdam voluptatum expedita sunt. Reiciendis doloremque autem ducimus ipsum. Unde voluptatibus corporis inventore mollitia rerum? Consequuntur commodi quae dicta tenetur suscipit.</p>
</td>
<td class="align-center"><p class="frank-400" style="color: #cb2c3b;">1</p></td>
</tr>
<tr class="content-row">
<td class="align-center"><p class="frank-400">FR3</p></td>
<td class="align-left"><p class="roboto-400">Lorem ipsum dolor sit amet consectetur adipisicing elit. Ea quibusdam voluptatum expedita sunt. Reiciendis doloremque autem ducimus ipsum. Unde voluptatibus corporis inventore mollitia rerum? Consequuntur commodi quae dicta tenetur suscipit.</p></td>
<td class="align-center"><p class="frank-400" style="color: #cb2c3b;">1</p></td>
</tr>
<tr class="content-row">
<td class="align-center"><p class="frank-400">FR3</p></td>
<td class="align-left"><p class="roboto-400">Lorem ipsum dolor sit amet consectetur adipisicing elit. Ea quibusdam voluptatum expedita sunt. Reiciendis doloremque autem ducimus ipsum. Unde voluptatibus corporis inventore mollitia rerum? Consequuntur commodi quae dicta tenetur suscipit.</p></td>
<td class="align-center" style="background-color: #FFEBED;"><p class="frank-400" style="color: #cb2c3b;">0</p></td>
</tr>
<tr class="content-row">
<td class="align-center"><p class="frank-400">FR3</p></td>
<td class="align-left"><p class="roboto-400">Lorem ipsum dolor sit amet consectetur adipisicing elit. Ea quibusdam voluptatum expedita sunt. Reiciendis doloremque autem ducimus ipsum. Unde voluptatibus corporis inventore mollitia rerum? Consequuntur commodi quae dicta tenetur suscipit.</p></td>
<td class="align-center"><p class="frank-400" style="color: #cb2c3b;">1</p></td>
</tr>
<tr class="content-row">
<td class="align-center"><p class="frank-400">FR3</p></td>
<td class="align-left"><p class="roboto-400">Lorem ipsum dolor sit amet consectetur adipisicing elit. Ea quibusdam voluptatum expedita sunt. Reiciendis doloremque autem ducimus ipsum. Unde voluptatibus corporis inventore mollitia rerum? Consequuntur commodi quae dicta tenetur suscipit.</p></td>
<td class="align-center"><p class="frank-400" style="color: #cb2c3b;">1</p></td>
</tr>
</tbody>
</table>
</section>
</main>
<footer>
<div class="container" style="padding-top:50px;padding-bottom:50px;">
<div class="row align-items-center">
<div class="col text-center">
<img src="images/RUDD_logo.png" alt="Rudd Center Logo" id="rudd-logo" height="150px;">
</div>
<div class="col text-center">
<img src="images/CSCH_logo.png" alt="CSCH Logo" id="csch-logo" height="150px;">
</div>
<div class="col text-center">
<img src="images/UCONN_logo.png" alt="UConn Logo" id="uconn-logo" height="80px;">
</div>
</div>
</div>
</footer>
</body>
</html>