Skip to content

Commit

Permalink
Add Under Construction pages
Browse files Browse the repository at this point in the history
  • Loading branch information
MgenGlder committed Sep 29, 2019
1 parent 78934bc commit f4876d0
Show file tree
Hide file tree
Showing 17 changed files with 693 additions and 47 deletions.
2 changes: 1 addition & 1 deletion src/index.ejs
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<html>
<head>
<meta charset="utf-8">
<title>test</title>
<title>FCS Toolbar</title>
<% if (htmlWebpackPlugin.options.nodeModules) { %>
<!-- Add `node_modules/` to global paths so `require` works properly in development -->
<script>
Expand Down
10 changes: 0 additions & 10 deletions src/renderer/components/FCSCommands.vue

This file was deleted.

10 changes: 0 additions & 10 deletions src/renderer/components/FCSLinks.vue

This file was deleted.

10 changes: 0 additions & 10 deletions src/renderer/components/TrafficLight.vue

This file was deleted.

10 changes: 0 additions & 10 deletions src/renderer/components/WeightedList.vue

This file was deleted.

71 changes: 71 additions & 0 deletions src/renderer/components/toolbar-apps/FCSCommands.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,71 @@
<template>
<div class="bgimg">
<div class="topleft">
<p>FCS Commands</p>
</div>
<div class="middle">
<h1>COMING SOON</h1>
<hr>
<p>Project X</p>
</div>
<div class="bottomleft">
<p>Kunle Oshiyoye</p>
</div>
</div>
</template>
<script>
export default {
name: 'FCSCommands'
}
</script>
<style>
/* Set height to 100% for body and html to enable the background image to cover the whole page: */
.bgimg {
/* Background image */
background-image: url('../../../../static/forestbridge.jpg');
/* Full-screen */
height: 100%;
/* Center the background image */
background-position: center;
/* Scale and zoom in the image */
background-size: cover;
/* Add position: relative to enable absolutely positioned elements inside the image (place text) */
position: relative;
/* Add a white text color to all elements inside the .bgimg container */
color: white;
/* Add a font */
font-family: "Courier New", Courier, monospace;
/* Set the font-size to 25 pixels */
font-size: 25px;
}
/* Position text in the top-left corner */
.topleft {
position: absolute;
top: 0;
left: 16px;
}
/* Position text in the bottom-left corner */
.bottomleft {
position: absolute;
bottom: 0;
left: 16px;
}
/* Position text in the middle */
.middle {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
}
/* Style the <hr> element */
hr {
margin: auto;
width: 40%;
}
</style>
71 changes: 71 additions & 0 deletions src/renderer/components/toolbar-apps/FCSLinks.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,71 @@
<template>
<div class="bgimg">
<div class="topleft">
<p>FCS Links</p>
</div>
<div class="middle">
<h1>COMING SOON</h1>
<hr>
<p>Project X</p>
</div>
<div class="bottomleft">
<p>Kunle Oshiyoye</p>
</div>
</div>
</template>
<script>
export default {
name: 'FCSLinks'
}
</script>
<style>
/* Set height to 100% for body and html to enable the background image to cover the whole page: */
.bgimg {
/* Background image */
background-image: url('../../../../static/forestbridge.jpg');
/* Full-screen */
height: 100%;
/* Center the background image */
background-position: center;
/* Scale and zoom in the image */
background-size: cover;
/* Add position: relative to enable absolutely positioned elements inside the image (place text) */
position: relative;
/* Add a white text color to all elements inside the .bgimg container */
color: white;
/* Add a font */
font-family: "Courier New", Courier, monospace;
/* Set the font-size to 25 pixels */
font-size: 25px;
}
/* Position text in the top-left corner */
.topleft {
position: absolute;
top: 0;
left: 16px;
}
/* Position text in the bottom-left corner */
.bottomleft {
position: absolute;
bottom: 0;
left: 16px;
}
/* Position text in the middle */
.middle {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
}
/* Style the <hr> element */
hr {
margin: auto;
width: 40%;
}
</style>
71 changes: 71 additions & 0 deletions src/renderer/components/toolbar-apps/TrafficLight.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,71 @@
<template>
<div class="bgimg">
<div class="topleft">
<p>Traffic Light</p>
</div>
<div class="middle">
<h1>COMING SOON</h1>
<hr>
<p>Project X</p>
</div>
<div class="bottomleft">
<p>Kunle Oshiyoye</p>
</div>
</div>
</template>
<script>
export default {
name: 'TrafficLight'
}
</script>
<style>
/* Set height to 100% for body and html to enable the background image to cover the whole page: */
.bgimg {
/* Background image */
background-image: url('../../../../static/forestbridge.jpg');
/* Full-screen */
height: 100%;
/* Center the background image */
background-position: center;
/* Scale and zoom in the image */
background-size: cover;
/* Add position: relative to enable absolutely positioned elements inside the image (place text) */
position: relative;
/* Add a white text color to all elements inside the .bgimg container */
color: white;
/* Add a font */
font-family: "Courier New", Courier, monospace;
/* Set the font-size to 25 pixels */
font-size: 25px;
}
/* Position text in the top-left corner */
.topleft {
position: absolute;
top: 0;
left: 16px;
}
/* Position text in the bottom-left corner */
.bottomleft {
position: absolute;
bottom: 0;
left: 16px;
}
/* Position text in the middle */
.middle {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
}
/* Style the <hr> element */
hr {
margin: auto;
width: 40%;
}
</style>
50 changes: 50 additions & 0 deletions src/renderer/components/toolbar-apps/WeightedList/Answer.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
<template>
<label>
<input type="radio" :value="value" v-model="answerIndex">
{{answer.text}}
</label>
</template>

<script>
export default {
name: 'Answer',
props: {
answer: {
type: Object,
required: true
},
value: {
type: Number,
required: true
},
questionIndex: {
type: Number,
required: true
}
},
computed: {
answerIndex: {
get () {
return this.$store.state.WeightedList.questions[this.questionIndex].selectedAnswerIndex
},
set (value) {
this.$store.dispatch('WeightedList/answer', {
questionId: this.questionIndex,
answerId: value
})
}
}
},
methods: {
}
}
</script>

<style lang="scss" scoped>
label {
display: block;
input {
margin-right: 1em;
}
}
</style>
Loading

0 comments on commit f4876d0

Please sign in to comment.