-
Notifications
You must be signed in to change notification settings - Fork 0
/
articles-inner.html
201 lines (168 loc) · 12.1 KB
/
articles-inner.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
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
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="../../favicon.ico">
<link rel="canonical" href="https://getbootstrap.com/docs/3.3/examples/navbar-static-top/">
<title>Division of Student Affairs - New Brunswick</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
<!-- Custom styles for this template -->
<link href="css/custom-styles.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!--Header is pulled from header.html-->
<div w3-include-html="header.html"></div>
<div class="container SA-main-content">
<div class="row">
<div class="col-md-12">
<h1 style="margin-bottom: 0px !important; ">This is the Article Title (Or is it?)</h1>
<p><i>February 30, 2019</i></p>
<ol class="breadcrumb SA-breadcrumbs">
<li><a href="#">Main Page</a></li>
<li><a href="#">Page</a></li>
<li><a href="#">Page</a></li>
<li class="active">Accordions</li>
</ol>
</div>
</div>
</div>
<div class="container">
<div class="row SA-featured-content">
<div class="col-md-6 col-md-push-3"> <!-- Add col-md-push-3 when sidebars are enabled -->
<img src="https://picsum.photos/1280/720?random=1" class="img-responsive">
<br>
<br>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque molestie felis nec luctus ultricies. Suspendisse dictum porttitor congue. Donec aliquet, erat quis dapibus interdum, ligula lorem suscipit ipsum, tempor finibus ex mi sed nulla. Praesent massa nisi, mollis vehicula ultricies id, vestibulum aliquet velit. Maecenas euismod mattis velit et aliquet. Etiam laoreet sed tortor ut accumsan. Vivamus faucibus et nibh quis vestibulum. Proin molestie massa ut augue dapibus, vel aliquet mi rhoncus. Etiam bibendum mi quis justo commodo, ac imperdiet odio lacinia. Pellentesque massa felis, tempus at nunc quis, gravida ullamcorper lectus.</p>
<h4>Adipiscing elit</h4>
<p>Aliquam velit tellus, vulputate sed cursus ut, rutrum ut diam. Maecenas quis dolor ut est molestie venenatis. Ut orci lorem, eleifend at porta at, iaculis ut purus. Aliquam pretium ac ligula quis convallis. Vivamus et dui id felis aliquam porttitor. Phasellus varius gravida libero in lacinia. Aenean mauris quam, feugiat a sem id, dignissim tempus nulla. Integer congue quam quis nibh maximus, in congue nisi hendrerit. Nulla facilisi.</p>
<H4>Maecenas viverra sem vel interdum faucibus?</H4>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Integer laoreet quam urna, molestie fermentum turpis auctor ut. Maecenas non turpis at nunc vulputate iaculis ac eget sapien. Cras pulvinar, erat at vulputate interdum, orci est porta lacus, sit amet consequat enim arcu eget elit. Suspendisse mollis odio id sapien vulputate placerat. Praesent tempor vestibulum metus at bibendum. Pellentesque ut rhoncus sem, sit amet elementum ipsum. Phasellus dictum vehicula ipsum ut maximus. Duis lacinia, neque quis hendrerit luctus, velit quam finibus mauris, quis tempor sapien magna at mi. In convallis tortor non metus lacinia suscipit.</p>
<img src="https://picsum.photos/1280/720?random=2" class="img-responsive">
<h4>Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</h4>
<p>Pellentesque varius, ex non tincidunt euismod, urna ante mollis tellus, id aliquam sapien libero eu tortor. Duis et risus dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Maecenas viverra sem vel interdum faucibus. Sed ut augue non lectus pellentesque ullamcorper. Etiam sagittis nisl quis purus pulvinar rutrum. Donec consectetur arcu mauris, vitae mollis risus ornare vel. Integer euismod mi vel mi porta, vitae accumsan justo tincidunt. Vivamus lobortis lectus quis semper tincidunt. Quisque condimentum tellus ac leo pulvinar, convallis interdum erat elementum. Nunc varius ultrices enim, vitae imperdiet lorem vulputate sit amet. Praesent molestie nibh malesuada augue vulputate, non luctus odio vulputate. Vivamus molestie leo at lacinia volutpat.</p>
<h4>Etiam laoreet sed tortor ut accumsan. Vivamus faucibus et nibh quis vestibulum. Proin molestie massa ut augue dapibus, vel aliquet mi rhoncus.</h4>
<p>Nullam vel convallis dui. Nullam viverra eros sit amet iaculis gravida. Pellentesque rutrum venenatis magna vitae blandit. Interdum et malesuada fames ac ante ipsum primis in faucibus. Integer laoreet, lectus vel feugiat fermentum, nunc leo imperdiet orci, at maximus lacus leo in quam. Curabitur leo ipsum, cursus et elit at, pharetra dignissim velit. Sed mattis in enim in molestie.</p>
<img src="https://picsum.photos/1280/720?random=3" class="img-responsive">
<h4>Proin auctor lacus eu nunc congue maximus.</h4>
<p>Integer ultrices, nisl sit amet ornare tempus, nisl dolor consectetur magna, semper condimentum mauris est at urna. Nullam varius euismod justo a faucibus. Phasellus consequat quis neque vitae suscipit. Maecenas eu quam tincidunt, scelerisque mauris a, tempus erat. Quisque quis ullamcorper libero. Praesent finibus quam vestibulum tortor vulputate suscipit. Integer ut libero dignissim, elementum odio eget, venenatis risus. Pellentesque at libero nibh. Aenean maximus sem tellus, a finibus urna luctus ut. Integer consequat gravida urna eu dignissim. In ullamcorper pellentesque molestie. Pellentesque blandit eget nunc eu venenatis.</p>
<br>
<p><i>For more information, please visit: <a href="#" class="href-styles">lorem.rutgers.edu</a></i></p>
<br>
<div class= "row SA-featured-content">
<a href="" class="font-social"><i class="fas fa-tag"></i></a>
<a href="#" class="href-styles">Category 1</a>, <a href="#" class="href-styles">Category 2</a>, <a href="#" class="href-styles">Category 3</a>, <a href="#" class="href-styles">Category 4</a>
</div>
<hr>
<div class="about-sa">
<h2>ABOUT THE DIVISION OF STUDENT AFFAIRS AT RUTGERS–NEW BRUNSWICK</h2>
<p><em>Comprised of 26 departments, the Division of Student Affairs is committed to facilitating interactions that promote students' success and their personal and professional development. <br><a href="#">Learn more about our mission.</a> </em></p>
</div>
</div><!-- /col -->
<div class="col-md-3 col-md-pull-6 SA-left-sidebar">
<div class="SA-left-sidebar-content">
<h3>More Stories</h3>
<ul>
<li>
<div class="SA-mini-articles-block">
<a href="#"><img src="https://picsum.photos/id/1015/240/200" class="img-responsive" alt="Featured"></a>
<h3><a href="">Big News! Click Here!</a></h3>
</div>
</li>
<li>
<div class="SA-mini-articles-block">
<a href="#"><img src="https://picsum.photos/id/1036/240/200" class="img-responsive" alt="Featured"></a>
<h3><a href="">Small News, Don't Click here</a></h3>
</div>
</li>
<li>
<div class="SA-mini-articles-block">
<a href="#"><img src="https://picsum.photos/id/1039/240/200" class="img-responsive" alt="Featured"></a>
<h3><a href="">Lorem Ipsum Dolor Sit Amet</a></h3>
</div>
</li>
<li>
<div class="SA-mini-articles-block">
<a href="#"><img src="https://picsum.photos/id/1045/240/200" class="img-responsive" alt="Featured"></a>
<h3><a href="">There's a U in Rutgers</a></h3>
</div>
</li>
<li>
<div class="SA-mini-articles-block">
<a href="#"><img src="https://picsum.photos/id/1022/240/200" class="img-responsive" alt="Featured"></a>
<h3><a href="">Big if True!</a></h3>
</div>
</li>
</ul>
</div>
</div>
<div class="col-md-3 SA-right-sidebar">
<div class="SA-right-sidebar-content">
<h3>Share This Story</h3>
<a href="#" class="font-social">
<i class="fab fa-facebook-f"></i>
</a>
<a href="#" class="font-social">
<i class="fab fa-twitter"></i>
</a>
<a href="#" class="font-social">
<i class="fab fa-instagram"></i>
</a>
<a href="#" class="font-social">
<i class="fab fa-linkedin-in"></i>
</a>
<a href="#" class="font-social">
<i class="fab fa-reddit-alien"></i>
</a>
<a href="#" class="font-social">
<i class="fas fa-print"></i>
</a>
<a href="#" class="font-social">
<i class="fas fa-envelope"></i>
</a>
<!--Support our Students blurb and Button-->
<div class="SA-right-sidebar-support">
<p>
Financial support from alumni, parents, and friends help us create the innovative learning opportunities that challenge students to be their best at Rutgers and beyond.
</p>
<div class="col-md-3">
<a class="btn btn-default SA-btn-primary" href="#" role="button">Giving</a>
</div>
</div>
</div><!-- /SA-events-listing -->
</div>
</div><!-- /row -->
</div><!-- /container /SA-main-content -->
<!--Footer is pulled from footer.html-->
<div w3-include-html="footer.html"></div>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery.min.js"><\/script>')</script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="js/ie10-viewport-bug-workaround.js"></script>
<script type="text/javascript" src="js/custom-scripts.js"></script>
<script type="text/javascript" src="js/bootstrap-tabcollapse.js"></script>
<script type="text/javascript">
//Imports Header and Footer sections from their .html files
includeHTML();
$('#myTab').tabCollapse();
</script>
</body>
</html>