jaro/flowbite-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
Files
8963a831478c93d042e13c94c8f59e56194acba2
flowbite-vue/docs/.vitepress/dist/assets/components_flowbiteThemable_flowbiteThemable.md.696f24eb.js
Jaroslav Drzik a27c84b7a9 dist directory
2024-03-12 05:28:28 +01:00

70 lines
22 KiB
JavaScript
Raw Blame History

This file contains invisible Unicode characters
This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
import"./chunks/FwbRange.vue_vue_type_style_index_0_scoped_fadec9c5_lang.66ff4c69.js";import{_ as v,a as d}from"./chunks/FwbTabs.vue_vue_type_script_setup_true_lang.ebf7e19d.js";import{_ as i}from"./chunks/FwbRadio.vue_vue_type_script_setup_true_lang.a8d8cba7.js";import{_ as h}from"./chunks/FlowbiteThemable.vue_vue_type_script_setup_true_lang.e3bec3bf.js";import{d as f,h as _,o as E,c as y,k as t,H as a,w as l,a as e,l as n,F as g,D as F,t as w,Q as m}from"./chunks/framework.3f630664.js";import{_ as A}from"./chunks/FwbButton.vue_vue_type_script_setup_true_lang.47b4329e.js";import{F as D}from"./chunks/FwbDropdown.e54fafa7.js";import"./chunks/flatten.a0535777.js";import"./chunks/simplifyTailwindClasses.275301d3.js";import"./chunks/useFlowbiteThemable.013ea29e.js";import"./chunks/useMergeClasses.5cec3a4e.js";import"./chunks/FwbSpinner.vue_vue_type_script_setup_true_lang.40262df1.js";import"./chunks/index.b15c605d.js";import"./chunks/index.6b4d4439.js";import"./chunks/FwbSlotListener.vue_vue_type_script_lang.85726df2.js";import"./chunks/isArray.513c67aa.js";const T={class:"vp-raw"},V=t("span",{class:""},"Select theme:",-1),C={class:"grid xs:grid-cols-5 md:grid-cols-7 mb-5 mt-2"},b=f({__name:"FlowbiteThemableExampleTabs",props:{tabsVariant:{type:String,default:"default"}},setup(u){const o=_("first"),p=_("blue");return(r,s)=>(E(),y("div",T,[V,t("div",C,[a(n(i),{modelValue:p.value,"onUpdate:modelValue":s[0]||(s[0]=c=>p.value=c),value:"blue"},{default:l(()=>[e(" Blue ")]),_:1},8,["modelValue"]),a(n(i),{modelValue:p.value,"onUpdate:modelValue":s[1]||(s[1]=c=>p.value=c),value:"green"},{default:l(()=>[e(" Green ")]),_:1},8,["modelValue"]),a(n(i),{modelValue:p.value,"onUpdate:modelValue":s[2]||(s[2]=c=>p.value=c),value:"pink"},{default:l(()=>[e(" Pink ")]),_:1},8,["modelValue"]),a(n(i),{modelValue:p.value,"onUpdate:modelValue":s[3]||(s[3]=c=>p.value=c),value:"purple"},{default:l(()=>[e(" Purple ")]),_:1},8,["modelValue"]),a(n(i),{modelValue:p.value,"onUpdate:modelValue":s[4]||(s[4]=c=>p.value=c),value:"red"},{default:l(()=>[e(" Red ")]),_:1},8,["modelValue"])]),a(n(h),{theme:p.value},{default:l(()=>[a(n(v),{modelValue:o.value,"onUpdate:modelValue":s[5]||(s[5]=c=>o.value=c),class:"p-5",variant:u.tabsVariant},{default:l(()=>[a(n(d),{name:"first",title:"First"},{default:l(()=>[e(" Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab aspernatur debitis iste libero molestiae mollitia, optio sunt? A, consectetur distinctio, eaque harum iusto laudantium, molestiae nam odio officia pariatur vitae? ")]),_:1}),a(n(d),{name:"second",title:"Second"},{default:l(()=>[e(" Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam asperiores autem cupiditate, deleniti eligendi exercitationem magnam maiores, minus pariatur provident quasi qui quidem recusandae rem reprehenderit sapiente sequi sint soluta. ")]),_:1}),a(n(d),{name:"third",title:"Third"},{default:l(()=>[e(" Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam animi aperiam assumenda consectetur, dolorem, dolores, ea eos ipsum itaque iure laudantium nostrum nulla numquam perspiciatis provident qui quod totam voluptatem. ")]),_:1}),a(n(d),{name:"fourth",title:"Fourth",disabled:""},{default:l(()=>[e(" Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto blanditiis cupiditate ea error eveniet hic impedit in labore maxime, minima mollitia nam sapiente sint tempora tempore vel velit veniam, voluptatem. ")]),_:1})]),_:1},8,["modelValue","variant"])]),_:1},8,["theme"])]))}}),k={class:"vp-raw"},q={class:"flex align-center gap-2 flex-wrap"},B=f({__name:"FlowbiteThemableExampleButton",props:{theme:{type:String,default:"blue"}},setup(u){const o=["blue","green","red","pink","purple"];return(p,r)=>(E(),y("div",k,[t("div",q,[(E(),y(g,null,F(o,s=>a(n(h),{key:s,theme:s},{default:l(()=>[a(n(A),null,{default:l(()=>[e(w(s),1)]),_:2},1024)]),_:2},1032,["theme"])),64))])]))}}),x={class:"vp-raw"},P=t("span",{class:""},"Select theme:",-1),S={class:"grid xs:grid-cols-5 md:grid-cols-7 mb-5 mt-2"},$={class:"inline-flex align-center gap-2 flex-wrap"},U=f({__name:"FlowbiteThemableExampleDropdown",setup(u){const o=_("blue");return(p,r)=>(E(),y("div",x,[P,t("div",S,[a(n(i),{modelValue:o.value,"onUpdate:modelValue":r[0]||(r[0]=s=>o.value=s),value:"blue"},{default:l(()=>[e(" Blue ")]),_:1},8,["modelValue"]),a(n(i),{modelValue:o.value,"onUpdate:modelValue":r[1]||(r[1]=s=>o.value=s),value:"green"},{default:l(()=>[e(" Green ")]),_:1},8,["modelValue"]),a(n(i),{modelValue:o.value,"onUpdate:modelValue":r[2]||(r[2]=s=>o.value=s),value:"pink"},{default:l(()=>[e(" Pink ")]),_:1},8,["modelValue"]),a(n(i),{modelValue:o.value,"onUpdate:modelValue":r[3]||(r[3]=s=>o.value=s),value:"purple"},{default:l(()=>[e(" Purple ")]),_:1},8,["modelValue"]),a(n(i),{modelValue:o.value,"onUpdate:modelValue":r[4]||(r[4]=s=>o.value=s),value:"red"},{default:l(()=>[e(" Red ")]),_:1},8,["modelValue"])]),t("div",$,[a(n(h),{theme:o.value},{default:l(()=>[a(n(D),{text:"Dropdown"},{default:l(()=>[e(" Dropdown content... ")]),_:1})]),_:1},8,["theme"])])]))}}),I=m('<h1 id="vue-themable-configuration-flowbite" tabindex="-1">Vue Themable Configuration - Flowbite <a class="header-anchor" href="#vue-themable-configuration-flowbite" aria-label="Permalink to &quot;Vue Themable Configuration - Flowbite&quot;">​</a></h1><p>You can use this wrapper for styling components with no color prop(like tabs, dropdown etc.)</p><div class="warning custom-block"><p class="custom-block-title">WARNING</p><p>WIP, Do not use it in production</p></div><h2 id="tabs" tabindex="-1">Tabs <a class="header-anchor" href="#tabs" aria-label="Permalink to &quot;Tabs&quot;">​</a></h2>',4),N=m(`<div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">template</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="color:#E1E4E8;"> &lt;</span><span style="color:#85E89D;">flowbite-themable</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">:theme</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;theme&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="color:#E1E4E8;"> &lt;</span><span style="color:#85E89D;">fwb-tabs</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">:variant</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;variant&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="color:#E1E4E8;"> ...</span></span>
<span class="line"><span style="color:#E1E4E8;"> &lt;/</span><span style="color:#85E89D;">fwb-tabs</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="color:#E1E4E8;"> &lt;/</span><span style="color:#85E89D;">flowbite-themable</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="color:#E1E4E8;">&lt;/</span><span style="color:#85E89D;">template</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">script</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">setup</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="color:#F97583;">import</span><span style="color:#E1E4E8;"> { FwbTabs, FwbTab, FlowbiteThemable } </span><span style="color:#F97583;">from</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;flowbite-vue&#39;</span></span>
<span class="line"><span style="color:#F97583;">const</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">theme</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;blue&#39;</span><span style="color:#E1E4E8;"> </span><span style="color:#6A737D;">// &#39;blue&#39;, &#39;green&#39;, &#39;red&#39;, &#39;pink&#39;, &#39;purple&#39;</span></span>
<span class="line"><span style="color:#F97583;">const</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">variant</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;default&#39;</span><span style="color:#E1E4E8;"> </span><span style="color:#6A737D;">// see tabs docs</span></span>
<span class="line"><span style="color:#E1E4E8;">&lt;/</span><span style="color:#85E89D;">script</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">template</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#24292E;"> &lt;</span><span style="color:#22863A;">flowbite-themable</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">:theme</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;theme&quot;</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#24292E;"> &lt;</span><span style="color:#22863A;">fwb-tabs</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">:variant</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;variant&quot;</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#24292E;"> ...</span></span>
<span class="line"><span style="color:#24292E;"> &lt;/</span><span style="color:#22863A;">fwb-tabs</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#24292E;"> &lt;/</span><span style="color:#22863A;">flowbite-themable</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#24292E;">&lt;/</span><span style="color:#22863A;">template</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">script</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">setup</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#D73A49;">import</span><span style="color:#24292E;"> { FwbTabs, FwbTab, FlowbiteThemable } </span><span style="color:#D73A49;">from</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;flowbite-vue&#39;</span></span>
<span class="line"><span style="color:#D73A49;">const</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">theme</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;blue&#39;</span><span style="color:#24292E;"> </span><span style="color:#6A737D;">// &#39;blue&#39;, &#39;green&#39;, &#39;red&#39;, &#39;pink&#39;, &#39;purple&#39;</span></span>
<span class="line"><span style="color:#D73A49;">const</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">variant</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;default&#39;</span><span style="color:#24292E;"> </span><span style="color:#6A737D;">// see tabs docs</span></span>
<span class="line"><span style="color:#24292E;">&lt;/</span><span style="color:#22863A;">script</span><span style="color:#24292E;">&gt;</span></span></code></pre></div><h3 id="variant-pills" tabindex="-1">variant: pills <a class="header-anchor" href="#variant-pills" aria-label="Permalink to &quot;variant: pills&quot;">​</a></h3><hr>`,3),R=t("hr",null,null,-1),L=t("h3",{id:"variant-underline",tabindex:"-1"},[e("variant: underline "),t("a",{class:"header-anchor",href:"#variant-underline","aria-label":'Permalink to "variant: underline"'},"​")],-1),G=t("hr",null,null,-1),O=t("hr",null,null,-1),W=t("h2",{id:"dropdown",tabindex:"-1"},[e("Dropdown "),t("a",{class:"header-anchor",href:"#dropdown","aria-label":'Permalink to "Dropdown"'},"​")],-1),j=m(`<div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">template</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="color:#E1E4E8;"> &lt;</span><span style="color:#85E89D;">flowbite-themable</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">:theme</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;theme&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="color:#E1E4E8;"> &lt;</span><span style="color:#85E89D;">fwb-dropdown</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="color:#E1E4E8;"> ...</span></span>
<span class="line"><span style="color:#E1E4E8;"> &lt;/</span><span style="color:#85E89D;">fwb-dropdown</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="color:#E1E4E8;"> &lt;/</span><span style="color:#85E89D;">flowbite-themable</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="color:#E1E4E8;">&lt;/</span><span style="color:#85E89D;">template</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">script</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">setup</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="color:#F97583;">import</span><span style="color:#E1E4E8;"> { FwbDropdown, FlowbiteThemable } </span><span style="color:#F97583;">from</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;flowbite-vue&#39;</span></span>
<span class="line"><span style="color:#F97583;">const</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">theme</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;blue&#39;</span><span style="color:#E1E4E8;"> </span><span style="color:#6A737D;">// &#39;blue&#39;, &#39;green&#39;, &#39;red&#39;, &#39;pink&#39;, &#39;purple&#39;</span></span>
<span class="line"><span style="color:#E1E4E8;">&lt;/</span><span style="color:#85E89D;">script</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">template</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#24292E;"> &lt;</span><span style="color:#22863A;">flowbite-themable</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">:theme</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;theme&quot;</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#24292E;"> &lt;</span><span style="color:#22863A;">fwb-dropdown</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#24292E;"> ...</span></span>
<span class="line"><span style="color:#24292E;"> &lt;/</span><span style="color:#22863A;">fwb-dropdown</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#24292E;"> &lt;/</span><span style="color:#22863A;">flowbite-themable</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#24292E;">&lt;/</span><span style="color:#22863A;">template</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">script</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">setup</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#D73A49;">import</span><span style="color:#24292E;"> { FwbDropdown, FlowbiteThemable } </span><span style="color:#D73A49;">from</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;flowbite-vue&#39;</span></span>
<span class="line"><span style="color:#D73A49;">const</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">theme</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;blue&#39;</span><span style="color:#24292E;"> </span><span style="color:#6A737D;">// &#39;blue&#39;, &#39;green&#39;, &#39;red&#39;, &#39;pink&#39;, &#39;purple&#39;</span></span>
<span class="line"><span style="color:#24292E;">&lt;/</span><span style="color:#22863A;">script</span><span style="color:#24292E;">&gt;</span></span></code></pre></div><h2 id="button" tabindex="-1">Button <a class="header-anchor" href="#button" aria-label="Permalink to &quot;Button&quot;">​</a></h2>`,2),H=m(`<div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">template</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="color:#E1E4E8;"> &lt;</span><span style="color:#85E89D;">flowbite-themable</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">:theme</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;theme&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="color:#E1E4E8;"> &lt;</span><span style="color:#85E89D;">fwb-button</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="color:#E1E4E8;"> ...</span></span>
<span class="line"><span style="color:#E1E4E8;"> &lt;/</span><span style="color:#85E89D;">fwb-button</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="color:#E1E4E8;"> &lt;/</span><span style="color:#85E89D;">flowbite-themable</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="color:#E1E4E8;">&lt;/</span><span style="color:#85E89D;">template</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">script</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">setup</span><span style="color:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="color:#F97583;">import</span><span style="color:#E1E4E8;"> { FwbButton, FlowbiteThemable } </span><span style="color:#F97583;">from</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;flowbite-vue&#39;</span></span>
<span class="line"><span style="color:#F97583;">const</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">theme</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;blue&#39;</span><span style="color:#E1E4E8;"> </span><span style="color:#6A737D;">// &#39;blue&#39;, &#39;green&#39;, &#39;red&#39;, &#39;pink&#39;, &#39;purple&#39;</span></span>
<span class="line"><span style="color:#E1E4E8;">&lt;/</span><span style="color:#85E89D;">script</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">template</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#24292E;"> &lt;</span><span style="color:#22863A;">flowbite-themable</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">:theme</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;theme&quot;</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#24292E;"> &lt;</span><span style="color:#22863A;">fwb-button</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#24292E;"> ...</span></span>
<span class="line"><span style="color:#24292E;"> &lt;/</span><span style="color:#22863A;">fwb-button</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#24292E;"> &lt;/</span><span style="color:#22863A;">flowbite-themable</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#24292E;">&lt;/</span><span style="color:#22863A;">template</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">script</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">setup</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#D73A49;">import</span><span style="color:#24292E;"> { FwbButton, FlowbiteThemable } </span><span style="color:#D73A49;">from</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;flowbite-vue&#39;</span></span>
<span class="line"><span style="color:#D73A49;">const</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">theme</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;blue&#39;</span><span style="color:#24292E;"> </span><span style="color:#6A737D;">// &#39;blue&#39;, &#39;green&#39;, &#39;red&#39;, &#39;pink&#39;, &#39;purple&#39;</span></span>
<span class="line"><span style="color:#24292E;">&lt;/</span><span style="color:#22863A;">script</span><span style="color:#24292E;">&gt;</span></span></code></pre></div>`,1),cs=JSON.parse('{"title":"Vue Themable Configuration - Flowbite","description":"","frontmatter":{},"headers":[],"relativePath":"components/flowbiteThemable/flowbiteThemable.md","filePath":"components/flowbiteThemable/flowbiteThemable.md"}'),J={name:"components/flowbiteThemable/flowbiteThemable.md"},is=Object.assign(J,{setup(u){return(o,p)=>(E(),y("div",null,[I,a(b),N,a(b,{"tabs-variant":"pills"}),R,L,G,a(b,{"tabs-variant":"underline"}),O,W,a(U),j,a(B),H]))}});export{cs as __pageData,is as default};
Reference in New Issue View Git Blame Copy Permalink