From d5120aafd2ef45d4c0bd32a126013b281dcabdcf Mon Sep 17 00:00:00 2001 From: philipp lang <philipp@aweos.de> Date: Sat, 12 Feb 2022 15:22:22 +0100 Subject: [PATCH] Rename svg sprite --- resources/js/app.js | 4 ++-- resources/js/components/FCheckbox.vue | 2 +- resources/js/components/FSelect.vue | 6 +++--- resources/js/components/FSwitch.vue | 4 ++-- resources/js/components/FText.vue | 2 +- resources/js/components/FTextarea.vue | 2 +- resources/js/components/SidebarHeader.vue | 6 +++--- resources/js/components/{Sprite.js => SvgSprite.js} | 0 resources/js/components/VBool.vue | 2 +- resources/js/layouts/AppLayout.vue | 2 +- resources/js/layouts/_VLink.vue | 2 +- resources/js/views/home/VIndex.vue | 2 +- resources/js/views/member/MemberCourses.vue | 4 ++-- resources/js/views/member/MemberMemberships.vue | 4 ++-- resources/js/views/member/MemberPayments.vue | 6 +++--- resources/js/views/member/VIndex.vue | 12 ++++++------ .../js/views/subscription/SubscriptionIndex.vue | 2 +- 17 files changed, 31 insertions(+), 31 deletions(-) rename resources/js/components/{Sprite.js => SvgSprite.js} (100%) diff --git a/resources/js/app.js b/resources/js/app.js index bc459a6b..001e6280 100644 --- a/resources/js/app.js +++ b/resources/js/app.js @@ -1,7 +1,7 @@ import Vue from 'vue'; import { App as InertiaApp, plugin, Link } from '@inertiajs/inertia-vue'; -import Sprite from './components/Sprite.js'; +import SvgSprite from './components/SvgSprite.js'; import FText from './components/FText.vue'; import FSwitch from './components/FSwitch.vue'; import FSelect from './components/FSelect.vue'; @@ -18,7 +18,7 @@ Vue.component('f-text', FText); Vue.component('f-switch', FSwitch); Vue.component('f-select', FSelect); Vue.component('f-textarea', FTextarea); -Vue.component('sprite', Sprite); +Vue.component('SvgSprite', SvgSprite); Vue.component('VPages', VPages); Vue.component('v-bool', VBool); diff --git a/resources/js/components/FCheckbox.vue b/resources/js/components/FCheckbox.vue index 0d96f05d..8adbb97a 100644 --- a/resources/js/components/FCheckbox.vue +++ b/resources/js/components/FCheckbox.vue @@ -5,7 +5,7 @@ <input :id="id" type="checkbox" v-model="v" :disabled="disabled" class="invisible absolute" /> <span class="display-wrapper flex items-center"> <span class="relative cursor-pointer flex flex-none justify-center items-center display" :class="{'bg-terminoto-2': v === true, 'bg-white': v === false}"> - <sprite src="check" class="w-4 h-4 check-icon text-white"></sprite> + <svg-sprite src="check" class="w-4 h-4 check-icon text-white"></svg-sprite> </span> </span> <span v-if="label && !inset" class="text-sm leading-tight ml-3 text-gray-700 checkbox-label flex items-center"> diff --git a/resources/js/components/FSelect.vue b/resources/js/components/FSelect.vue index 2cc56ad8..376dd4e8 100644 --- a/resources/js/components/FSelect.vue +++ b/resources/js/components/FSelect.vue @@ -14,13 +14,13 @@ </select> <div class="info-wrap"> <div v-if="hint" v-tooltip="hint"> - <sprite src="info-button" class="info-button"></sprite> + <svg-sprite src="info-button" class="info-button"></svg-sprite> </div> <div class="px-1 relative" v-if="size != 'xs'"> - <sprite class="chevron w-3 h-3 fill-current" src="chevron-down"></sprite> + <svg-sprite class="chevron w-3 h-3 fill-current" src="chevron-down"></svg-sprite> </div> <div class="px-1 relative" v-if="size == 'xs'"> - <sprite class="chevron w-2 h-2 fill-current" src="chevron-down"></sprite> + <svg-sprite class="chevron w-2 h-2 fill-current" src="chevron-down"></svg-sprite> </div> </div> </div> diff --git a/resources/js/components/FSwitch.vue b/resources/js/components/FSwitch.vue index 2bb07c18..5d45de8f 100644 --- a/resources/js/components/FSwitch.vue +++ b/resources/js/components/FSwitch.vue @@ -7,8 +7,8 @@ <div class="relative inner-field mt-1" :class="`h-field-${fieldSize}`"> <input :id="id" type="checkbox" v-model="v" :disabled="disabled" class="invisible absolute" /> <span class="relative cursor-pointer flex grow display" :class="{'bg-switch': v === true, 'bg-gray-700': v === false}"> - <span><sprite class="relative text-gray-400 flex-none" :class="{'w-2 h-2': size === 'sm' || size == 'xs', 'w-4 h-4': size === null}" src="check"></sprite></span> - <span><sprite class="relative text-gray-400 flex-none" :class="{'w-2 h-2': size === 'sm' || size == 'xs', 'w-4 h-4': size === null}" src="close"></sprite></span> + <span><svg-sprite class="relative text-gray-400 flex-none" :class="{'w-2 h-2': size === 'sm' || size == 'xs', 'w-4 h-4': size === null}" src="check"></svg-sprite></span> + <span><svg-sprite class="relative text-gray-400 flex-none" :class="{'w-2 h-2': size === 'sm' || size == 'xs', 'w-4 h-4': size === null}" src="close"></svg-sprite></span> <var class="absolute overlay bg-gray-400 rounded top-0"></var> </span> </div> diff --git a/resources/js/components/FText.vue b/resources/js/components/FText.vue index c0ac656c..a8d16be1 100644 --- a/resources/js/components/FText.vue +++ b/resources/js/components/FText.vue @@ -8,7 +8,7 @@ <input :name="name" :type="type" :value="transformedValue" @input="onInput" @change="onChange" :disabled="disabled" :placeholder="placeholder" @focus="onFocus" @blur="onBlur"> <div v-if="hint" class="info-wrap"> <div v-tooltip="hint"> - <sprite src="info-button" class="info-button"></sprite> + <svg-sprite src="info-button" class="info-button"></svg-sprite> </div> </div> </div> diff --git a/resources/js/components/FTextarea.vue b/resources/js/components/FTextarea.vue index e38ab347..c0943de1 100644 --- a/resources/js/components/FTextarea.vue +++ b/resources/js/components/FTextarea.vue @@ -16,7 +16,7 @@ }" ></textarea> <div v-if="hint" v-tooltip="hint" class="absolute right-0 top-0 mr-2 mt-2"> - <sprite src="info-button" class="w-5 h-5 text-indigo-200"></sprite> + <svg-sprite src="info-button" class="w-5 h-5 text-indigo-200"></svg-sprite> </div> </label> </template> diff --git a/resources/js/components/SidebarHeader.vue b/resources/js/components/SidebarHeader.vue index 06e949d9..da32fb45 100644 --- a/resources/js/components/SidebarHeader.vue +++ b/resources/js/components/SidebarHeader.vue @@ -4,16 +4,16 @@ <span class="mr-1 text-xl font-semibold leading-none text-white" v-html="title"></span> <a v-for="link, index in links.filter(link => link.icon === undefined)" :key="index" @click.prevent="$emit(link.event)" href="#" class="btn label btn-primary-light"> <span v-if="link.label" v-text="link.label"></span> - <sprite v-if="link.icon" :src="link.icon"></sprite> + <svg-sprite v-if="link.icon" :src="link.icon"></svg-sprite> </a> <a v-for="link, index in links.filter(link => link.icon !== undefined)" :key="index" :href="link.href" class="btn label icon btn-primary-light ml-1"> <span v-if="link.label" v-text="link.label"></span> - <sprite v-if="link.icon" :src="link.icon"></sprite> + <svg-sprite v-if="link.icon" :src="link.icon"></svg-sprite> </a> </div> <div class="flex ml-4"> <a href="#" @click.prevent="$emit('close')" class="btn label btn-primary-light icon"> - <sprite class="w-3 h-3" src="close"></sprite> + <svg-sprite class="w-3 h-3" src="close"></svg-sprite> </a> </div> </div> diff --git a/resources/js/components/Sprite.js b/resources/js/components/SvgSprite.js similarity index 100% rename from resources/js/components/Sprite.js rename to resources/js/components/SvgSprite.js diff --git a/resources/js/components/VBool.vue b/resources/js/components/VBool.vue index ad684877..0c05e729 100644 --- a/resources/js/components/VBool.vue +++ b/resources/js/components/VBool.vue @@ -1,6 +1,6 @@ <template> <div class="bool" :class="value ? 'enabled' : 'disabled'"> - <sprite v-if="!$slots.default" :src="value ? 'check' : 'close'"></sprite> + <svg-sprite v-if="!$slots.default" :src="value ? 'check' : 'close'"></svg-sprite> <slot></slot> </div> </template> diff --git a/resources/js/layouts/AppLayout.vue b/resources/js/layouts/AppLayout.vue index 8fc8a600..cd6f9619 100644 --- a/resources/js/layouts/AppLayout.vue +++ b/resources/js/layouts/AppLayout.vue @@ -18,7 +18,7 @@ <span class="text-xl font-semibold text-white leading-none" v-html="$page.props.title"></span> <div class="flex ml-4"> <Link v-for="link, index in filterMenu" :key="index" :href="link.href" v-text="link.label" class="btn label mr-2" :class="`btn-${link.color}`"> - <sprite :src="link.icon"></sprite> + <svg-sprite :src="link.icon"></svg-sprite> </Link> </div> </div> diff --git a/resources/js/layouts/_VLink.vue b/resources/js/layouts/_VLink.vue index a76ca606..685c4815 100644 --- a/resources/js/layouts/_VLink.vue +++ b/resources/js/layouts/_VLink.vue @@ -1,6 +1,6 @@ <template> <Link class="flex text-white py-2 px-3 rounded-lg hover:bg-gray-600" :href="href" :class="{'bg-gray-700': $page.props.menu == menu}"> - <sprite class="text-white w-6 h-6 mr-4" :src="icon"></sprite> + <svg-sprite class="text-white w-6 h-6 mr-4" :src="icon"></svg-sprite> <span class="font-semibold"> <slot></slot> </span> diff --git a/resources/js/views/home/VIndex.vue b/resources/js/views/home/VIndex.vue index 07ee364f..8a2c9093 100644 --- a/resources/js/views/home/VIndex.vue +++ b/resources/js/views/home/VIndex.vue @@ -8,7 +8,7 @@ </v-block> <v-block title="Gruppierungs-Verteilung"> <div v-for="group, index in data.groups" :key="index" class="flex mt-2 items-center leading-none text-gray-100"> - <sprite class="w-4 h-4 mr-2" src="lilie" :class="`text-${group.slug}`"></sprite> + <svg-sprite class="w-4 h-4 mr-2" src="lilie" :class="`text-${group.slug}`"></svg-sprite> <span v-text="group.name" class="grow"></span> <span v-text="group.count"></span> </div> diff --git a/resources/js/views/member/MemberCourses.vue b/resources/js/views/member/MemberCourses.vue index 08b2e218..520f41da 100644 --- a/resources/js/views/member/MemberCourses.vue +++ b/resources/js/views/member/MemberCourses.vue @@ -26,8 +26,8 @@ <td v-text="course.organizer"></td> <td v-text="course.completed_at_human"></td> <td class="flex"> - <a href="#" @click.prevent="single = course; mode = 'edit'" class="inline-flex btn btn-warning btn-sm"><sprite src="pencil"></sprite></a> - <Link href="#" @click.prevent="remove(course)" class="inline-flex btn btn-danger btn-sm"><sprite src="trash"></sprite></Link> + <a href="#" @click.prevent="single = course; mode = 'edit'" class="inline-flex btn btn-warning btn-sm"><svg-sprite src="pencil"></svg-sprite></a> + <Link href="#" @click.prevent="remove(course)" class="inline-flex btn btn-danger btn-sm"><svg-sprite src="trash"></svg-sprite></Link> </td> </tr> </table> diff --git a/resources/js/views/member/MemberMemberships.vue b/resources/js/views/member/MemberMemberships.vue index e4cc5078..42bcfba2 100644 --- a/resources/js/views/member/MemberMemberships.vue +++ b/resources/js/views/member/MemberMemberships.vue @@ -22,8 +22,8 @@ <td v-text="membership.subactivity_name"></td> <td v-text="membership.human_date"></td> <td class="flex"> - <a href="#" @click.prevent="single = membership; mode = 'edit'" class="inline-flex btn btn-warning btn-sm"><sprite src="pencil"></sprite></a> - <Link href="#" @click.prevent="remove(membership)" class="inline-flex btn btn-danger btn-sm"><sprite src="trash"></sprite></Link> + <a href="#" @click.prevent="single = membership; mode = 'edit'" class="inline-flex btn btn-warning btn-sm"><svg-sprite src="pencil"></svg-sprite></a> + <Link href="#" @click.prevent="remove(membership)" class="inline-flex btn btn-danger btn-sm"><svg-sprite src="trash"></svg-sprite></Link> </td> </tr> </table> diff --git a/resources/js/views/member/MemberPayments.vue b/resources/js/views/member/MemberPayments.vue index d198f52a..b8a19ddb 100644 --- a/resources/js/views/member/MemberPayments.vue +++ b/resources/js/views/member/MemberPayments.vue @@ -23,9 +23,9 @@ <td v-text="payment.status_name"></td> <td v-text="payment.subscription_name"></td> <td class="flex"> - <a href="#" @click.prevent="single = payment; mode = 'edit'" class="inline-flex btn btn-warning btn-sm"><sprite src="pencil"></sprite></a> - <Link v-show="!payment.is_accepted" href="#" @click.prevent="accept(payment)" class="inline-flex btn btn-success btn-sm"><sprite src="check"></sprite></Link> - <Link href="#" @click.prevent="remove(payment)" class="inline-flex btn btn-danger btn-sm"><sprite src="trash"></sprite></Link> + <a href="#" @click.prevent="single = payment; mode = 'edit'" class="inline-flex btn btn-warning btn-sm"><svg-sprite src="pencil"></svg-sprite></a> + <Link v-show="!payment.is_accepted" href="#" @click.prevent="accept(payment)" class="inline-flex btn btn-success btn-sm"><svg-sprite src="check"></svg-sprite></Link> + <Link href="#" @click.prevent="remove(payment)" class="inline-flex btn btn-danger btn-sm"><svg-sprite src="trash"></svg-sprite></Link> </td> </tr> </table> diff --git a/resources/js/views/member/VIndex.vue b/resources/js/views/member/VIndex.vue index de0c87dd..ae359a7d 100644 --- a/resources/js/views/member/VIndex.vue +++ b/resources/js/views/member/VIndex.vue @@ -22,7 +22,7 @@ <tr v-for="member, index in data.data" :key="index"> <td class="w-3"> - <sprite class="w-3 h-3" v-if="member.age_group_icon" :class="`text-${member.age_group_icon}`" src="lilie"></sprite> + <svg-sprite class="w-3 h-3" v-if="member.age_group_icon" :class="`text-${member.age_group_icon}`" src="lilie"></svg-sprite> </td> <td v-text="member.lastname"></td> <td v-text="member.firstname"></td> @@ -51,11 +51,11 @@ </td> <td v-text="`${member.joined_at_human}`"></td> <td class="flex"> - <Link :href="`/member/${member.id}/edit`" class="inline-flex btn btn-warning btn-sm"><sprite src="pencil"></sprite></Link> - <a href="#" v-show="hasModule('bill')" @click.prevent="openSidebar(index, 'payment.index')" class="inline-flex btn btn-info btn-sm"><sprite src="money"></sprite></a> - <a href="#" v-show="hasModule('courses')" @click.prevent="openSidebar(index, 'courses.index')" class="inline-flex btn btn-info btn-sm"><sprite src="course"></sprite></a> - <a href="#" @click.prevent="openSidebar(index, 'membership.index')" class="inline-flex btn btn-info btn-sm"><sprite src="user"></sprite></a> - <Link href="#" @click.prevent="remove(member)" class="inline-flex btn btn-danger btn-sm"><sprite src="trash"></sprite></Link> + <Link :href="`/member/${member.id}/edit`" class="inline-flex btn btn-warning btn-sm"><svg-sprite src="pencil"></svg-sprite></Link> + <a href="#" v-show="hasModule('bill')" @click.prevent="openSidebar(index, 'payment.index')" class="inline-flex btn btn-info btn-sm"><svg-sprite src="money"></svg-sprite></a> + <a href="#" v-show="hasModule('courses')" @click.prevent="openSidebar(index, 'courses.index')" class="inline-flex btn btn-info btn-sm"><svg-sprite src="course"></svg-sprite></a> + <a href="#" @click.prevent="openSidebar(index, 'membership.index')" class="inline-flex btn btn-info btn-sm"><svg-sprite src="user"></svg-sprite></a> + <Link href="#" @click.prevent="remove(member)" class="inline-flex btn btn-danger btn-sm"><svg-sprite src="trash"></svg-sprite></Link> </td> </tr> diff --git a/resources/js/views/subscription/SubscriptionIndex.vue b/resources/js/views/subscription/SubscriptionIndex.vue index 47584b8b..12a9fd59 100644 --- a/resources/js/views/subscription/SubscriptionIndex.vue +++ b/resources/js/views/subscription/SubscriptionIndex.vue @@ -13,7 +13,7 @@ <div class="py-1 px-6" v-text="sub.amount_human"></div> <div class="py-1 px-6" v-text="sub.fee_name"></div> <div class="py-1 px-6 flex"> - <Link :href="`/subscription/${sub.id}/edit`" class="inline-flex btn btn-warning btn-sm"><sprite src="pencil"></sprite></Link> + <Link :href="`/subscription/${sub.id}/edit`" class="inline-flex btn btn-warning btn-sm"><svg-sprite src="pencil"></svg-sprite></Link> </div> </div>