Gogs 3 недель назад
Родитель
Сommit
80710f8924

+ 1 - 1
doc.json

@@ -28,7 +28,7 @@
      "adr": "https://cdn.jsdelivr.net/npm/openlayers@4.6.5/dist/ol.min.js",
      "css": "https://cdn.jsdelivr.net/npm/openlayers@4.6.5/dist/ol.min.css",
       "eventName": "leafletReady",
-      "obj": "L"
+      "obj": "ol"
     }
   ],
   "menu": {

+ 1 - 1
vue/app/pages/Contacts/index.coffee

@@ -1,5 +1,5 @@
 # vue/app/pages/Contacts/index.coffee
-document.head.insertAdjacentHTML('beforeend','<style type="text/tailwindcss">'+stylFns['app/pages/Contacts/index.styl']+'</style>')
+document.head.insertAdjacentHTML('beforeend','<style type="text/tailwindcss"  page="Contacts">'+stylFns['app/pages/Contacts/index.styl']+'</style>')
 
 module.exports =
     name: 'Contacts'

+ 1 - 1
vue/app/pages/Contacts/index.pug

@@ -81,7 +81,7 @@ section(class="min-h-screen bg-gray-50 dark:bg-gray-900 py-12 contacts-section")
                         )
 
         div(class="mt-16 bg-white dark:bg-gray-800 rounded-2xl shadow-lg overflow-hidden animate-fade-in-up animation-delay-400")
-            #map(class="h-[350px] bg-gray-300 dark:bg-gray-700")
+            #map(class="bg-gray-300 dark:bg-gray-700")
                
                
                

+ 1 - 1
vue/app/pages/Events/index.coffee

@@ -1,5 +1,5 @@
 # app/pages/Events/index.coffee
-document.head.insertAdjacentHTML('beforeend','<style type="text/tailwindcss">'+stylFns['app/pages/Events/index.styl']+'</style>')
+document.head.insertAdjacentHTML('beforeend','<style type="text/tailwindcss"  page="Events">'+stylFns['app/pages/Events/index.styl']+'</style>')
 
 module.exports =
   name: 'Events'

+ 1 - 1
vue/app/shared/EventDetailModal/index.coffee

@@ -1,5 +1,5 @@
 # app/shared/EventDetailModal/index.coffee
-document.head.insertAdjacentHTML('beforeend','<style type="text/tailwindcss">'+stylFns['app/shared/EventDetailModal/index.styl']+'</style>')
+document.head.insertAdjacentHTML('beforeend','<style type="text/tailwindcss"  component="EventDetailModal">'+stylFns['app/shared/EventDetailModal/index.styl']+'</style>')
 
 module.exports =
   name: 'EventDetailModal'

+ 1 - 1
vue/app/shared/FormValidator/index.coffee

@@ -1,4 +1,4 @@
-document.head.insertAdjacentHTML('beforeend','<style type="text/tailwindcss">'+stylFns['app/shared/FormValidator/index.styl']+'</style>')
+document.head.insertAdjacentHTML('beforeend','<style type="text/tailwindcss" component="FormValidator">'+stylFns['app/shared/FormValidator/index.styl']+'</style>')
 
 module.exports =
   name: 'FormValidator'

+ 1 - 1
vue/app/shared/ImageSlider/index.coffee

@@ -1,4 +1,4 @@
-document.head.insertAdjacentHTML('beforeend','<style type="text/tailwindcss">'+stylFns['app/shared/ImageSlider/index.styl']+'</style>')
+document.head.insertAdjacentHTML('beforeend','<style type="text/tailwindcss" component="ImageSlider">'+stylFns['app/shared/ImageSlider/index.styl']+'</style>')
 
 module.exports =
   name: 'ImageSlider'

+ 1 - 1
vue/app/shared/ModalWindow/index.coffee

@@ -1,4 +1,4 @@
-document.head.insertAdjacentHTML('beforeend','<style type="text/tailwindcss">'+stylFns['app/shared/ModalWindow/index.styl']+'</style>')
+document.head.insertAdjacentHTML('beforeend','<style type="text/tailwindcss" component="ModalWindow">'+stylFns['app/shared/ModalWindow/index.styl']+'</style>')
 
 module.exports =
   name: 'ModalWindow'

