blabla: click on whole article card open it

This commit is contained in:
Bachir Soussi Chiadmi 2021-03-09 11:35:00 +01:00
parent 1ec8a371b5
commit f89c29a8b9
4 changed files with 17 additions and 4 deletions

View File

@ -1849,6 +1849,8 @@ article.card {
article.card.article { article.card.article {
width: 423px; width: 423px;
height: 295px; } height: 295px; }
article.card.article section.images a {
display: block; }
article.card.minicard { article.card.minicard {
height: 100px; height: 100px;
width: 170px; width: 170px;

View File

@ -1087,7 +1087,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n}));
/***/ ((__unused_webpack_module, exports, __webpack_require__) => { /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
"use strict"; "use strict";
eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n}));\nexports.default = void 0;\n\nvar _route = _interopRequireDefault(__webpack_require__(/*! vuejs/route */ \"./web/themes/custom/materiotheme/vuejs/route/index.js\"));\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n// import { JSONAPI } from 'vuejs/api/json-axios'\nvar basePath = drupalSettings.path.baseUrl + drupalSettings.path.pathPrefix;\nvar _default = {\n name: \"ArticleCard\",\n router: _route.default,\n props: ['item'],\n data: function data() {\n return {\n alias: this.item.view_node.replace(/^.*\\/blabla\\//g, '')\n };\n },\n methods: {\n onclick: function onclick() {\n console.log('clicked on article', this.alias);\n this.$router.push({\n name: \"article\",\n params: {\n alias: this.alias,\n id: this.item.nid\n } // query: { nid: this.item.nid }\n // meta: { uuid:this.item.uuid },\n\n });\n }\n }\n};\nexports.default = _default;\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/Content/ArticleCard.vue?./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js??vue-loader-options"); eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n}));\nexports.default = void 0;\n\nvar _route = _interopRequireDefault(__webpack_require__(/*! vuejs/route */ \"./web/themes/custom/materiotheme/vuejs/route/index.js\"));\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n// import { JSONAPI } from 'vuejs/api/json-axios'\nvar basePath = drupalSettings.path.baseUrl + drupalSettings.path.pathPrefix;\nvar _default = {\n name: \"ArticleCard\",\n router: _route.default,\n props: ['item'],\n data: function data() {\n return {\n alias: this.item.view_node.replace(/^.*\\/blabla\\//g, '')\n };\n },\n methods: {\n onclick: function onclick() {\n console.log('clicked on article', this.alias);\n this.$router.push({\n name: \"article\",\n params: {\n alias: this.alias,\n id: this.item.nid\n } // query: { nid: this.item.nid }\n // meta: { uuid:this.item.uuid },\n\n });\n }\n }\n};\nexports.default = _default;\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/Content/ArticleCard.vue?./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js??vue-loader-options");
/***/ }), /***/ }),
@ -3436,7 +3436,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict"; "use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"render\": () => /* binding */ render,\n/* harmony export */ \"staticRenderFns\": () => /* binding */ staticRenderFns\n/* harmony export */ });\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _c(\"article\", { staticClass: \"card article\" }, [\n _c(\"header\", [\n _c(\"h1\", [\n _c(\"a\", {\n attrs: { href: _vm.item.view_node },\n domProps: { innerHTML: _vm._s(_vm.item.title) },\n on: {\n click: function($event) {\n $event.preventDefault()\n return _vm.onclick($event)\n }\n }\n })\n ]),\n _vm._v(\" \"),\n _c(\"aside\", { domProps: { innerHTML: _vm._s(_vm.item.created) } }),\n _vm._v(\" \"),\n false\n ? 0\n : _vm._e()\n ]),\n _vm._v(\" \"),\n _c(\"section\", { staticClass: \"images\" }, [\n _c(\"figure\", { domProps: { innerHTML: _vm._s(_vm.item.field_visuel) } })\n ])\n ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/Content/ArticleCard.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib/index.js??vue-loader-options"); eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"render\": () => /* binding */ render,\n/* harmony export */ \"staticRenderFns\": () => /* binding */ staticRenderFns\n/* harmony export */ });\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _c(\"article\", { staticClass: \"card article\" }, [\n _c(\"header\", [\n _c(\"h1\", [\n _c(\"a\", {\n attrs: { href: _vm.item.view_node },\n domProps: { innerHTML: _vm._s(_vm.item.title) },\n on: {\n click: function($event) {\n $event.preventDefault()\n return _vm.onclick($event)\n }\n }\n })\n ]),\n _vm._v(\" \"),\n _c(\"aside\", { domProps: { innerHTML: _vm._s(_vm.item.created) } })\n ]),\n _vm._v(\" \"),\n _c(\"section\", { staticClass: \"images\" }, [\n _c(\n \"a\",\n {\n attrs: { href: _vm.item.view_node },\n on: {\n click: function($event) {\n $event.preventDefault()\n return _vm.onclick($event)\n }\n }\n },\n [\n _c(\"figure\", {\n domProps: { innerHTML: _vm._s(_vm.item.field_visuel) }\n })\n ]\n )\n ])\n ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/Content/ArticleCard.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib/index.js??vue-loader-options");
/***/ }), /***/ }),

View File

@ -956,7 +956,13 @@ article.card{
width:$column_width; height:$card_height; width:$column_width; height:$card_height;
&.article{ &.article{
width:$column_width*2 + $column_goutiere; height:$card_height; width:$column_width*2 + $column_goutiere; height:$card_height;
section.images{
a{
display:block;
} }
}
}
&.minicard{ &.minicard{
height:100px; height:100px;
width:$minicard_width; width:$minicard_width;

View File

@ -9,10 +9,15 @@
></a> ></a>
</h1> </h1>
<aside v-html="item.created"></aside> <aside v-html="item.created"></aside>
<h4 v-if="false" class="body" v-html="item.body"></h4> <!-- <h4 class="body" v-html="item.body"></h4> -->
</header> </header>
<section class="images"> <section class="images">
<figure v-html="item.field_visuel"></figure> <a
:href="item.view_node"
@click.prevent="onclick"
>
<figure v-html="item.field_visuel"/>
</a>
</section> </section>
</article> </article>
</template> </template>