Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
Fix responsive styles
  • Loading branch information
Muhammad Althaf committed Feb 14, 2018
1 parent 343afff commit 72ad442
Show file tree
Hide file tree
Showing 3 changed files with 13 additions and 3 deletions.
1 change: 1 addition & 0 deletions assets/styles/buefy.scss
Expand Up @@ -5,6 +5,7 @@
// Container
$widescreen: 1000px + (2 * $gap);
$fullhd: 1000px + (2 * $gap);
$desktop: 800px + (2 * $gap);

// Import Bulma and Buefy styles
@import "~bulma";
Expand Down
2 changes: 1 addition & 1 deletion layouts/default.vue
Expand Up @@ -7,7 +7,7 @@
The<b>Case</b> Company
</router-link>
</div>
<div class="navbar-menu">
<div class="navbar-menu is-active">
<div class="navbar-end">
<div class="navbar-item">
<nuxt-link :to="{name: 'cart'}"> Cart ({{ cartTotal }})</nuxt-link>
Expand Down
13 changes: 11 additions & 2 deletions pages/index.vue
Expand Up @@ -26,7 +26,7 @@
<div class="column">
<div class="columns is-multiline is-variable is-2">
<div class="column is-one-third" v-for="product in products" :key="product._id">
<div class="box">
<div class="box product-box">
<p class="subtitle has-text-centered has-text-black has-text-weight-light">
{{ product.title }}
</p>
Expand Down Expand Up @@ -91,7 +91,16 @@ export default {
width: auto;
margin: 0 auto;
}
button {
.product-box {
height: 100%;
}
.product-box button {
margin: 0 auto;
}
.product-box .subtitle {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
</style>

0 comments on commit 72ad442

Please sign in to comment.