Commit cbf43ed8 authored by Lasse Overgaard Møldrup's avatar Lasse Overgaard Møldrup
Browse files

Merge branch 'feature/main-structure' into 'develop'

Feature/main structure

See merge request !1
parents a9ec451c 5318c0dd
Pipeline #48384 passed with stages
in 2 minutes and 7 seconds
This diff is collapsed.
<template>
<Navbar/>
<router-view/>
<div id="site">
<Header/>
<router-view id="content"/>
<Footer id="footer"/>
</div>
</template>
<script>
import Navbar from '@/components/Navbar';
import Header from '@/components/Header';
import Footer from '@/components/Footer';
export default {
name: 'App',
components: {
Navbar
Header,
Footer
}
}
</script>
<style lang="scss">
body, html {
height: 100%;
}
#app {
font-family: Avenir, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
height: 100%;
}
#content {
flex: 1 0 auto;
}
#footer {
flex: 0 0 auto;
}
#site {
display:flex;
flex-direction:column;
height: 100%;
}
</style>
<template>
<footer class="full-width" id="footer">
<p>&copy; 2021 Hold Afstand, ExSys2021 Projekt</p>
</footer>
</template>
<script>
export default {
name: 'Footer'
}
</script>
<style scoped lang="scss">
.full-width {
width: 100%;
}
#footer {
color: gray;
}
</style>
\ No newline at end of file
<template>
<div class="full-width fixed-to-top" id="header">
<div id="logo">
<h1>Studerende.dk <span class="tiny pig-colored">v. Den Flyvende Gris</span></h1>
</div>
<Navbar/>
<NotificationWidget/>
</div>
</template>
<script>
import Navbar from '@/components/Navbar';
import NotificationWidget from '@/components/NotificationWidget';
export default {
name: 'Header',
components: {
Navbar,
NotificationWidget
}
}
</script>
<style scoped lang="scss">
.full-width {
width: 100%;
}
.fixed-to-top {
top: 0;
}
.tiny {
font-size: 50%;
}
.pig-colored {
color: #f36fab;
}
#header {
border-bottom: 2px solid lightgray;
}
#logo {
display: inline-block;
color: #2c3e50;
padding-right: 2.5%;
}
</style>
\ No newline at end of file
<template>
<div id="nav">
<router-link to="/">Forside</router-link> |
<router-link to="/about">Alle kurser</router-link> |
<router-link to="/about">Mail</router-link> |
<router-link to="/about">Kalender</router-link> |
<router-link to="/about">Eksamensportal</router-link> |
<a href="https://dropud.nu">Pretty STADS</a> |
<router-link to="/">Forside</router-link>|
<router-link to="/about">Alle kurser</router-link>|
<router-link to="/about">Mail</router-link>|
<router-link to="/about">Kalender</router-link>|
<router-link to="/about">Eksamensportal</router-link>|
<a href="https://dropud.nu">Pretty STADS</a>|
<router-link to="/about">Indstillinger</router-link>
</div>
</template>
......@@ -16,16 +16,18 @@
}
</script>
<style lang="scss">
<style scoped lang="scss">
#nav {
padding: 30px;
display: inline-block;
a {
font-weight: bold;
color: #2c3e50;
padding-left: 25px;
padding-right: 25px;
&.router-link-exact-active {
color: #42b983;
color: #f36fab;
}
}
}
......
<template>
<div id="widget" @click="isOpen=!isOpen">
<img alt="Notification Bell" src="@/assets/bell.png"> <span id="number"> 3 </span>
<div v-if="isOpen" id="notifications">
<h1>Notifications</h1>
<p>You are awesome!</p>
<p>The result are in: Nim <i>is</i> better than Rust.</p>
<p>Henrik Korsgaard: <i>The exam is cancelled. Everyone get's 12!</i></p>
</div>
</div>
</template>
<script>
export default {
name: 'NotificationWidget',
data: function() {
return {
isOpen: false
};
}
}
</script>
<style scoped lang="scss">
#widget {
display: inline-block;
padding-left: 2.5%;
img {
height: 2em;
}
#number {
position: relative;
bottom: 1.25em;
left: -1.25em;
font-weight: bold;
color: white;
padding-left:0.25em;
padding-right:0.25em;
background-color: red;
border: 3px solid red;
border-radius: 100px;
}
#notifications {
position: fixed;
width: 20em;
transform: translate(-45%);
background-color: white;
border: 2px solid lightgray;
border-radius: 10px;
p {
text-align: left;
padding: 10px;
border-top: 1px solid lightgray;
}
}
}
</style>
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment