rm _ from tags
This commit is contained in:
samaradel
@@ -49,7 +49,7 @@
|
||||
@click="setActive(0)"
|
||||
class="flex flex-row items-center w-full md:w-auto md:inline md:mt-0 md:ml-4 animated-link"
|
||||
>
|
||||
<span class="capitalize">{{ topic.replace("_", " ") }}</span>
|
||||
<span class="capitalize">{{ topic.replace(/_/g, " ") }}</span>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
viewBox="0 0 20 20"
|
||||
@@ -89,7 +89,7 @@
|
||||
open = false;
|
||||
"
|
||||
class="cursor-pointer block px-4 py-2 mt-2 text-sm font-semibold bg-transparent rounded-lg dark:bg-transparent dark:hover:bg-gray-600 dark-:focus:bg-gray-600 dark:focus:text-white dark:hover:text-white dark:text-gray-200 md:mt-0 hover:text-gray-900 focus:text-gray-900 hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline"
|
||||
>{{ topic.replace("_", " ") }}</a
|
||||
>{{ topic.replace(/_/g, " ") }}</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,7 +1,17 @@
|
||||
<template>
|
||||
<div class="left-0 z-50 mb-5 h-16 bg-gray-200 w-full rounded shadow">
|
||||
<header
|
||||
class="flex items-center flex-wrap container mx-auto pt-1 pb-0 sm:px-0 transition-all transition-500"
|
||||
class="
|
||||
flex
|
||||
items-center
|
||||
flex-wrap
|
||||
container
|
||||
mx-auto
|
||||
pt-1
|
||||
pb-0
|
||||
sm:px-0
|
||||
transition-all transition-500
|
||||
"
|
||||
>
|
||||
<div class="flex items-center justify-between px-4 sm:p-0">
|
||||
<div class="inline-flex items-center flex-shrink-0">
|
||||
@@ -18,19 +28,45 @@
|
||||
|
||||
<nav
|
||||
:class="isOpen ? 'block' : 'hidden'"
|
||||
class="inline-flex md:order-2 px-2 pt-2 pb-4 sm:flex sm:p-0 bg-transparent"
|
||||
class="
|
||||
inline-flex
|
||||
md:order-2
|
||||
px-2
|
||||
pt-2
|
||||
pb-4
|
||||
sm:flex
|
||||
sm:p-0
|
||||
bg-transparent
|
||||
"
|
||||
>
|
||||
<ul
|
||||
class="list-none sm:flex justify-left capitalize transition-all transition-500"
|
||||
class="
|
||||
list-none
|
||||
sm:flex
|
||||
justify-left
|
||||
capitalize
|
||||
transition-all transition-500
|
||||
"
|
||||
>
|
||||
<!-- Tags -->
|
||||
<li class="pt-2 mx-5">
|
||||
<div class="relative" x-data="{ open: false }">
|
||||
<button
|
||||
@click="setActive(0)"
|
||||
class="flex flex-row items-center w-full md:w-auto md:inline md:mt-0 md:ml-4 animated-link"
|
||||
class="
|
||||
flex flex-row
|
||||
items-center
|
||||
w-full
|
||||
md:w-auto
|
||||
md:inline
|
||||
md:mt-0
|
||||
md:ml-4
|
||||
animated-link
|
||||
"
|
||||
>
|
||||
<span class="capitalize">{{ selected.replace("_", " ") }}</span>
|
||||
<span class="capitalize">{{
|
||||
selected.replace(/_/g, " ")
|
||||
}}</span>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
viewBox="0 0 20 20"
|
||||
@@ -38,7 +74,17 @@
|
||||
'rotate-180': active == 0,
|
||||
'rotate-0': active == !0,
|
||||
}"
|
||||
class="inline w-4 h-4 mt-1 ml-1 transition-transform duration-200 transform md:-mt-1"
|
||||
class="
|
||||
inline
|
||||
w-4
|
||||
h-4
|
||||
mt-1
|
||||
ml-1
|
||||
transition-transform
|
||||
duration-200
|
||||
transform
|
||||
md:-mt-1
|
||||
"
|
||||
>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
@@ -56,19 +102,60 @@
|
||||
x-transition:leave="transition ease-in duration-75"
|
||||
x-transition:leave-start="transform opacity-100 scale-100"
|
||||
x-transition:leave-end="transform opacity-0 scale-95"
|
||||
class="absolute w-full mt-2 origin-top-right rounded-md shadow-lg md:w-48 z-30"
|
||||
class="
|
||||
absolute
|
||||
w-full
|
||||
mt-2
|
||||
origin-top-right
|
||||
rounded-md
|
||||
shadow-lg
|
||||
md:w-48
|
||||
z-30
|
||||
"
|
||||
>
|
||||
<div
|
||||
v-if="open"
|
||||
class="w-64 max-h-10 px-2 py-2 bg-white rounded-md shadow dark:bg-gray-700"
|
||||
class="
|
||||
w-64
|
||||
max-h-10
|
||||
px-2
|
||||
py-2
|
||||
bg-white
|
||||
rounded-md
|
||||
shadow
|
||||
dark:bg-gray-700
|
||||
"
|
||||
>
|
||||
<a
|
||||
v-for="tag in tags"
|
||||
:key="tag.path"
|
||||
class="cursor-pointer block px-4 py-2 mt-2 text-sm font-semibold bg-transparent rounded-lg dark:bg-transparent dark:hover:bg-gray-600 dark-:focus:bg-gray-600 dark:focus:text-white dark:hover:text-white dark:text-gray-200 md:mt-0 hover:text-gray-900 focus:text-gray-900 hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline"
|
||||
class="
|
||||
cursor-pointer
|
||||
block
|
||||
px-4
|
||||
py-2
|
||||
mt-2
|
||||
text-sm
|
||||
font-semibold
|
||||
bg-transparent
|
||||
rounded-lg
|
||||
dark:bg-transparent
|
||||
dark:hover:bg-gray-600
|
||||
dark-:focus:bg-gray-600
|
||||
dark:focus:text-white
|
||||
dark:hover:text-white
|
||||
dark:text-gray-200
|
||||
md:mt-0
|
||||
hover:text-gray-900
|
||||
focus:text-gray-900
|
||||
hover:bg-gray-200
|
||||
focus:bg-gray-200
|
||||
focus:outline-none
|
||||
focus:shadow-outline
|
||||
"
|
||||
:href="$url(tag.path)"
|
||||
@click="open = false"
|
||||
>{{ tag.title.replace("_", " ") }}</a
|
||||
>{{ tag.title.replace(/_/g, " ") }}</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user