hover state fixes

shift-build-2464
Nadim Salloum 2021-06-14 19:11:49 +03:00
parent d254292a01
commit 9b62d099d3
8 changed files with 38 additions and 30 deletions

42
public/js/app.js vendored
View File

@ -19264,7 +19264,7 @@ __webpack_require__.r(__webpack_exports__);
props: ['href', 'active'], props: ['href', 'active'],
computed: { computed: {
classes: function classes() { classes: function classes() {
return this.active ? 'w-full flex items-center text-blue-600 h-10 pl-4 bg-gray-200 hover:bg-gray-200 rounded-lg cursor-pointer' : 'w-full flex items-center text-gray-800 h-10 pl-4 hover:bg-gray-200 rounded-lg cursor-pointer'; return this.active ? 'w-full flex items-center text-blue-600 h-10 pl-4 bg-gray-200 hover:bg-gray-200 rounded-lg cursor-pointer transition' : 'w-full flex items-center text-gray-800 h-10 pl-4 hover:bg-gray-200 rounded-lg cursor-pointer transition';
} }
} }
}); });
@ -22372,7 +22372,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
return (0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)(_component_inertia_link, { return (0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)(_component_inertia_link, {
href: $props.href, href: $props.href,
"class": "text-indigo-400 hover:text-indigo-600" "class": "text-indigo-400 hover:text-indigo-600 transition"
}, { }, {
"default": (0,vue__WEBPACK_IMPORTED_MODULE_0__.withCtx)(function () { "default": (0,vue__WEBPACK_IMPORTED_MODULE_0__.withCtx)(function () {
return [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createTextVNode)((0,vue__WEBPACK_IMPORTED_MODULE_0__.toDisplayString)($props.text) + " / ", 1 return [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createTextVNode)((0,vue__WEBPACK_IMPORTED_MODULE_0__.toDisplayString)($props.text) + " / ", 1
@ -22744,7 +22744,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
/* TEXT */ /* TEXT */
)])) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)("v-if", true), $props.car.link ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)("div", _hoisted_20, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_inertia_link, { )])) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)("v-if", true), $props.car.link ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)("div", _hoisted_20, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_inertia_link, {
href: $props.car.link, href: $props.car.link,
"class": "pt-1 pb-1 flex items-center" "class": "pt-1 pb-1 flex items-center hover:text-indigo-600"
}, { }, {
"default": (0,vue__WEBPACK_IMPORTED_MODULE_0__.withCtx)(function () { "default": (0,vue__WEBPACK_IMPORTED_MODULE_0__.withCtx)(function () {
return [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_unicon, { return [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_unicon, {
@ -22834,7 +22834,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
/* TEXT */ /* TEXT */
)) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)("v-if", true), $props.contact.email ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)("div", _hoisted_6, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)("a", { )) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)("v-if", true), $props.contact.email ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)("div", _hoisted_6, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)("a", {
href: 'mailto:' + $props.contact.email, href: 'mailto:' + $props.contact.email,
"class": "pt-1 pb-1 flex items-center" "class": "pt-1 pb-1 flex items-center hover:text-indigo-600"
}, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_unicon, { }, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_unicon, {
"class": "mr-1", "class": "mr-1",
height: "22", height: "22",
@ -22846,7 +22846,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
/* PROPS */ /* PROPS */
, ["href"])])) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)("v-if", true), $props.contact.phone ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)("div", _hoisted_7, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)("a", { , ["href"])])) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)("v-if", true), $props.contact.phone ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)("div", _hoisted_7, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)("a", {
href: 'phone:' + $props.contact.phone, href: 'phone:' + $props.contact.phone,
"class": "pt-1 pb-1 flex items-center" "class": "pt-1 pb-1 flex items-center hover:text-indigo-600"
}, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_unicon, { }, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_unicon, {
"class": "mr-1", "class": "mr-1",
height: "22", height: "22",
@ -22860,7 +22860,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
/* TEXT */ /* TEXT */
)])) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)("v-if", true), $props.contact.link ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)("div", _hoisted_10, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_inertia_link, { )])) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)("v-if", true), $props.contact.link ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)("div", _hoisted_10, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_inertia_link, {
href: $props.contact.link, href: $props.contact.link,
"class": "pt-1 pb-1 flex items-center" "class": "pt-1 pb-1 flex items-center hover:text-indigo-600"
}, { }, {
"default": (0,vue__WEBPACK_IMPORTED_MODULE_0__.withCtx)(function () { "default": (0,vue__WEBPACK_IMPORTED_MODULE_0__.withCtx)(function () {
return [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_unicon, { return [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_unicon, {
@ -23013,7 +23013,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
/* TEXT */ /* TEXT */
)]), $props.contract.link ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)("div", _hoisted_19, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_inertia_link, { )]), $props.contract.link ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)("div", _hoisted_19, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_inertia_link, {
href: $props.contract.link, href: $props.contract.link,
"class": "pt-1 pb-1 flex items-center" "class": "pt-1 pb-1 flex items-center hover:text-indigo-600"
}, { }, {
"default": (0,vue__WEBPACK_IMPORTED_MODULE_0__.withCtx)(function () { "default": (0,vue__WEBPACK_IMPORTED_MODULE_0__.withCtx)(function () {
return [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_unicon, { return [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_unicon, {
@ -23767,13 +23767,7 @@ __webpack_require__.r(__webpack_exports__);
/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ "./node_modules/vue/dist/vue.esm-bundler.js"); /* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ "./node_modules/vue/dist/vue.esm-bundler.js");
var _hoisted_1 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)("div", { var _hoisted_1 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createTextVNode)(" Your SwissCar ");
"class": "w-full h-20 border-b flex px-4 items-center mb-8"
}, [/*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)("p", {
"class": "font-semibold text-2xl text-blue-400 pl-4"
}, "Your SwissCar")], -1
/* HOISTED */
);
var _hoisted_2 = { var _hoisted_2 = {
"class": "mb-4 px-4" "class": "mb-4 px-4"
@ -23820,6 +23814,8 @@ var _hoisted_15 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createTextVNo
var _hoisted_16 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createTextVNode)(" Verkäufer "); var _hoisted_16 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createTextVNode)(" Verkäufer ");
function render(_ctx, _cache, $props, $setup, $data, $options) { function render(_ctx, _cache, $props, $setup, $data, $options) {
var _component_inertia_link = (0,vue__WEBPACK_IMPORTED_MODULE_0__.resolveComponent)("inertia-link");
var _component_unicon = (0,vue__WEBPACK_IMPORTED_MODULE_0__.resolveComponent)("unicon"); var _component_unicon = (0,vue__WEBPACK_IMPORTED_MODULE_0__.resolveComponent)("unicon");
var _component_jet_nav_link = (0,vue__WEBPACK_IMPORTED_MODULE_0__.resolveComponent)("jet-nav-link"); var _component_jet_nav_link = (0,vue__WEBPACK_IMPORTED_MODULE_0__.resolveComponent)("jet-nav-link");
@ -23827,7 +23823,19 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
return (0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)(vue__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)(" give the sidebar z-50 class so its higher than the navbar if you want to see the logo "), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)(" you will need to add a little \"X\" button next to the logo in order to close it though "), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)("div", { return (0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)(vue__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)(" give the sidebar z-50 class so its higher than the navbar if you want to see the logo "), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)(" you will need to add a little \"X\" button next to the logo in order to close it though "), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)("div", {
"class": ["w-1/2 md:w-1/3 lg:w-64 fixed md:top-0 md:left-0 h-screen lg:block bg-white border-r z-30", _ctx.sideBarOpen ? '' : 'hidden'], "class": ["w-1/2 md:w-1/3 lg:w-64 fixed md:top-0 md:left-0 h-screen lg:block bg-white border-r z-30", _ctx.sideBarOpen ? '' : 'hidden'],
id: "main-nav" id: "main-nav"
}, [_hoisted_1, (0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)("div", _hoisted_2, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_jet_nav_link, { }, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_inertia_link, {
href: _ctx.route('dashboard'),
"class": "w-full h-20 border-b bg-white flex justify-center items-center mb-8 text-indigo-400 font-semibold text-2xl hover:text-indigo-600 transition"
}, {
"default": (0,vue__WEBPACK_IMPORTED_MODULE_0__.withCtx)(function () {
return [_hoisted_1];
}),
_: 1
/* STABLE */
}, 8
/* PROPS */
, ["href"]), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)("div", _hoisted_2, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)(_component_jet_nav_link, {
href: _ctx.route('dashboard'), href: _ctx.route('dashboard'),
active: _ctx.route().current('dashboard') active: _ctx.route().current('dashboard')
}, { }, {
@ -31231,13 +31239,13 @@ var _hoisted_1 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)("
); );
var _hoisted_2 = { var _hoisted_2 = {
"class": "max-w-4xl mx-auto" "class": "max-w-2xl mx-auto"
}; };
var _hoisted_3 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createTextVNode)(" Neuen Bericht erstellen "); var _hoisted_3 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createTextVNode)(" Neuen Bericht erstellen ");
var _hoisted_4 = { var _hoisted_4 = {
"class": "col-span-6 sm:col-span-4" "class": "col-span-6 sm:col-span-3"
}; };
function render(_ctx, _cache, $props, $setup, $data, $options) { function render(_ctx, _cache, $props, $setup, $data, $options) {
var _this = this; var _this = this;

View File

@ -1,5 +1,5 @@
<template> <template>
<inertia-link :href="href" class="text-indigo-400 hover:text-indigo-600" > <inertia-link :href="href" class="text-indigo-400 hover:text-indigo-600 transition" >
{{ text }} / {{ text }} /
</inertia-link> </inertia-link>
</template> </template>

View File

@ -50,7 +50,7 @@
{{ car.notes }} {{ car.notes }}
</div> </div>
<div v-if="car.link" class="pt-3 mt-3 border-t"> <div v-if="car.link" class="pt-3 mt-3 border-t">
<inertia-link :href="car.link" class="pt-1 pb-1 flex items-center"> <inertia-link :href="car.link" class="pt-1 pb-1 flex items-center hover:text-indigo-600">
<unicon class="mr-1" height="22" width="22" name="arrow-right"></unicon> <unicon class="mr-1" height="22" width="22" name="arrow-right"></unicon>
Zum Auto Zum Auto
</inertia-link> </inertia-link>

View File

@ -13,13 +13,13 @@
{{ contact.zip + ' ' + contact.city + ' ' + contact.country }} {{ contact.zip + ' ' + contact.city + ' ' + contact.country }}
</div> </div>
<div v-if="contact.email" class="mt-3"> <div v-if="contact.email" class="mt-3">
<a :href="'mailto:' + contact.email" class="pt-1 pb-1 flex items-center"> <a :href="'mailto:' + contact.email" class="pt-1 pb-1 flex items-center hover:text-indigo-600">
<unicon class="mr-1" height="22" width="22" name="envelope"></unicon> <unicon class="mr-1" height="22" width="22" name="envelope"></unicon>
{{ contact.email }} {{ contact.email }}
</a> </a>
</div> </div>
<div v-if="contact.phone" class="mt-1"> <div v-if="contact.phone" class="mt-1">
<a :href="'phone:' + contact.phone" class="pt-1 pb-1 flex items-center"> <a :href="'phone:' + contact.phone" class="pt-1 pb-1 flex items-center hover:text-indigo-600">
<unicon class="mr-1" height="22" width="22" name="phone"></unicon> <unicon class="mr-1" height="22" width="22" name="phone"></unicon>
{{ contact.phone }} {{ contact.phone }}
</a> </a>
@ -29,7 +29,7 @@
{{ contact.notes }} {{ contact.notes }}
</div> </div>
<div v-if="contact.link" class="pt-3 mt-3 border-t"> <div v-if="contact.link" class="pt-3 mt-3 border-t">
<inertia-link :href="contact.link" class="pt-1 pb-1 flex items-center"> <inertia-link :href="contact.link" class="pt-1 pb-1 flex items-center hover:text-indigo-600">
<unicon class="mr-1" height="22" width="22" name="arrow-right"></unicon> <unicon class="mr-1" height="22" width="22" name="arrow-right"></unicon>
Zum Kontakt Zum Kontakt
</inertia-link> </inertia-link>

View File

@ -44,7 +44,7 @@
</div> </div>
</div> </div>
<div v-if="contract.link" class="pt-3 mt-3 border-t"> <div v-if="contract.link" class="pt-3 mt-3 border-t">
<inertia-link :href="contract.link" class="pt-1 pb-1 flex items-center"> <inertia-link :href="contract.link" class="pt-1 pb-1 flex items-center hover:text-indigo-600">
<unicon class="mr-1" height="22" width="22" name="arrow-right"></unicon> <unicon class="mr-1" height="22" width="22" name="arrow-right"></unicon>
Zum Vertrag Zum Vertrag
</inertia-link> </inertia-link>

View File

@ -3,9 +3,9 @@
<!-- you will need to add a little "X" button next to the logo in order to close it though --> <!-- you will need to add a little "X" button next to the logo in order to close it though -->
<div class="w-1/2 md:w-1/3 lg:w-64 fixed md:top-0 md:left-0 h-screen lg:block bg-white border-r z-30" :class="sideBarOpen ? '' : 'hidden'" id="main-nav"> <div class="w-1/2 md:w-1/3 lg:w-64 fixed md:top-0 md:left-0 h-screen lg:block bg-white border-r z-30" :class="sideBarOpen ? '' : 'hidden'" id="main-nav">
<div class="w-full h-20 border-b flex px-4 items-center mb-8"> <inertia-link :href="route('dashboard')" class="w-full h-20 border-b bg-white flex justify-center items-center mb-8 text-indigo-400 font-semibold text-2xl hover:text-indigo-600 transition">
<p class="font-semibold text-2xl text-blue-400 pl-4">Your SwissCar</p> Your SwissCar
</div> </inertia-link>
<div class="mb-4 px-4"> <div class="mb-4 px-4">
<jet-nav-link :href="route('dashboard')" :active="route().current('dashboard')"> <jet-nav-link :href="route('dashboard')" :active="route().current('dashboard')">

View File

@ -11,8 +11,8 @@
computed: { computed: {
classes() { classes() {
return this.active return this.active
? 'w-full flex items-center text-blue-600 h-10 pl-4 bg-gray-200 hover:bg-gray-200 rounded-lg cursor-pointer' ? 'w-full flex items-center text-blue-600 h-10 pl-4 bg-gray-200 hover:bg-gray-200 rounded-lg cursor-pointer transition'
: 'w-full flex items-center text-gray-800 h-10 pl-4 hover:bg-gray-200 rounded-lg cursor-pointer' : 'w-full flex items-center text-gray-800 h-10 pl-4 hover:bg-gray-200 rounded-lg cursor-pointer transition'
} }
} }
} }

View File

@ -5,14 +5,14 @@
Berichte Berichte
</h2> </h2>
</template> </template>
<div class="max-w-4xl mx-auto"> <div class="max-w-2xl mx-auto">
<jet-form-section> <jet-form-section>
<template #title> <template #title>
Neuen Bericht erstellen Neuen Bericht erstellen
</template> </template>
<template #form> <template #form>
<div class="col-span-6 sm:col-span-4"> <div class="col-span-6 sm:col-span-3">
<jet-label for="year" value="Jahr" /> <jet-label for="year" value="Jahr" />
<select v-model="year" class="mt-1 block w-full border-gray-300 focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 rounded-md shadow-sm"> <select v-model="year" class="mt-1 block w-full border-gray-300 focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 rounded-md shadow-sm">
<option v-for="year in years" :value="year" v-bind:key="year" :selected="this.year == year">{{ year }}</option> <option v-for="year in years" :value="year" v-bind:key="year" :selected="this.year == year">{{ year }}</option>