save file

Author: javascript-2020

utils/misc/html/misc-hdr/v2.0/misc-hdr-v2.0.html

@@ -15,21 +15,7 @@
     }
 
 
-  .item, ::slotted(.item)
-    {display:inline-flex;align-items:center;text-align:center;background:buttonface;
-      border-radius:3px;border:1px solid lightgray;padding:5px 7px;cursor:pointer}
-  .item:hover, ::slotted(.item):hover
-    {background:lightyellow}
-    
-    
-  .item-icon, ::slotted(.item-icon)
-    {display:flex;flex-direction:column;align-items:center}
-    
-  .icon, ::slotted(.icon)
-    {cursor:pointer;width:20px;height:20px;border:none}
 
-  .item-label, ::slotted(.item-label)
-    {color:blue}
 
   ::slotted([slot=title])
     {text-align:center;position:absolute;left:0;right:0;top:0px;z-index:-1;margin:0 auto}
@@ -55,6 +41,26 @@
     {color:blue}
 
 
+            </style>
+            
+            <style id=item>
+            
+  .item, ::slotted(.item)
+    {display:inline-flex;align-items:center;text-align:center;background:buttonface;
+      border-radius:3px;border:1px solid lightgray;padding:5px 7px;cursor:pointer}
+  .item:hover, ::slotted(.item):hover
+    {background:lightyellow}
+    
+    
+  .item-icon, ::slotted(.item-icon)
+    {display:flex;flex-direction:column;align-items:center}
+    
+  .icon, ::slotted(.icon)
+    {cursor:pointer;width:20px;height:20px;border:none}
+    
+  .item-label, ::slotted(.item-label)
+    {color:blue}
+    
             </style>
 
             <section>
@@ -71,6 +77,7 @@
                   </div>
 
                   <slot name=help></slot>
+                  <help-file v1.0 component=grp_root></help-file>
 
 
 
@@ -150,6 +157,7 @@
   //:
 
 
+        var help;
         var top;
 
         var shadow;
@@ -163,8 +171,12 @@
 
         obj.init    = async function(){
 
+              help    = mod['help-file'];
+              
               await mod.auto();
 
+              console.log($(host.shadowRoot,'[slot=help]'));
+              
         }//init
 
 
@@ -176,11 +188,12 @@
               shadow          = host.shadowRoot;
 
               set.filename();
-              if(typeof version==='undefined'){
-                    set.version('v1.0');
-              }else{
-                    set.version(version);
+              
+              var v   = 'v1.0';
+              if(typeof version!='undefined'){
+                    v   = version;
               }
+              set.version(v);
 
         }//initdom
 
@@ -207,6 +220,16 @@
         }//filename
 
 
+        obj.add   = function(slot,node){
+        
+              slot    = $(shadow,`slot[name=${slot}]`);
+              if(!slot){
+                    return null;
+              }
+              slot.parentNode.replaceChild(node,slot);
+              return slot;
+              
+        }//add
 
 
         obj.complete    = function(){