Skip to content

Commit 4812b42

Browse files
c-wc-w
authored
Remove fullpage.js (#18)
1 parent 5d2baa7 commit 4812b42

6 files changed

Lines changed: 64 additions & 105 deletions

File tree

‎README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,4 +4,4 @@
44

55
Public information site for Ascoderu, hosted via Github-Pages and Cloudflare at [ascoderu.ca](https://ascoderu.ca).
66

7-
Built with [Bootstrap](http://getbootstrap.com/docs/3.3/) and [FullPage](https://alvarotrigo.com/fullPage/).
7+
Built with [Bootstrap](http://getbootstrap.com/docs/3.3/) and 🧡.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
"private": true,
88
"scripts": {
99
"deploy": "gh-pages --silent --dist src --branch master --repo \"https://${GITHUB_TOKEN}@github.com/${TRAVIS_REPO_SLUG}\"",
10-
"lint.css": "csslint src/style.css",
10+
"lint.css": "csslint src",
1111
"lint.html": "htmllint src/index.html",
1212
"lint.js": "eslint --max-warnings=0 src/script.js",
1313
"lint": "run-s lint.html lint.css lint.js",

‎src/index.html‎

Lines changed: 34 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -15,14 +15,11 @@
1515
<meta property="og:image:height" content="630">
1616
<meta property="fb:app_id" content="397128703965407">
1717
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
18-
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.8.9/jquery.fullPage.min.css">
1918
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css">
2019
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap3-dialog/1.34.7/css/bootstrap-dialog.min.css">
2120
<link rel="stylesheet" href="style.css">
2221
</head>
23-
<body>
24-
25-
<div id="website-content" class="hidden">
22+
<body class="loading">
2623

2724
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
2825
<div class="container-fluid">
@@ -38,19 +35,19 @@
3835

3936
<div class="collapse navbar-collapse medium">
4037
<ul class="nav navbar-nav navbar-right" id="navbar-menu">
41-
<li data-menuanchor="home-page" class="active"><a href="#home-page">Home</a></li>
42-
<li data-menuanchor="history"><a href="#history">History</a></li>
43-
<li data-menuanchor="lokole"><a href="#lokole">Lokole</a></li>
44-
<li data-menuanchor="help-us"><a href="#help-us">Help us</a></li>
45-
<li data-menuanchor="news"><a href="#news">News</a></li>
46-
<li data-menuanchor="contact"><a href="#contact">Contact us</a></li>
38+
<li class="active"><a href="#home-page">Home</a></li>
39+
<li><a href="#history">History</a></li>
40+
<li><a href="#lokole">Lokole</a></li>
41+
<li><a href="#help-us">Help us</a></li>
42+
<li><a href="#news">News</a></li>
43+
<li><a href="#contact">Contact us</a></li>
4744
</ul>
4845
</div>
4946
</div>
5047
</nav>
5148

52-
<div id="fullpage">
53-
<div class="section" data-anchor="home-page" id="home">
49+
<main>
50+
<section class="fullpage" id="home-page">
5451

5552
<div class="container-fluid text-white">
5653
<h1 class="extra-large no-style">LOKOLE: EMAIL FOR ALL</h1>
@@ -64,18 +61,12 @@ <h1 class="extra-large no-style">LOKOLE: EMAIL FOR ALL</h1>
6461
by improving education, health services and economic opportunities
6562
</p>
6663
</div>
64+
</section>
6765

68-
<div class="transparent-section-footer">
69-
<a href="#history" class="btn btn-lg btn-next" data-toggle="tooltip" title="next page" data-placement="left">
70-
<span class="glyphicon glyphicon-menu-down"></span>
71-
</a>
72-
</div>
73-
</div>
74-
75-
<div class="section" data-anchor="history">
66+
<section id="history">
7667
<div class="container-fluid row-layout" id="history-convert">
7768

78-
<img data-src="static/nzola.jpg" class="img-thumbnail img-responsive" id="about-img" alt="Photo of Nzola" />
69+
<img src="static/nzola.jpg" class="img-thumbnail img-responsive" id="about-img" alt="Photo of Nzola" />
7970
<div class="medium" id="modals">
8071

8172
<div class="thumbnail" rel="modal" id="info1" data-toggle="tooltip" title="more history" data-reference="modal-1-content" data-title="The foundations that led to Ascoderu">
@@ -128,15 +119,9 @@ <h1 class="extra-large no-style">LOKOLE: EMAIL FOR ALL</h1>
128119
</div>
129120

130121
</div>
122+
</section>
131123

132-
<div class="transparent-section-footer">
133-
<a href="#lokole" class="btn btn-lg btn-next" data-toggle="tooltip" title="next page" data-placement="left">
134-
<span class="glyphicon glyphicon-menu-down"></span>
135-
</a>
136-
</div>
137-
</div>
138-
139-
<div class="section" data-anchor="lokole">
124+
<section id="lokole">
140125
<div class="container-fluid">
141126
<div class="extra-large">LOKOLE</div>
142127
<div id="lokole-intro"><strong>Lokole</strong> is our custom software-and-hardware device built in early 2017.
@@ -183,7 +168,7 @@ <h1 class="extra-large no-style">LOKOLE: EMAIL FOR ALL</h1>
183168

184169
</table>
185170
</div>
186-
<img data-src="static/lokole.jpg" class="img-thumbnail img-responsive" id="lokole-img" alt="Image of a Lokole device" />
171+
<img src="static/lokole.jpg" class="img-thumbnail img-responsive" id="lokole-img" alt="Image of a Lokole device" />
187172
<div class="table-responsive">
188173
<table class="table table-condensed table-bordered" id="upgrade-cost">
189174
<caption>Approx upgrades price</caption>
@@ -221,14 +206,9 @@ <h1 class="extra-large no-style">LOKOLE: EMAIL FOR ALL</h1>
221206
</div>
222207

223208
</div>
224-
<div class="transparent-section-footer">
225-
<a href="#help-us" class="btn btn-lg btn-next" data-toggle="tooltip" title="next page" data-placement="left">
226-
<span class="glyphicon glyphicon-menu-down"></span>
227-
</a>
228-
</div>
229-
</div>
209+
</section>
230210

231-
<div class="section" data-anchor="help-us">
211+
<section id="help-us">
232212
<div class="container-fluid">
233213
<p class="extra-large">Do you want to help us?</p>
234214
<div class="row-wrap-layout">
@@ -265,15 +245,9 @@ <h1 class="extra-large no-style">LOKOLE: EMAIL FOR ALL</h1>
265245
</a>
266246

267247
</div>
268-
<div class="transparent-section-footer">
269-
<a href="#news" class="btn btn-lg btn-next" data-toggle="tooltip" title="next page" data-placement="left">
270-
<span class="glyphicon glyphicon-menu-down"></span>
271-
</a>
272-
273-
</div>
274-
</div>
248+
</section>
275249

276-
<div class="section" data-anchor="news">
250+
<section id="news">
277251
<div class="container-fluid">
278252
<p class="large">What do people say about us?</p>
279253
<a class="no-style" href="https://user-images.githubusercontent.com/1086421/65366066-2d954480-dbed-11e9-977d-a4c309edc4cc.png" target="_blank" rel="noopener">
@@ -344,15 +318,9 @@ <h1 class="extra-large no-style">LOKOLE: EMAIL FOR ALL</h1>
344318
</div>
345319
</a>
346320
</div>
321+
</section>
347322

348-
<div class="transparent-section-footer">
349-
<a href="#contact" class="btn btn-lg btn-next" data-toggle="tooltip" title="next page" data-placement="left">
350-
<span class="glyphicon glyphicon-menu-down"></span>
351-
</a>
352-
</div>
353-
</div>
354-
355-
<div class="section" data-anchor="contact">
323+
<section id="contact">
356324
<div class="container-fluid">
357325
<p class="large">Any question? Any proposal?</p>
358326
<p class="medium">
@@ -362,7 +330,7 @@ <h1 class="extra-large no-style">LOKOLE: EMAIL FOR ALL</h1>
362330
<div class="row-wrap-layout">
363331
<div class="text-left vertical-layout" id="members-team">
364332
<div class="contact-email-block row-layout">
365-
<img data-src="static/profile/nzola.png" class="img-circle img-responsive" id="nzola-profile" alt="Portrait of Nzola Swasisa">
333+
<img src="static/profile/nzola.png" class="img-circle img-responsive" id="nzola-profile" alt="Portrait of Nzola Swasisa">
366334
<div class="member-contact">
367335
<div><strong>Nzola Swasisa</strong>, <em>Founder &amp; CEO</em></div>
368336
<div>
@@ -374,7 +342,7 @@ <h1 class="extra-large no-style">LOKOLE: EMAIL FOR ALL</h1>
374342
</div>
375343

376344
<div class="contact-email-block row-layout">
377-
<img data-src="static/profile/clemens.png" class="img-circle img-responsive" id="clemens-profile" alt="Portrait of Clemens Wolff">
345+
<img src="static/profile/clemens.png" class="img-circle img-responsive" id="clemens-profile" alt="Portrait of Clemens Wolff">
378346
<div class="member-contact">
379347
<div><strong>Clemens Wolff</strong>, <em>Technical Advisor</em></div>
380348
<div>
@@ -386,7 +354,7 @@ <h1 class="extra-large no-style">LOKOLE: EMAIL FOR ALL</h1>
386354
</div>
387355

388356
<div class="contact-email-block row-layout">
389-
<img data-src="static/profile/laura.jpg" class="img-circle img-responsive" id="laura-profile" alt="Portrait of Laura Barluzzi">
357+
<img src="static/profile/laura.jpg" class="img-circle img-responsive" id="laura-profile" alt="Portrait of Laura Barluzzi">
390358
<div class="member-contact">
391359
<div><strong>Laura Barluzzi</strong>, <em>Web Developer</em></div>
392360
<div>
@@ -399,23 +367,25 @@ <h1 class="extra-large no-style">LOKOLE: EMAIL FOR ALL</h1>
399367
</div>
400368

401369
<div id="image-team">
402-
<img data-src="static/team.jpg" class="img-thumbnail img-responsive" alt="Portrait of Ascoderu team" />
370+
<img src="static/team.jpg" class="img-thumbnail img-responsive" alt="Portrait of Ascoderu team" />
403371
</div>
404372

405373
</div>
406374
</div>
407-
<div class="footer-fixed-bottom extra-small">
408-
ASCODERU (<em>Action Swasisa Pour la Connexion et le Developement Rural</em>) &mdash; 1155 Bombardier Crescent, Victoria, BC, V9B 0R4 CANADA &mdash; www.ascoderu.ca
409-
</div>
410-
</div>
375+
</section>
376+
377+
</main>
411378

412-
</div>
413-
</div>
379+
<footer class="footer-fixed-bottom extra-small">
380+
ASCODERU (<em>Action Swasisa Pour la Connexion et le Developement Rural</em>) &mdash; 1155 Bombardier Crescent, Victoria, BC, V9B 0R4 CANADA &mdash; www.ascoderu.ca
381+
</footer>
414382

415383
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
416384
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
417-
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.8.9/jquery.fullPage.min.js"></script>
418385
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap3-dialog/1.34.7/js/bootstrap-dialog.min.js"></script>
419386
<script src="script.js"></script>
387+
<noscript>
388+
<link rel="stylesheet" href="noscript.css">
389+
</noscript>
420390
</body>
421391
</html>

‎src/noscript.css‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.loading {
2+
display: block;
3+
}

‎src/script.js‎

Lines changed: 6 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,5 @@
11
(function($, BootstrapDialog) {
22

3-
function setUpFullpage() {
4-
$('#fullpage').fullpage({
5-
anchors: ['home-page', 'history', 'lokole', 'help-us', 'news', 'contact'],
6-
menu: '#navbar-menu',
7-
paddingTop: '80px',
8-
paddingBottom: '60px',
9-
responsiveHeight: 600,
10-
afterRender: function() {
11-
$('#website-content').removeClass('hidden');
12-
}
13-
});
14-
}
15-
163
function assignModalTitleAndContent($clicked) {
174
var clickedModalId = $clicked.data('reference');
185
var contentModalHtml = $('#' + clickedModalId).html();
@@ -24,11 +11,15 @@
2411
}
2512

2613
$(document).ready(function() {
14+
$('section.fullpage').css('height', $(window).height() + 'px');
2715

28-
setUpFullpage();
16+
$('body').scrollspy({ target: '.navbar-collapse', offset: 100 });
2917

3018
$('.navbar-nav li a').click(function() {
3119
$('.navbar-collapse').collapse('hide');
20+
$('.navbar-nav').find('.active').removeClass('active');
21+
$(this).parent().addClass('active');
22+
$('body, html').animate({ scrollTop: $($(this).attr('href')).offset().top - 70 }, 400);
3223
});
3324

3425
$('[data-toggle="tooltip"]').tooltip();
@@ -37,6 +28,7 @@
3728
assignModalTitleAndContent($(this));
3829
});
3930

31+
$('body').removeClass('loading');
4032
});
4133

4234
})(window.jQuery, window.BootstrapDialog);

‎src/style.css‎

Lines changed: 19 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ body {
22
background-color: #dfe2db;
33
color: #191919;
44
font-size: 16px;
5-
overflow-y: hidden;
5+
position: relative;
66
text-align: center;
77
}
88

@@ -14,8 +14,19 @@ caption {
1414
color: #454545;
1515
}
1616

17+
.loading {
18+
display: none;
19+
}
20+
1721
/* LAYOUTS */
1822

23+
section {
24+
align-items: center;
25+
display: flex;
26+
justify-content: center;
27+
min-height: 500px;
28+
}
29+
1930
.row-layout {
2031
align-content: center;
2132
align-items: center;
@@ -67,6 +78,10 @@ caption {
6778

6879
/* NAVBAR */
6980

81+
nav + main {
82+
padding-top: 70px;
83+
}
84+
7085
.navbar-fixed-top.navbar-fixed-top {
7186
background-color: #191919;
7287
border-width: 0;
@@ -107,15 +122,6 @@ caption {
107122

108123
/* FOOTERS */
109124

110-
.transparent-section-footer {
111-
bottom: 0;
112-
height: auto;
113-
padding-bottom: 15px;
114-
position: absolute;
115-
text-align: center;
116-
width: 100%;
117-
}
118-
119125
.btn-next {
120126
background-color: #dfe2db;
121127
border-radius: 50%;
@@ -146,7 +152,6 @@ h1.no-style {
146152

147153
.footer-fixed-bottom.footer-fixed-bottom {
148154
background-color: #191919;
149-
bottom: 0;
150155
color: #dfe2db;
151156
height: auto;
152157
padding-bottom: 10px;
@@ -158,15 +163,15 @@ h1.no-style {
158163

159164
/* #home-page */
160165

161-
#home {
166+
#home-page {
162167
background-image: url('static/home-page-bg.jpg');
163168
background-position: center center;
164169
background-repeat: no-repeat;
165170
background-size: cover;
166171
}
167172

168-
#home a:hover,
169-
#home a:focus {
173+
#home-page a:hover,
174+
#home-page a:focus {
170175
color: white;
171176
}
172177

@@ -266,15 +271,4 @@ h1.no-style {
266271
flex-wrap: wrap;
267272
justify-content: center;
268273
}
269-
270-
.transparent-section-footer.transparent-section-footer,
271-
.footer-fixed-bottom.footer-fixed-bottom {
272-
visibility: hidden;
273-
}
274-
}
275-
276-
@media (max-height: 600px) {
277-
.btn-next {
278-
display: none;
279-
}
280274
}

0 commit comments

Comments
 (0)