mirror of
https://github.com/KevinMidboe/seasoned.git
synced 2026-03-11 11:55:38 +00:00
sidebar element icon is now optional and added more strict styling
This commit is contained in:
@@ -1,8 +1,10 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<a @click="$emit('click')"><li>
|
<a @click="$emit('click')"><li>
|
||||||
<figure :class="activeClassIfActive">
|
<figure :class="activeClassIfActive" v-if="iconRefNameIfActive">
|
||||||
<svg><use :xlink:href="iconRefNameIfActive"/></svg>
|
<svg class="icon">
|
||||||
|
<use :xlink:href="iconRefNameIfActive"/>
|
||||||
|
</svg>
|
||||||
</figure>
|
</figure>
|
||||||
|
|
||||||
<span :class="activeClassIfActive">{{ contentTextToDisplay }}</span>
|
<span :class="activeClassIfActive">{{ contentTextToDisplay }}</span>
|
||||||
@@ -21,7 +23,7 @@ export default {
|
|||||||
props: {
|
props: {
|
||||||
iconRef: {
|
iconRef: {
|
||||||
type: String,
|
type: String,
|
||||||
required: true
|
required: false
|
||||||
},
|
},
|
||||||
iconRefActive: {
|
iconRefActive: {
|
||||||
type: String,
|
type: String,
|
||||||
@@ -44,7 +46,7 @@ export default {
|
|||||||
iconRefNameIfActive() {
|
iconRefNameIfActive() {
|
||||||
const { iconRefActive, iconRef, active } = this
|
const { iconRefActive, iconRef, active } = this
|
||||||
|
|
||||||
if ((iconRefActive && iconRef) & active) {
|
if ((iconRefActive && iconRef) && active) {
|
||||||
return iconRefActive
|
return iconRefActive
|
||||||
}
|
}
|
||||||
return iconRef
|
return iconRef
|
||||||
@@ -98,7 +100,7 @@ li {
|
|||||||
text-align: right;
|
text-align: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
figure, figure > svg {
|
figure, figure > .icon {
|
||||||
width: 18px;
|
width: 18px;
|
||||||
height: 18px;
|
height: 18px;
|
||||||
margin: 0 7px 0 0;
|
margin: 0 7px 0 0;
|
||||||
|
|||||||
Reference in New Issue
Block a user