-
Notifications
You must be signed in to change notification settings - Fork 25
Expand file tree
/
Copy pathpullquote.html
More file actions
83 lines (71 loc) · 4.39 KB
/
pullquote.html
File metadata and controls
83 lines (71 loc) · 4.39 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
<!DOCTYPE html>
<!--[if IE 7]> <html lang="en" class="lt-ie9 lt-ie8 no-js"> <![endif]-->
<!--[if IE 8]> <html lang="en" class="lt-ie9 no-js"> <![endif]-->
<!--[if gt IE 8]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
<head>
<meta charset=utf-8 />
<meta name="author" content="UCL" />
<meta name="description" content="UCL Homepage" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<!-- social meta -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@uclnews">
<meta name="twitter:title" content="UCL - London's Global University">
<meta name="twitter:description" content="UCL (University College London) is London's leading multidisciplinary university, with 8,000 staff and 25,000 students.">
<meta name="twitter:creator" content="@UCLWAMS">
<meta name="twitter:image:src" content="http://www.ucl.ac.uk/visual-identity/logos/standalone.png">
<meta property="og:image" content="http://www.ucl.ac.uk/visual-identity/logos/standalone.png" />
<meta property="og:title" content="UCL - London's Global University" />
<meta property="og:url" content="http://www.ucl.ac.uk" />
<meta property="og:site_name" content="UCL" />
<meta property="og:description" content="UCL (University College London) is London's leading multidisciplinary university, with 8,000 staff and 25,000 students." />
<meta property="og:type" content="website" />
<meta property="og:profile_id" content="uclofficial" />
<!-- end social meta -->
<title>UCL Design Language</title>
<link href="//static.ucl.ac.uk/indigo/css/screen.min.css" media="screen, projection" rel="stylesheet" type="text/css" />
<!--[if IE]><link href="//static.ucl.ac.uk/indigo/css/ie.min.css" rel="stylesheet" /><![endif]-->
<!--[if lt IE 8]><link href="//static.ucl.ac.uk/indigo/css/ie-old.min.css" rel="stylesheet" /><![endif]-->
<link rel="shortcut icon" href="//static.ucl.ac.uk/indigo/images/favicon.ico" />
<link rel="apple-touch-icon-precomposed" href="favicon-152.png">
<meta name="msapplication-TileColor" content="#000000">
<meta name="msapplication-TileImage" content="favicon-144.png">
<script src="//static.ucl.ac.uk/indigo/js/lib/modernizr-custom.js"></script>
<script>
var cuttingTheMustard = document.querySelector && window.localStorage && window.addEventListener;
Modernizr.load({
//cutting the mustard as used by the BBC
test: cuttingTheMustard
//if old browser load the shiv
,
nope: [
'//static.ucl.ac.uk/indigo/js/lib/html5shiv-printshiv.min.js', '//static.ucl.ac.uk/indigo/js/lib/respond.min.js'
]
});
//set conditional assets for main.js
var globalSiteSpecificVars = {
pathToJquery: '//static.ucl.ac.uk/indigo/js/lib/jquery-1.9.1.min',
googleAnalyticsIdsArray: [] //specify array of site specific id's NOT UCL generic UA-943297-1
}
if (cuttingTheMustard) {
globalSiteSpecificVars.pathToJquery = "//static.ucl.ac.uk/indigo/js/lib/jquery-2.1.1.min";
}
</script>
<script src="//static.ucl.ac.uk/indigo/js/lib/require.min.js"></script>
<script src="//static.ucl.ac.uk/indigo/js/main.js"></script>
<script>
require(["app/general"]); //load the default stuff
</script>
</head>
<body id="pullquote-view" class="layout-vertical layout-vertical--nav-2col
">
<blockquote class="pull-quote__wrap clearfix">
<span class="pull-quote__start">"</span>We used to use blockquote elements to house our pullquotes and apply the necessary class. This is still supported but we are now suggesting to use the aside element...Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
</blockquote>
<aside class="pull-quote__wrap clearfix">
<span class="pull-quote__start">"</span>We are now using the aside element when creating pullquotes. We also keep a quotation mark in the semantics for speech browsers to interpret...Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur.
</aside>
</body>
</html>