nathalie
/
pedi2
3
3
Fork 1
Code Issues Pull Requests Projects Releases Wiki Activity

funcion/nueva-lista-de-productos #32

Merged
atasistro merged 3 commits from funcion/nueva-lista-de-productos into master 2024-09-09 01:18:59 -03:00
Conversation 0 Commits 3 Files Changed 2 +37 -13
2 changed files with 37 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
resources/js/components/CategoriasContainer.vue
View File

@ -1,5 +1,5 @@
<template>
<div v-show="visible" class="container">
<div v-show="visible" class="block ml-3 mr-3">
<div class="columns is-multiline is-mobile">
<div v-for="(categoria,i) in categorias" :key="i" class="block column is-one-quarter-desktop is-one-third-tablet is-half-mobile">
<div @click.capture="seleccionarCategoria(categoria)" class="card" style="height:100%" >
@ -38,4 +38,4 @@
}
}
}
</script>
</script>

46
resources/js/components/ProductoCard.vue
View File

@ -46,18 +46,24 @@ export default {
</script>
<template>
<div class="block column min-width">
<div class="block column is-one-quarter-desktop is-full-mobile is-half-tablet min-width-from-desktop">
<div class="box" style="height:100%">
<div class="columns">
<div class="column is-three-quarters">
<div class="column">
<p class="title is-6">
{{ producto.nombre }}
</p>
<p class="subtitle is-7" v-text="producto.proveedor"></p>
<span class="subtitle is-7 hidden-from-tablet" v-if="enChismosa !== 0">{{ enChismosa }} en chismosa</span>
</div>
<div class="column is-one-quarter has-text-right">
<p class="has-text-weight-bold has-text-primary">$<span v-text="producto.precio"></span></p>
<p class="subtitle is-7" v-if="enChismosa !== 0">{{ enChismosa }} en chismosa</p>
<p class="has-text-weight-bold has-text-primary">
<span class="is-left-mobile">
<img v-show="producto.economia_solidaria" height="30px" width="30px" src="/assets/solidaria.png" alt="proveedor de economía solidaria">
<img v-show="producto.nacional" height="30px" width="30px" src="/assets/uruguay.png" alt="proveedor nacional"/>
</span>
$<span v-text="producto.precio"></span>
</p>
</div>
</div>
<footer class="columns">
@ -88,11 +94,8 @@ export default {
</button>
</div>
</div>
<div class="column is-one-quarter has-text-right">
<p>
<img v-show="producto.economia_solidaria" height="30px" width="30px" src="/assets/solidaria.png" alt="proveedor de economía solidaria">
<img v-show="producto.nacional" height="30px" width="30px" src="/assets/uruguay.png" alt="proveedor nacional"/>
</p>
<div class="column">
<p class="subtitle is-7 is-hidden-mobile" v-if="enChismosa !== 0">{{ enChismosa }} en chismosa</p>
</div>
</footer>
</div><!-- END BOX -->
@ -102,9 +105,30 @@ export default {
<style lang="scss" scoped>
@use "bulma/sass/utilities/mixins";
@include mixins.desktop {
.min-width {
@include mixins.until(mixins.$desktop) {
.hidden-until-desktop {
display: none;
}
}
@include mixins.from(mixins.$desktop) {
.min-width-from-desktop {
min-width: 25rem;
}
.hidden-from-desktop {
display: none;
}
}
@include mixins.from(mixins.$tablet) {
.hidden-from-tablet {
display: none;
}
}
@include mixins.mobile() {
.is-left-mobile {
float: left;
}
}
</style>