+ 122 - 72
vue/app/shared/MultiLevelMenu/index.coffee

@@ -1,74 +1,124 @@
-# app/shared/MultiLevelMenu/index.coffee
-document.head.insertAdjacentHTML('beforeend','<style type="text/tailwindcss">'+stylFns['app/shared/MultiLevelMenu/index.styl']+'</style>')
+# vue/app/shared/MultiLevelMenu/index.coffee
+document.head.insertAdjacentHTML('beforeend','<style type="text/tailwindcss" component="MultiLevelMenu">'+stylFns['app/shared/MultiLevelMenu/index.styl']+'</style>')
 
 module.exports =
-  name: 'MultiLevelMenu'
-  render: (new Function '_ctx', '_cache', renderFns['app/shared/MultiLevelMenu/index.pug'])()
-  data: ->
-    openSubmenu: null
-    openSubsubmenu: null
-    isMobileMenuOpen: false
-    menuItems: [
-      {
-        id: 1
-        title: 'Мероприятия'
-        href: '/events'
-#        children: [
-#          {
-#            id: 11
-#            title: 'Концерты'
-#            children: [
-#              { id: 111, title: 'Классическая музыка' }
-#              { id: 112, title: 'Фольклорные концерты' }
-#              { id: 113, title: 'Джазовые вечера' }
-#            ]
-#          }
-#          {
-#            id: 12
-#            title: 'Фестивали'
-#            children: [
-#              { id: 121, title: 'Музыкальные фестивали' }
-#              { id: 122, title: 'Международные события' }
-#            ]
-#          }
-#          { id: 13, title: 'Все мероприятия' }
-#        ]
-      }
-      {
-        id: 2
-        title: 'О зале'
-        href: '/about'
-#        children: [
-#          { id: 21, title: 'История' }
-#          { id: 22, title: 'Архитектура' }
-#          { id: 23, title: 'Акустика' }
-#          { id: 24, title: 'Галерея' }
-#        ]
-      }
-#      {
-#        id: 3
-#        title: 'Посетителям'
-#        children: [
-#          { id: 31, title: 'Как добраться' }
-#          { id: 32, title: 'Правила посещения' }
-#          { id: 33, title: 'Доступная среда' }
-#          { id: 34, title: 'Архив мероприятий' }
-#        ]
-#      }
-      { id: 4, title: 'Контакты', href: '/contacts' }
-    ]
-  beforeUnmount: ->
-    debug.log "slider start"
-  methods:
-    getMenuItemClasses: (item) ->
-      baseClasses = 'text-gray-700 dark:text-gray-300 hover:text-accent dark:hover:text-accent'
-      activeClasses = if @openSubmenu == item.id then 'bg-accent bg-opacity-10 text-accent' else 'hover:bg-gray-100 dark:hover:bg-gray-700'
-      return "#{baseClasses} #{activeClasses}"
-    
-    handleMobileClick: (item) ->
-      if window.innerWidth < 768
-        if item.children
-          @openSubmenu = if @openSubmenu == item.id then null else item.id
-        else
-          @isMobileMenuOpen = false
-          # Навигация к странице
+    name: 'MultiLevelMenu'
+    render: (new Function '_ctx', '_cache', renderFns['app/shared/MultiLevelMenu/index.pug'])()
+    data: ->
+        openSubmenu: null
+        openSubsubmenu: null
+        isMobileMenuOpen: false
+        openMobileSubmenu: null
+        openMobileSubsubmenu: null
+        menuItems: [
+            {
+                id: 1
+                title: 'Мероприятия'
+                children: [
+                    {
+                        id: 11
+                        title: 'Концерты'
+                        children: [
+                            { id: 111, title: 'Классическая музыка', path: '/events?category=classical' }
+                            { id: 112, title: 'Фольклорные концерты', path: '/events?category=folk' }
+                            { id: 113, title: 'Джазовые вечера', path: '/events?category=jazz' }
+                            { id: 114, title: 'Поп-музыка', path: '/events?category=pop' }
+                        ]
+                    }
+                    {
+                        id: 12
+                        title: 'Фестивали'
+                        children: [
+                            { id: 121, title: 'Музыкальные фестивали', path: '/events?type=festival' }
+                            { id: 122, title: 'Международные события', path: '/events?type=international' }
+                        ]
+                    }
+                    { id: 13, title: 'Все мероприятия', path: '/events' }
+                ]
+            }
+            {
+                id: 2
+                title: 'О зале'
+                children: [
+                    { id: 21, title: 'История', path: '/about#history' }
+                    { id: 22, title: 'Архитектура', path: '/about#architecture' }
+                    { id: 23, title: 'Акустика', path: '/about#acoustics' }
+                    { id: 24, title: 'Галерея', path: '/about#gallery' }
+                ]
+            }
+            {
+                id: 3
+                title: 'Посетителям'
+                children: [
+                    { id: 31, title: 'Как добраться', path: '/contacts#location' }
+                    { id: 32, title: 'Правила посещения', path: '/contacts#rules' }
+                    { id: 33, title: 'Доступная среда', path: '/contacts#accessibility' }
+                    { id: 34, title: 'Архив мероприятий', path: '/archive' }
+                ]
+            }
+            { id: 4, title: 'Контакты', path: '/contacts' }
+        ]
+    mounted: ->
+        debug.log "MultiLevelMenu component mounted"
+        @setupEventListeners()
+    beforeUnmount: ->
+        @removeEventListeners()
+    methods:
+        getMenuItemClasses: (item) ->
+            baseClasses = 'text-gray-700 dark:text-gray-300 hover:text-accent dark:hover:text-accent'
+            activeClasses = if @openSubmenu == item.id then 'bg-accent bg-opacity-10 text-accent' else 'hover:bg-gray-100 dark:hover:bg-gray-700'
+            return baseClasses + ' ' + activeClasses
+        
+        handleMenuClick: (menuItem) ->
+            if menuItem.path
+                @closeAllMenus()
+                @$router.push(menuItem.path)
+            else
+                debug.log "Menu item clicked: " + menuItem.title
+        
+        handleMobileMenuClick: (menuItem) ->
+            if menuItem.path
+                @closeMobileMenu()
+                @$router.push(menuItem.path)
+            else
+                debug.log "Mobile menu item clicked: " + menuItem.title
+        
+        toggleMobileMenu: ->
+            @isMobileMenuOpen = !@isMobileMenuOpen
+            if @isMobileMenuOpen
+                document.body.style.overflow = 'hidden'
+            else
+                document.body.style.overflow = ''
+        
+        closeMobileMenu: ->
+            @isMobileMenuOpen = false
+            @openMobileSubmenu = null
+            @openMobileSubsubmenu = null
+            document.body.style.overflow = ''
+        
+        toggleMobileSubmenu: (item) ->
+            if @openMobileSubmenu == item.id
+                @openMobileSubmenu = null
+            else
+                @openMobileSubmenu = item.id
+                @openMobileSubsubmenu = null
+        
+        toggleMobileSubsubmenu: (child) ->
+            if @openMobileSubsubmenu == child.id
+                @openMobileSubsubmenu = null
+            else
+                @openMobileSubsubmenu = child.id
+        
+        closeAllMenus: ->
+            @openSubmenu = null
+            @openSubsubmenu = null
+        
+        setupEventListeners: ->
+            document.addEventListener 'keydown', @handleKeydown
+        
+        removeEventListeners: ->
+            document.removeEventListener 'keydown', @handleKeydown
+        
+        handleKeydown: (event) ->
+            if event.key == 'Escape' and @isMobileMenuOpen
+                @closeMobileMenu()

