Skip to content

Commit 9b50338

Browse files
committed
fullPage scroll feature for HomePage
1 parent 88edfdf commit 9b50338

File tree

8 files changed

+55
-15
lines changed

8 files changed

+55
-15
lines changed

frontend/package-lock.json

+13
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

frontend/package.json

+1
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@
1212
"masonry-layout": "^4.2.2",
1313
"vue": "^2.5.17",
1414
"vue-carousel": "^0.18.0",
15+
"vue-fullpage.js": "^0.1.5",
1516
"vue-masonry": "^0.11.8",
1617
"vue-router": "^3.0.1",
1718
"vuex": "^3.0.1"

frontend/src/components/Gallery.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -98,7 +98,7 @@ export default {
9898
image: competitions,
9999
title: "Competitions",
100100
description:
101-
"Online competetions on ML, data science, programming, and CTFs are a great way for enthusiasts to show off some skills or learn something new in a competetive environment."
101+
"Online competitions on ML, data science, programming, and CTFs are a great way for enthusiasts to show off some skills or learn something new in a competitive environment."
102102
}
103103
],
104104
queue: 1,

frontend/src/components/SisterGroups.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
Sister groups are different smaller groups within the umbrella of
1414
Software Development Section, along with SDSLabs. The members of
1515
these groups focus on specific areas of technological innovation
16-
like data science, competetive programming, and information
16+
like data science, competitive programming, and information
1717
security.
1818
</div>
1919
<div

frontend/src/components/about/GalleryMobile.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ export default {
6363
image: competitions,
6464
title: "Competitions",
6565
description:
66-
"Online competetions on ML, data science, programming, and CTFs are a great way for enthusiasts to show off some skills or learn something new in a competetive environment."
66+
"Online competitions on ML, data science, programming, and CTFs are a great way for enthusiasts to show off some skills or learn something new in a competitive environment."
6767
}
6868
]
6969
};

frontend/src/components/about/SisterGallery.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@ export default {
5151
image: pag,
5252
title: "PROGRAMMING & ALGORITHMS GROUP",
5353
description:
54-
"A bunch of competetive programming enthusiasts, PAG, frequently organizes coding lectures and contests for IITR people."
54+
"A bunch of competitive programming enthusiasts, PAG, frequently organizes coding lectures and contests for IITR people."
5555
},
5656
{
5757
image: infosec,

frontend/src/main.js

+24
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,34 @@ import Vue from "vue";
22
import App from "./App.vue";
33
import router from "./router";
44
import store from "./store";
5+
import VueFullPage from "vue-fullpage.js";
56

67
import "@/assets/css/tailwind.css";
78

89
Vue.config.productionTip = false;
10+
Vue.use(VueFullPage);
11+
12+
new Vue({
13+
el: "#fullpage-home",
14+
name: "app",
15+
data: function(){
16+
return {
17+
options: {
18+
afterLoad: this.afterLoad,
19+
navigation: true,
20+
scrollBar: false,
21+
controlArrows: true,
22+
anchors: ['page1', 'page2', 'page3'],
23+
},
24+
}
25+
},
26+
methods: {
27+
afterLoad: function(origin, destination, direction){
28+
console.log("After load....");
29+
console.log(destination);
30+
}
31+
}
32+
});
933

1034
new Vue({
1135
router,

frontend/src/views/Home.vue

+13-11
Original file line numberDiff line numberDiff line change
@@ -11,17 +11,19 @@
1111
class="px-16 sm:px-88 pb-28 sm:pb-0 flex flex-col justify-center items-center"
1212
id="projects"
1313
>
14-
<Project
15-
class="fullpage section"
16-
v-for="(project, permalink, index) in projects"
17-
v-bind:key="index"
18-
v-bind:title="project.title"
19-
v-bind:desc="project.description"
20-
v-bind:url="project.url"
21-
v-bind:image_url="project.image"
22-
v-bind:permalink="project.permalink"
23-
v-bind:color="project.color"
24-
/>
14+
<full-page ref="fullpage" :options="options" id="fullpage-home">
15+
<Project
16+
class="fullpage section"
17+
v-for="(project, permalink, index) in projects"
18+
v-bind:key="index"
19+
v-bind:title="project.title"
20+
v-bind:desc="project.description"
21+
v-bind:url="project.url"
22+
v-bind:image_url="project.image"
23+
v-bind:permalink="project.permalink"
24+
v-bind:color="project.color"
25+
/>
26+
</full-page>
2527
</div>
2628
</div>
2729
</template>

0 commit comments

Comments
 (0)