Oliver/Phantom-Ink-Online
0
0
Fork 0
Code Issues Activity

Get the attributions component working.

Browse source
This commit is contained in:
Oliver-Akins 2020-12-08 14:32:28 -07:00
parent c096229710
commit fcf8b0eb8c
1 changed files with 51 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

56
web/src/components/Attributions.vue
View file

@ -1,17 +1,63 @@
<template> <template>
<div></div> <div id="attributions-bar">
<div
class="bottom-bar clickable"
@click="modal = true"
>
Made By: Oliver Akins
</div>
<ModalAnimation
:show="modal"
@closed="modal = false"
>
<h2 class="centre">Site Attributions:</h2>
<hr>
<h3>Site Made By: Oliver Akins</h3>
<hr>
<h3>Open Source Libraries:</h3>
<ul>
<li>Potatoes</li>
</ul>
</ModalAnimation>
</div>
</template> </template>
<script> <script>
import Modal from "./Modal";
export default { export default {
name: ``, name: ``,
components: {}, components: {
"ModalAnimation": Modal,
},
data() {return {
modal: false,
}},
computed: {}, computed: {},
methods: {}, methods: {},
} }
</script> </script>
<style> <style scoped>
@import "css/theme.css"; @import "../css/theme.css";
@import "css/style.css"; @import "../css/style.css";
#attributions-bar {
position: absolute;
height: 35px;
width: 100%;
bottom: 0;
}
.bottom-bar {
background-color: var(--background2);
color: var(--background2-text);
border-radius: 15px 15px 0 0;
justify-content: center;
align-items: center;
margin: 0 auto;
display: flex;
height: 100%;
width: 25%;
}
</style> </style>