Commit b19e9825 authored by Esteban Choque's avatar Esteban Choque
Browse files

Las categorías cambian de color dinámicamente al mismo tiempo que el background

parent 8c4c113b
...@@ -129,7 +129,7 @@ export async function setContext(app, context) { ...@@ -129,7 +129,7 @@ export async function setContext(app, context) {
payload: context.payload, payload: context.payload,
error: context.error, error: context.error,
base: '/', base: '/',
env: {"baseUrl":"http://localhost:4000","wpApi":"http://localhost/wordpress/index.php?rest_route=/wp/v2/","foro":{"url":"http://localhost/wordpress/index.php?rest_route="},"entidad":{"nombre":"Bolivia Digital 2025"}} env: {"baseUrl":"http://localhost:4000","wpApi":"http://localhost/wordpress/index.php?rest_route=/wp/v2/","foro":{"url":"http://localhost/wordpress/index.php?rest_route="},"entidad":{"nombre":"Bolivia Digital"}}
} }
// Only set once // Only set once
if (context.req) app.context.req = context.req if (context.req) app.context.req = context.req
......
...@@ -34,7 +34,7 @@ module.exports = { ...@@ -34,7 +34,7 @@ module.exports = {
url: 'http://localhost/wordpress/index.php?rest_route=' url: 'http://localhost/wordpress/index.php?rest_route='
}, },
entidad: { entidad: {
nombre: 'Bolivia Digital 2025' nombre: 'Bolivia Digital'
}, },
}, },
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<span class="b-servicio-titulo"> <span class="b-servicio-titulo">
<span class="b-services-short">BOLIVIA S.</span> <span class="b-services-short">BOLIVIA S.</span>
<!--<span class="b-services-long">{{ $t('bServices.title') }}</span>--> <!--<span class="b-services-long">{{ $t('bServices.title') }}</span>-->
<span class="b-service-two-points">:</span> <!--<span class="b-service-two-points">:</span>-->
<i class="b-icon-arrow-down el-icon-arrow-down"></i> <i class="b-icon-arrow-down el-icon-arrow-down"></i>
</span> </span>
<ul class="b-servicio-opciones"> <ul class="b-servicio-opciones">
......
...@@ -67,18 +67,30 @@ ...@@ -67,18 +67,30 @@
type="text" type="text"
class="app-menu__btn-open app-btn__link" class="app-menu__btn-open app-btn__link"
icon="el-icon-arrow-down" icon="el-icon-arrow-down"
@click="item.open = !item.open"> @click="pestaña_participa = !pestaña_participa">
</el-button> </el-button>
<ul <ul
class="app-menu__sublist fadeInUp"> class="app-menu__sublist fadeInUp foros"
:class="{ 'open-menu': pestaña_participa }">
<li <li
v-for="forum in forums"
:key="forum.id_forum"
class="app-menu__subitem">
<nuxt-link :to="$i18n.path('participa/'+forum.id_forum+'/'+forum.slug)">
{{ forum.name }}
</nuxt-link>
</li>
<!--<li
class="app-menu__subitem"> class="app-menu__subitem">
<a href="/participa/1/agenda-digital">Agenda Digital</a> <a href="/participa/1/agenda-digital">Agenda Digital</a>
</li> </li>
<li <li
class="app-menu__subitem"> class="app-menu__subitem">
<a href="/participa/2/inclusion-digital">Inclusión Digital</a> <a href="/participa/2/inclusion-digital">Inclusión Digital</a>
</li> </li>-->
</ul> </ul>
</li> </li>
</ul> </ul>
...@@ -145,6 +157,7 @@ ...@@ -145,6 +157,7 @@
import AppLang from './AppLang'; import AppLang from './AppLang';
import AppLogo from './AppLogo'; import AppLogo from './AppLogo';
import BServicio from '~/components/bservicio/BServicio'; import BServicio from '~/components/bservicio/BServicio';
import axios from 'axios';
const Cookie = process.client ? require('js-cookie') : undefined; const Cookie = process.client ? require('js-cookie') : undefined;
let nuxtContainer = null; let nuxtContainer = null;
...@@ -159,7 +172,9 @@ export default { ...@@ -159,7 +172,9 @@ export default {
return { return {
menu: [], menu: [],
stick: false, stick: false,
maxStick: 180 maxStick: 180,
pestaña_participa: false,
forums: []
}; };
}, },
asyncData() { asyncData() {
...@@ -173,6 +188,7 @@ export default { ...@@ -173,6 +188,7 @@ export default {
}, },
mounted () { mounted () {
nuxtContainer = document.getElementById('__nuxt'); nuxtContainer = document.getElementById('__nuxt');
this.getListadoForos();
}, },
destroyed () { destroyed () {
if (process.browser) { if (process.browser) {
...@@ -213,6 +229,13 @@ export default { ...@@ -213,6 +229,13 @@ export default {
}); });
} }
}); });
},
getListadoForos() {
axios.get(this.$foro.url+'/fm/v1/')
.then(response => {
this.forums = response.data;
console.log(response.data);
});
} }
} }
}; };
......
...@@ -169,4 +169,7 @@ $colorLink: #333333; ...@@ -169,4 +169,7 @@ $colorLink: #333333;
display: inline-block; display: inline-block;
} }
.foros {
left: -120px !important;
}
@import './responsive.scss'; @import './responsive.scss';
\ No newline at end of file
...@@ -29,7 +29,9 @@ ...@@ -29,7 +29,9 @@
<div <div
class="page-content"> class="page-content">
<p>{{ post_body }}</p> <p>{{ post_body }}</p>
<h3 class="subtitle"> <h3
:style="myStyle"
class="subtitle">
Respuestas Respuestas
</h3> </h3>
<div <div
...@@ -51,7 +53,9 @@ ...@@ -51,7 +53,9 @@
</div> </div>
</div> </div>
</div> </div>
<h3 class="subtitle"> <h3
:style="myStyle"
class="subtitle">
Respuesta a: {{ post_title }} Respuesta a: {{ post_title }}
</h3> </h3>
<p class="tu_info">Tu Información:</p> <p class="tu_info">Tu Información:</p>
...@@ -120,7 +124,13 @@ export default { ...@@ -120,7 +124,13 @@ export default {
total: 0, total: 0,
pregunta: '', pregunta: '',
respuesta: '', respuesta: '',
msg: '' msg: '',
myStyle:{
backgroundColor:''
},
adorno:{
borderTopColor:''
}
}; };
}, },
mounted () { mounted () {
...@@ -128,6 +138,8 @@ export default { ...@@ -128,6 +138,8 @@ export default {
this.$util.setBackgroundImage(); this.$util.setBackgroundImage();
this.getTopic(); this.getTopic();
this.crearSuma(); this.crearSuma();
this.myStyle.backgroundColor = this.$util.colorpro;
this.adorno.borderTopColor = this.$util.coloradorno;
}, },
methods: { methods: {
getTopic() { getTopic() {
......
...@@ -32,7 +32,9 @@ ...@@ -32,7 +32,9 @@
:key="topic.id_topic" :key="topic.id_topic"
class="page-content"> class="page-content">
<p v-html="topic.desc"></p> <p v-html="topic.desc"></p>
<h3 class="subtitle"> <h3
:style="myStyle"
class="subtitle">
Debates Debates
</h3> </h3>
<div <div
...@@ -60,7 +62,9 @@ ...@@ -60,7 +62,9 @@
</el-pagination> </el-pagination>
</el-row> </el-row>
<h3 class="subtitle"> <h3
:style="myStyle"
class="subtitle">
Inicia un nuevo Debate: Inicia un nuevo Debate:
</h3> </h3>
<p class="tu_info">Tu Información:</p> <p class="tu_info">Tu Información:</p>
...@@ -130,7 +134,13 @@ export default { ...@@ -130,7 +134,13 @@ export default {
total: 0, total: 0,
pregunta: '', pregunta: '',
respuesta: '', respuesta: '',
msg: '' msg: '',
myStyle:{
backgroundColor:''
},
adorno:{
borderTopColor:''
}
}; };
}, },
mounted () { mounted () {
...@@ -138,6 +148,8 @@ export default { ...@@ -138,6 +148,8 @@ export default {
this.$util.setBackgroundImage(); this.$util.setBackgroundImage();
this.pagina(1); this.pagina(1);
this.crearSuma(); this.crearSuma();
this.myStyle.backgroundColor = this.$util.colorpro;
this.adorno.borderTopColor = this.$util.coloradorno;
}, },
methods: { methods: {
sendPublicacion() { sendPublicacion() {
......
...@@ -31,11 +31,17 @@ ...@@ -31,11 +31,17 @@
<nuxt-link <nuxt-link
:to="$i18n.path(`participa/`+$route.params.id_forum+`/`+$route.params.name_forum+`/`+topic.id_topic+`/`+topic.slug)"> :to="$i18n.path(`participa/`+$route.params.id_forum+`/`+$route.params.name_forum+`/`+topic.id_topic+`/`+topic.slug)">
<h3 class="categoria">{{ topic.name }}</h3> <h3
:style="myStyle"
class="categoria">{{ topic.name }}</h3>
<div <div
class="adorno"> class="adorno">
<div class="adorno_izq"></div> <div
<div class="adorno_der"></div> :style="adorno"
class="adorno_izq"></div>
<div
:style="adorno"
class="adorno_der"></div>
</div> </div>
<hr class="separador_post"> <hr class="separador_post">
</nuxt-link> </nuxt-link>
...@@ -164,7 +170,13 @@ export default { ...@@ -164,7 +170,13 @@ export default {
total: 0, total: 0,
pregunta: '', pregunta: '',
respuesta: '', respuesta: '',
msg: '' msg: '',
myStyle:{
backgroundColor:''
},
adorno:{
borderTopColor:''
}
}; };
}, },
mounted () { mounted () {
...@@ -172,6 +184,8 @@ export default { ...@@ -172,6 +184,8 @@ export default {
this.$util.setBackgroundImage(); this.$util.setBackgroundImage();
this.getTopics(); this.getTopics();
this.crearSuma(); this.crearSuma();
this.myStyle.backgroundColor = this.$util.colorpro;
this.adorno.borderTopColor = this.$util.coloradorno;
}, },
methods: { methods: {
mostrarDialog() { mostrarDialog() {
......
...@@ -61,7 +61,7 @@ export default { ...@@ -61,7 +61,7 @@ export default {
//console.log(response.data); // ex.: { user: 'Your User'} //console.log(response.data); // ex.: { user: 'Your User'}
console.log(response.status); // ex.: 200 console.log(response.status); // ex.: 200
}); });
}, }
} }
}; };
</script> </script>
......
...@@ -2,6 +2,8 @@ import Vue from 'vue'; ...@@ -2,6 +2,8 @@ import Vue from 'vue';
export default ({ app, store }) => { export default ({ app, store }) => {
const Util = { const Util = {
colorpro: '',
coloradorno: '',
getRandomInt (min, max) { getRandomInt (min, max) {
min = Math.ceil(min); min = Math.ceil(min);
max = Math.floor(max); max = Math.floor(max);
...@@ -17,8 +19,14 @@ export default ({ app, store }) => { ...@@ -17,8 +19,14 @@ export default ({ app, store }) => {
}, },
setBackgroundImage () { setBackgroundImage () {
const colors = ['blue', 'yellow', 'green', 'red']; const colors = ['blue', 'yellow', 'green', 'red'];
const colorescat = ['#024f9b', '#f9c100', '#449935', '#d31419'];
const coloresadorno = ['#012d59', '#806300', '#0e5901', '#7a0306'];
document.body.className = ''; document.body.className = '';
document.body.classList.add(`portal-bg-${colors[this.getRandomInt(0, colors.length - 1)]}`); //document.body.classList.add(`portal-bg-${colors[this.getRandomInt(0, colors.length - 1)]}`);
const aleatorio = this.getRandomInt(0, colors.length - 1);
this.colorpro = colorescat[aleatorio];
this.coloradorno = coloresadorno[aleatorio];
document.body.classList.add(`portal-bg-${colors[aleatorio]}`);
} }
}; };
......
Markdown is supported
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