diff options
Diffstat (limited to 'components')
-rw-r--r-- | components/PostLink.vue | 2 | ||||
-rw-r--r-- | components/PostList/PurePostList.vue | 4 | ||||
-rw-r--r-- | components/TheHeader.vue | 21 |
3 files changed, 17 insertions, 10 deletions
diff --git a/components/PostLink.vue b/components/PostLink.vue index 2dc3dd9..54cd934 100644 --- a/components/PostLink.vue +++ b/components/PostLink.vue @@ -40,7 +40,7 @@ export default { margin: 20px; flex-basis: 410px; max-width: 410px; - height: 250px; + /* height: 250px; */ box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25); background: #ffffff; text-align: left; diff --git a/components/PostList/PurePostList.vue b/components/PostList/PurePostList.vue index 07883ad..ace069f 100644 --- a/components/PostList/PurePostList.vue +++ b/components/PostList/PurePostList.vue @@ -49,7 +49,7 @@ export default { .post-list-container { display: flex; flex-wrap: wrap; - justify-content: initial; + justify-content: center; } @keyframes loading { @@ -88,4 +88,4 @@ export default { .fade-in-enter-active { animation: fade-in 0.3s reverse; } -</style> \ No newline at end of file +</style> diff --git a/components/TheHeader.vue b/components/TheHeader.vue index 431b945..4d17616 100644 --- a/components/TheHeader.vue +++ b/components/TheHeader.vue @@ -1,14 +1,21 @@ <template> - <nav class="navbar" :class="{'menu-open': isMenuCollapsed}"> + <nav class="navbar" :class="{ 'menu-open': showMenu }"> <div class="title"> <img v-if="logo" class="logo" :src="logo" alt="ZHR" /> - <nuxt-link class="title-name" :class="{margin: logo}" to="/">{{ title }}</nuxt-link> + <nuxt-link class="title-name" :class="{ margin: logo }" to="/">{{ + title + }}</nuxt-link> </div> <div class="space"></div> <button @click="toggleMenu" class="menu-toggler">Menu</button> - <ul class="links" :class="{show: this.isMenuCollapsed}" @click="toggleMenu"> + <ul class="links" :class="{ show: this.showMenu }" @click="toggleMenu"> <!-- Loop for generating links --> - <nav-link v-for="route in routes" :key="route.path" :link="route.path" :name="route.name" /> + <nav-link + v-for="route in routes" + :key="route.path" + :link="route.path" + :name="route.name" + /> </ul> </nav> </template> @@ -38,12 +45,12 @@ export default { }, data: function() { return { - isMenuCollapsed: true + showMenu: false } }, methods: { toggleMenu() { - this.isMenuCollapsed = !this.isMenuCollapsed + this.showMenu = !this.showMenu } } } @@ -180,4 +187,4 @@ export default { height: calc(100% - 80px); } } -</style> \ No newline at end of file +</style> |