-
Notifications
You must be signed in to change notification settings - Fork 5
/
Copy pathindex.html
64 lines (54 loc) · 2.27 KB
/
index.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>UCSF Banners Demo Page</title>
<style type="text/css" media="all">
body {
background: #fff;
padding: 0;
margin: 0;
}
</style>
<link rel="stylesheet" href="banners.css">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/styles/default.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/highlight.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
</head>
<body>
<div id="ucsf-banner-nav" class="no-logo">
<div class="top-header-container row">
<ul class="menu">
<li class="first"><a href="http://www.ucsf.edu">University of California San Francisco</a></li>
<li><a href="http://www.ucsfhealth.org/">UCSF Medical Center</a></li>
<li><a href="http://www.ucsf.edu/search" title="">Search UCSF</a></li>
<li><a href="http://www.ucsf.edu/about">About UCSF</a></li>
</ul>
</div>
</div>
<h1>UCSF Banner Navigation - Demo</h1>
<p>Use these controls to alter the color, font and logo of the banner above.</p>
<form>
<label for="color-options">Color</label>
<select id="color-options" name="colors">
<option value="">Navy</option>
<option value="teal">Teal</option>
<option value="light-blue">Blue</option>
<option value="purple">Purple</option>
<option value="grey">Grey</option>
</select>
<label for="font-options">Font</label>
<select id="font-options" name="fonts">
<option value="">Helvetica Neue</option>
<option value="arial">Arial</option>
</select>
<label for="logo-enabled">No Logo</label>
<input type="checkbox" name="logo-checkbox" id="logo-enabled" checked="checked" />
</form>
<p>Banner markup:</p>
<pre id="code-snippet-container"><code class="html" id="code-snippet"></code></pre>
<p>Please see the <a href="http://github.com/ucsf-web-services/ucsf_identity_web_banner_templates">project page</a>
for further information.</p>
<script src="banner.js"></script>
</body>
</html>