forked from yuannancheng/fictional-university
-
Notifications
You must be signed in to change notification settings - Fork 0
/
interior-page.html
177 lines (161 loc) · 9.52 KB
/
interior-page.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
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Fictional University</title>
<link href="https://fonts.googleapis.com/css?family=Roboto+Condensed:300,300i,400,400i,700,700i|Roboto:100,300,400,400i,700,700i" rel="stylesheet" />
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous" />
<link rel="stylesheet" href="build/index.css" />
<link rel="stylesheet" href="build/style-index.css" />
</head>
<body>
<header class="site-header">
<div class="container">
<h1 class="school-logo-text float-left">
<a href="#"><strong>Fictional</strong> University</a>
</h1>
<span class="js-search-trigger site-header__search-trigger"><i class="fa fa-search" aria-hidden="true"></i></span>
<i class="site-header__menu-trigger fa fa-bars" aria-hidden="true"></i>
<div class="site-header__menu group">
<nav class="main-navigation">
<ul>
<li class="current-menu-item"><a href="#">About Us</a></li>
<li><a href="#">Programs</a></li>
<li><a href="#">Events</a></li>
<li><a href="#">Campuses</a></li>
<li><a href="#">Blog</a></li>
</ul>
</nav>
<div class="site-header__util">
<a href="#" class="btn btn--small btn--orange float-left push-right">Login</a>
<a href="#" class="btn btn--small btn--dark-orange float-left">Sign Up</a>
<span class="search-trigger js-search-trigger"><i class="fa fa-search" aria-hidden="true"></i></span>
</div>
</div>
</div>
</header>
<div class="page-banner">
<div class="page-banner__bg-image" style="background-image: url(images/ocean.jpg)"></div>
<div class="page-banner__content container container--narrow">
<h1 class="page-banner__title">Our History</h1>
<div class="page-banner__intro">
<p>Learn how the school of your dreams got started.</p>
</div>
</div>
</div>
<div class="container container--narrow page-section">
<div class="metabox metabox--position-up metabox--with-home-link">
<p>
<a class="metabox__blog-home-link" href="#"><i class="fa fa-home" aria-hidden="true"></i> Back to About Us</a> <span class="metabox__main">Our History</span>
</p>
</div>
<div class="page-links">
<h2 class="page-links__title"><a href="#">About Us</a></h2>
<ul class="min-list">
<li class="current_page_item"><a href="#">Our History</a></li>
<li><a href="#">Our Goals</a></li>
</ul>
</div>
<div class="generic-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptates vero vel temporibus aliquid possimus, facere accusamus modi. Fugit saepe et autem, laboriosam earum reprehenderit illum odit nobis, consectetur dicta. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos molestiae, tempora alias atque vero officiis sit commodi ipsa vitae impedit odio repellendus doloremque quibusdam quo, ea veniam, ad quod sed.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptates vero vel temporibus aliquid possimus, facere accusamus modi. Fugit saepe et autem, laboriosam earum reprehenderit illum odit nobis, consectetur dicta. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos molestiae, tempora alias atque vero officiis sit commodi ipsa vitae impedit odio repellendus doloremque quibusdam quo, ea veniam, ad quod sed.</p>
</div>
</div>
<div class="page-section page-section--beige">
<div class="container container--narrow generic-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptates vero vel temporibus aliquid possimus, facere accusamus modi. Fugit saepe et autem, laboriosam earum reprehenderit illum odit nobis, consectetur dicta. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos molestiae, tempora alias atque vero officiis sit commodi ipsa vitae impedit odio repellendus doloremque quibusdam quo, ea veniam, ad quod sed.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptates vero vel temporibus aliquid possimus, facere accusamus modi. Fugit saepe et autem, laboriosam earum reprehenderit illum odit nobis, consectetur dicta. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos molestiae, tempora alias atque vero officiis sit commodi ipsa vitae impedit odio repellendus doloremque quibusdam quo, ea veniam, ad quod sed.</p>
</div>
</div>
<div class="page-section page-section--white">
<div class="container container--narrow">
<h2 class="headline headline--medium">Biology Professors:</h2>
<ul class="professor-cards">
<li class="professor-card__list-item">
<a href="#" class="professor-card">
<img class="professor-card__image" src="images/barksalot.jpg" />
<span class="professor-card__name">Dr. Barksalot</span>
</a>
</li>
<li class="professor-card__list-item">
<a href="#" class="professor-card">
<img class="professor-card__image" src="images/meowsalot.jpg" />
<span class="professor-card__name">Dr. Meowsalot</span>
</a>
</li>
</ul>
<hr class="section-break" />
<div class="row group generic-content">
<div class="one-third">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptates vero vel temporibus aliquid possimus, facere accusamus modi. Fugit saepe et autem, laboriosam earum reprehenderit illum odit nobis, consectetur dicta. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos molestiae, tempora alias atque vero officiis sit commodi ipsa vitae impedit odio repellendus doloremque quibusdam quo, ea veniam, ad quod sed.</p>
</div>
<div class="one-third">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptates vero vel temporibus aliquid possimus, facere accusamus modi. Fugit saepe et autem, laboriosam earum reprehenderit illum odit nobis, consectetur dicta. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos molestiae, tempora alias atque vero officiis sit commodi ipsa vitae impedit odio repellendus doloremque quibusdam quo, ea veniam, ad quod sed.</p>
</div>
<div class="one-third">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptates vero vel temporibus aliquid possimus, facere accusamus modi. Fugit saepe et autem, laboriosam earum reprehenderit illum odit nobis, consectetur dicta. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos molestiae, tempora alias atque vero officiis sit commodi ipsa vitae impedit odio repellendus doloremque quibusdam quo, ea veniam, ad quod sed.</p>
</div>
</div>
</div>
</div>
<footer class="site-footer">
<div class="site-footer__inner container container--narrow">
<div class="group">
<div class="site-footer__col-one">
<h1 class="school-logo-text school-logo-text--alt-color">
<a href="#"><strong>Fictional</strong> University</a>
</h1>
<p><a class="site-footer__link" href="#">555.555.5555</a></p>
</div>
<div class="site-footer__col-two-three-group">
<div class="site-footer__col-two">
<h3 class="headline headline--small">Explore</h3>
<nav class="nav-list">
<ul>
<li><a href="#">About Us</a></li>
<li><a href="#">Programs</a></li>
<li><a href="#">Events</a></li>
<li><a href="#">Campuses</a></li>
</ul>
</nav>
</div>
<div class="site-footer__col-three">
<h3 class="headline headline--small">Learn</h3>
<nav class="nav-list">
<ul>
<li><a href="#">Legal</a></li>
<li><a href="#">Privacy</a></li>
<li><a href="#">Careers</a></li>
</ul>
</nav>
</div>
</div>
<div class="site-footer__col-four">
<h3 class="headline headline--small">Connect With Us</h3>
<nav>
<ul class="min-list social-icons-list group">
<li>
<a href="#" class="social-color-facebook"><i class="fa fa-facebook" aria-hidden="true"></i></a>
</li>
<li>
<a href="#" class="social-color-twitter"><i class="fa fa-twitter" aria-hidden="true"></i></a>
</li>
<li>
<a href="#" class="social-color-youtube"><i class="fa fa-youtube" aria-hidden="true"></i></a>
</li>
<li>
<a href="#" class="social-color-linkedin"><i class="fa fa-linkedin" aria-hidden="true"></i></a>
</li>
<li>
<a href="#" class="social-color-instagram"><i class="fa fa-instagram" aria-hidden="true"></i></a>
</li>
</ul>
</nav>
</div>
</div>
</div>
</footer>
<script src="build/index.js"></script>
</body>
</html>