+ 148 - 69
vue/app/shared/MultiLevelMenu/index.pug

@@ -1,74 +1,153 @@
-//- app/shared/MultiLevelMenu/index.pug
-nav.relative
-
-  .flex.space-x-2(class="absolute md:relative md:block flex-col md:flex-row")
-    .menu-item.relative(
-      v-for='item in menuItems'
-      :key='item.id'
-      @mouseenter='openSubmenu = item.id'
-      @mouseleave='openSubmenu = null'
-      @click='handleMobileClick(item)'
-    )
-      button.flex.items-center.px-4.py-2.text-sm.font-medium.text-white.rounded-md.transition-all.duration-200(
-        :class='getMenuItemClasses(item)'
-        :aria-expanded='openSubmenu === item.id'
-      )
-        a(:href="item.href") {{ item.title }}
-        svg.w-4.h-4.ml-1(
-          :class='{"transform rotate-180": openSubmenu === item.id, "hidden": !item.children}'
-          fill='none' stroke='currentColor' viewBox='0 0 24 24'
-        )
-          path(stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7')
-      
-      //- Выпадающее меню
-      transition(
-        enter-active-class='transition-all duration-300 ease-out'
-        enter-from-class='opacity-0 transform -translate-y-2'
-        enter-to-class='opacity-100 transform translate-y-0'
-        leave-active-class='transition-all duration-200 ease-in'
-        leave-from-class='opacity-100 transform translate-y-0'
-        leave-to-class='opacity-0 transform -translate-y-2'
-      )
-        .absolute.left-0.mt-2.w-56.rounded-lg.shadow-xl.bg-white.ring-1.ring-black.ring-opacity-5.z-50( class="dark:bg-gray-800"
-          v-if='item.children && openSubmenu === item.id'
-          @mouseenter='openSubmenu = item.id'
+nav(class="relative")
+    div(class="hidden md:flex space-x-2")
+        div(
+            v-for="item in menuItems"
+            :key="item.id"
+            class="menu-item relative"
+            @mouseenter="openSubmenu = item.id"
+            @mouseleave="openSubmenu = null"
         )
-          .py-2
-            .submenu-item.relative(
-              v-for='child in item.children'
-              :key='child.id'
-              @mouseenter='openSubsubmenu = child.id'
-              @mouseleave='openSubsubmenu = null'
+            button(
+                class="flex items-center px-4 py-2 text-sm font-medium rounded-md transition-all duration-200"
+                :class="getMenuItemClasses(item)"
+                :aria-expanded="openSubmenu === item.id"
             )
-              .flex.items-center.justify-between.px-4.py-2.text-sm.text-gray-700.cursor-pointer.transition-colors.duration-200(
-                :class='"dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700" + {"rounded-lg": !child.children}'
-              )
-                | {{ child.title }}
-                svg.w-4.h-4(
-                  :class='{"transform rotate-90": openSubsubmenu === child.id, "hidden": !child.children}'
-                  fill='none' stroke='currentColor' viewBox='0 0 24 24'
+                span {{ item.title }}
+                svg(
+                    v-if="item.children"
+                    class="w-4 h-4 ml-1 transition-transform duration-200"
+                    :class="{'transform rotate-180': openSubmenu === item.id}"
+                    fill="none"
+                    stroke="currentColor"
+                    viewBox="0 0 24 24"
                 )
-                  path(stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M9 5l7 7-7-7')
-              
-              //- Второй уровень
-              transition(
-                enter-active-class='transition-all duration-300 ease-out'
-                enter-from-class='opacity-0 transform translate-x-2'
-                enter-to-class='opacity-100 transform translate-x-0'
-              )
-                .absolute.left-full.top-0.ml-1.w-56.rounded-lg.shadow-xl.bg-white.ring-1.ring-black.ring-opacity-5.z-50( class="dark:bg-gray-800"
-                  v-if='child.children && openSubsubmenu === child.id'
-                )
-                  .py-2
-                    .px-4.py-2.text-sm.text-gray-700.cursor-pointer.transition-colors.duration-200(class="dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700"
-                      v-for='subchild in child.children'
-                      :key='subchild.id'
-                    ) {{ subchild.title }}
+                    path(stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7")
+            
+            div(
+                v-if="item.children && openSubmenu === item.id"
+                class="absolute left-0 mt-2 w-56 rounded-lg shadow-xl bg-white dark:bg-gray-800 ring-1 ring-black ring-opacity-5 z-50"
+                @mouseenter="openSubmenu = item.id"
+            )
+                div(class="py-2")
+                    div(
+                        v-for="child in item.children"
+                        :key="child.id"
+                        class="submenu-item relative"
+                        @mouseenter="openSubsubmenu = child.id"
+                        @mouseleave="openSubsubmenu = null"
+                    )
+                        div(
+                            class="flex items-center justify-between px-4 py-2 text-sm text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 cursor-pointer transition-colors duration-200"
+                            :class="{'rounded-lg': !child.children}"
+                            @click="handleMenuClick(child)"
+                        )
+                            span {{ child.title }}
+                            svg(
+                                v-if="child.children"
+                                class="w-4 h-4 transition-transform duration-200"
+                                :class="{'transform rotate-90': openSubsubmenu === child.id}"
+                                fill="none"
+                                stroke="currentColor"
+                                viewBox="0 0 24 24"
+                            )
+                                path(stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7")
+                        
+                        div(
+                            v-if="child.children && openSubsubmenu === child.id"
+                            class="absolute left-full top-0 ml-1 w-56 rounded-lg shadow-xl bg-white dark:bg-gray-800 ring-1 ring-black ring-opacity-5 z-50"
+                        )
+                            div(class="py-2")
+                                div(
+                                    v-for="subchild in child.children"
+                                    :key="subchild.id"
+                                    class="px-4 py-2 text-sm text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 cursor-pointer transition-colors duration-200"
+                                    @click="handleMenuClick(subchild)"
+                                ) {{ subchild.title }}
 
+    button(
+        class="md:hidden p-2 rounded-md text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors"
+        @click="toggleMobileMenu"
+        aria-label="Открыть меню"
+    )
+        svg(class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24")
+            path(stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16")
 
-  
-  //- Mobile menu button (скрытый на десктопе)
-  button.mobile-menu-button(@click="isMobileMenuOpen=!isMobileMenuOpen" class='md:hidden p-2 rounded-md text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700')
-    svg.w-6.h-6(fill='none' stroke='currentColor' viewBox='0 0 24 24')
-      path(stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 6h16M4 12h16M4 18h16')
-  
+    div(
+        v-if="isMobileMenuOpen"
+        class="fixed inset-0 z-50 md:hidden"
+    )
+        div(
+            class="fixed inset-0 bg-black bg-opacity-50"
+            @click="closeMobileMenu"
+        )
+        div(
+            class="fixed inset-y-0 left-0 w-64 bg-white dark:bg-gray-800 shadow-xl transform transition-transform duration-300 ease-in-out"
+            :class="{'translate-x-0': isMobileMenuOpen, '-translate-x-full': !isMobileMenuOpen}"
+        )
+            div(class="flex flex-col h-full")
+                div(class="flex items-center justify-between p-4 border-b border-gray-200 dark:border-gray-700")
+                    h2(class="text-lg font-semibold text-gray-800 dark:text-white") Меню
+                    button(
+                        @click="closeMobileMenu"
+                        class="p-2 rounded-md text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200 transition-colors"
+                        aria-label="Закрыть меню"
+                    )
+                        svg(class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24")
+                            path(stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12")
+                
+                div(class="flex-1 overflow-y-auto")
+                    div(class="py-2")
+                        div(
+                            v-for="item in menuItems"
+                            :key="item.id"
+                            class="mobile-menu-item"
+                        )
+                            div(
+                                class="flex items-center justify-between px-4 py-3 text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 cursor-pointer transition-colors"
+                                @click="toggleMobileSubmenu(item)"
+                            )
+                                span(class="font-medium") {{ item.title }}
+                                svg(
+                                    v-if="item.children"
+                                    class="w-4 h-4 transition-transform duration-200"
+                                    :class="{'transform rotate-180': openMobileSubmenu === item.id}"
+                                    fill="none"
+                                    stroke="currentColor"
+                                    viewBox="0 0 24 24"
+                                )
+                                    path(stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7")
+                            
+                            div(
+                                v-if="item.children && openMobileSubmenu === item.id"
+                                class="bg-gray-50 dark:bg-gray-900"
+                            )
+                                div(
+                                    v-for="child in item.children"
+                                    :key="child.id"
+                                    class="mobile-submenu-item"
+                                )
+                                    div(
+                                        class="flex items-center justify-between px-6 py-3 text-gray-600 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 cursor-pointer transition-colors"
+                                        @click="toggleMobileSubsubmenu(child)"
+                                    )
+                                        span {{ child.title }}
+                                        svg(
+                                            v-if="child.children"
+                                            class="w-4 h-4 transition-transform duration-200"
+                                            :class="{'transform rotate-90': openMobileSubsubmenu === child.id}"
+                                            fill="none"
+                                            stroke="currentColor"
+                                            viewBox="0 0 24 24"
+                                        )
+                                            path(stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7")
+                                    
+                                    div(
+                                        v-if="child.children && openMobileSubsubmenu === child.id"
+                                        class="bg-gray-100 dark:bg-gray-800"
+                                    )
+                                        div(
+                                            v-for="subchild in child.children"
+                                            :key="subchild.id"
+                                            class="px-8 py-2 text-gray-500 dark:text-gray-500 hover:bg-gray-200 dark:hover:bg-gray-600 cursor-pointer transition-colors"
+                                            @click="handleMobileMenuClick(subchild)"
+                                        ) {{ subchild.title }}

+ 61 - 10
vue/app/shared/MultiLevelMenu/index.styl

@@ -2,19 +2,70 @@
 // Стили исключительно для многоуровневого меню
 
 .menu-item
-  .submenu-item
-    transition: all 0.3s ease
+    .submenu-item
+        transition: all 0.3s ease
+        
+        &:hover
+            transform: translateX(5px)
+
+.mobile-menu-item
+    border-bottom: 1px solid #e5e7eb
     
-    &:hover
-      transform: translateX(5px)
+    .dark &
+        border-bottom-color: #374151
+    
+    &:last-child
+        border-bottom: none
+
+.mobile-submenu-item
+    border-bottom: 1px solid #f3f4f6
+    
+    .dark &
+        border-bottom-color: #4b5563
+    
+    &:last-child
+        border-bottom: none
+
+// Анимации для мобильного меню
+@keyframes slideInLeft
+    from
+        transform: translateX(-100%)
+        opacity: 0
+    to
+        transform: translateX(0)
+        opacity: 1
+
+@keyframes slideOutLeft
+    from
+        transform: translateX(0)
+        opacity: 1
+    to
+        transform: translateX(-100%)
+        opacity: 0
 
-// Адаптивность для мобильного меню
+// Адаптивность для мобильных устройств
 @media (max-width: 768px)
-  .mobile-menu-button
+    .mobile-menu-overlay
+        animation: fadeIn 0.3s ease-out
+        
+    .mobile-menu-panel
+        animation: slideInLeft 0.3s ease-out
+        
+        &.closing
+            animation: slideOutLeft 0.3s ease-in
+
+// Плавные переходы для десктопного меню
+.menu-item
     transition: all 0.3s ease
     
     &:hover
-      background-color: rgba(0, 0, 0, 0.1)
-      
-      .dark &
-        background-color: rgba(255, 255, 255, 0.1)
+        .submenu-item
+            animation: fadeInUp 0.3s ease-out
+
+@keyframes fadeInUp
+    from
+        opacity: 0
+        transform: translateY(10px)
+    to
+        opacity: 1
+        transform: translateY(0)

+ 1 - 1
vue/app/shared/ThemeToggle/index.coffee

@@ -1,5 +1,5 @@
 # app/shared/ThemeToggle/index.coffee
-document.head.insertAdjacentHTML('beforeend','<style type="text/tailwindcss">'+stylFns['app/shared/ThemeToggle/index.styl']+'</style>')
+document.head.insertAdjacentHTML('beforeend','<style type="text/tailwindcss" component="ThemeToggle">'+stylFns['app/shared/ThemeToggle/index.styl']+'</style>')
 
 module.exports =
   name: 'ThemeToggle'