ywana-core8 0.0.290 → 0.0.293

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ywana-core8",
-  "version": "0.0.290",
+  "version": "0.0.293",
   "description": "ywana-core8",
   "author": "Ernesto Roldan Garcia",
   "license": "MIT",

package/src/site/site.css

@@ -52,13 +52,26 @@
     padding: .1rem;
 }
 
+.site6>menu>main>.section-title {
+    width: 100%;
+    font-size: .7rem;
+    font-weight: 400;
+    padding: .5rem .7rem;
+}
+
+.site6>menu>main>.section-title.min {
+    border-bottom: solid 1px var(--divider-color);
+    max-height: 1px
+}
+
 .site6>menu>main>.site-menu-item {
     width: 100%;
     display: flex;
     align-items: center;
 }
 
-.site6>menu.max>main>.site-menu-item:hover {
+.site6>menu.max>main>.site-menu-item:not(.selected):hover {
+    color: var(--text-color);
     background-color: rgba(200,200,200,.2);
     cursor: pointer;
 }

package/src/site/site.js

@@ -82,10 +82,10 @@ export const SiteProvider = ({ children, siteLang, siteDictionary, showConsole }
                 animationIn: ["animate__animated", "animate__fadeIn"],
                 animationOut: ["animate__animated", "animate__fadeOut"],
                 dismiss: {
-                  duration: 3000,
-                  onScreen: true
+                    duration: 3000,
+                    onScreen: true
                 }
-              });
+            });
         }
     }
 
@@ -103,7 +103,7 @@ export const Site = ({ icon, logo, title, toolbar, children, init, min, lang, di
     return (
         <SiteProvider siteLang={lang} siteDictionary={dictionary}>
             <div className="site6">
-                <SiteHeader icon={icon} title={title}/>
+                <SiteHeader icon={icon} title={title} />
                 <SiteToolBar >{toolbar}</SiteToolBar>
                 <SiteMenu logo={logo} title={title} min={min} >{children}</SiteMenu>
                 <SitePage init={init}>
@@ -198,12 +198,13 @@ const SiteMenu = ({ logo, title, children, min }) => {
             <main >
                 {Object.keys(sections).map(title => (
                     <Fragment key={title}>
+                        <div className={`section-title ${style}`}>{sideNav === "max" ? title : ''}</div>
                         {sections[title].map(({ id, icon = 'info', title }) => {
                             const styleItem = id === page ? 'selected' : ''
                             return (
                                 <div className={`site-menu-item ${styleItem}`} key={id} onClick={() => goto(id)}>
                                     <Icon key={id} icon={icon} clickable action={() => goto(id)} />
-                                    { sideNav === 'max' ? <label>{title}</label> : null }
+                                    {sideNav === 'max' ? <label>{title}</label> : null}
                                 </div>
                             )
                         })}