Skip to content

Commit 9a1a984

Browse files
javascript-2020javascript-2020
committed
update
1 parent bcb0ad9 commit 9a1a984

File tree

2 files changed

+296
-0
lines changed

2 files changed

+296
-0
lines changed

‎utils/github/html/github-hdr/github-hdr.html‎

Lines changed: 142 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,142 @@
1+
2+
3+
<utils-hdr>
4+
5+
<template shadowrootmode=open>
6+
7+
<style>
8+
9+
section {
10+
margin : 0;
11+
box-sizing : border-box;
12+
display : flex;
13+
align-items : center;
14+
gap : 10px;
15+
}
16+
17+
.icon {
18+
cursor : pointer;
19+
border-radius : 3px;
20+
border : 1px solid gray;
21+
box-sizing : border-box;
22+
width : 38px;
23+
height : 38px;
24+
}
25+
26+
.item {
27+
display : inline-flex;
28+
align-items : center;
29+
text-align : center;
30+
background : buttonface;
31+
border-radius : 3px;
32+
border : 1px solid lightgray;
33+
padding : 5px 7px;
34+
}
35+
36+
.item-label {
37+
}
38+
39+
::slotted(.title) {
40+
text-align : center;
41+
position : absolute;
42+
left : 0;
43+
right : 0;
44+
top : 0px;
45+
z-index : -1;
46+
margin : 0 auto;
47+
}
48+
49+
50+
.date {
51+
position : absolute;
52+
top : 5px;
53+
right : 5px;
54+
}
55+
56+
a {
57+
color : blue;
58+
}
59+
a:visited {
60+
color : blue;
61+
}
62+
63+
64+
</style>
65+
66+
<section>
67+
68+
<img id=help class=icon style='padding:2px' src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAABANJREFUSEvNl2tsVEUUx39n224pEVNsTcGqAYM1gYYP0mCUaILGLqVptzVGKZCArxIU2VYTYpQapU2Mj9jWR9H6wUesUdcGWoRSJIQYjUhETUkkRUVIoGztLqB9bOm2OzL7urtst3eXhsT77c495/+bOXPmzLlCEk9JydOZKsNi8ws2QYqAW4DskOsF4IRC/WRRdIvP393V9fZFM1mZyqC0dONsX8aMZ0SpjUCOmVjou0eJbM/wjb65e/f284l8YsCqbNN8JK0Ii5JeJXN2IXVjkJskMMbMCu4yVP1tolyBD4ohrNftF+dLY/o1AlbljsUIh4CsKwEl5aPoks7mlbFg++bnQF5JSmA6RlbLTHE2eo0V22teANUwHc2kfK2+WeJsGYqABysc9dcotiblPB2jaLDO3rXp1uOrrjCRUpmH02ed+9Ce112BFRdX1NavVmrrOlRQ4/nH4YN2GDgP826AiuXQ1AY1a2B+vsE5dBRO9UF+Hjj3GeMr7wbbncH3f4fB+Q30HA+8Voml4fOdjXWii4PfmnamCnIi4A+3wcvvwck+WFwAj1WC41Vo2gKdB+HYX0HRwWG4747gZJo+NcCPVEBWJuw4AIULYF0ZrK+D8QkeQDyjYxP5sqLcUa5EOqqApMAfdcCvvQbEvnxy8MQEfLILROCrN+CJbXDuHyoRRpWyS7Hd8a4gT8aB/zwNwyOQfS1kzzJWrEPr8sDX3wZXnAicZoEvu6HwVtjwIDz6Ikz4A+ARVIvY7DU/AkvjwB93wlk3LLgJiu8ywEd+g1Nn4fBRGB1LDL7n9mCOXBiE9v3QezIQJQ32wmENHgByr1qoL0v5ENitwT4gPWnwd7/AidNBuf5LIS9aBEsWws4DwTGXG2zLILzHk4PHJwfrLNbh0WGamwv3LoW2PbC2FG7MM6R6foczf0PJMmPs52Mw7AW/H37oiTvioRUHwPGhTqUipGgbHer45EpRLBXzSHKFj9MqYH24cqWilKJtRSCrVUukgBQCr6GwpCiUirkumpsRRBeQcMnUrc1CYFF0dxClOhtFpQmlD9hr9BYx1l7goK6y4LHokqm/6ktClDK9Eh0oShLA9ZmsRfjDZHJKpGGfviS0nb4Wx9MzdSSm7K8ygWYU8yYRb0HoNI+7O338YoFuAiONgM1euxpUm5nvzcBbKGZEGX4P1CcIcayerOnuaPxMj8V0mSvKa95XQrUZ/P5Le/Vs6AT0A08hDJk4iaJ1b2fThrBZDHhJdXVGTn/WF4KY5VFgrwtQtCOECmhCtELt8OR5Hz7S2qpTIfDENfQafr1r5jvJrNwsMgGAonVgzsimaOik4LBYaM+bzRJuCrgbxBHe08vt/h+/MIlmfzV+2v4DHQu0lKRbJa4AAAAASUVORK5CYII='>
69+
70+
<div class=item>
71+
72+
<top-menu-grp-api>
73+
<script html-loader src='https://html-loader-1024713184986.us-central1.run.app/'></script>
74+
</top-menu-grp-api>
75+
76+
<a id=home class=item-label href='/'>
77+
home
78+
</a>
79+
80+
</div>
81+
82+
<slot></slot>
83+
84+
<div class=date>
85+
<slot name=date></slot>
86+
</div>
87+
88+
</section>
89+
90+
</template>
91+
92+
<script>
93+
94+
mod.utils.hdr=function(){
95+
true && console.log('mod.utils.hdr');
96+
var obj = {};
97+
98+
var df=true
99+
;
100+
101+
var menu,menumod
102+
;
103+
104+
obj.initmod=function(params){
105+
106+
menumod = params.menumod;
107+
menu = params.menu;
108+
109+
}//initmod
110+
111+
112+
obj.init=function(){
113+
114+
mod.menu.top = mod.menu.top();
115+
116+
mod.menu.top.initmod({menumod});
117+
118+
mod.menu.top.init();
119+
120+
121+
}//init
122+
123+
124+
obj.initdom=function(rootnode){
125+
126+
var root = $.$(rootnode,'utils-hdr');
127+
var shadow = root.shadowRoot;
128+
129+
mod.menu.top.initdom(shadow);
130+
131+
132+
}//initdom
133+
134+
135+
return obj;
136+
137+
}//mod.utils.hdr
138+
139+
</script>
140+
141+
</utils-hdr>
142+

‎utils/github/html/github-hdr/v2.0/github-hdr-v2.0.html‎

Lines changed: 154 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,154 @@
1+
2+
3+
<github-hdr>
4+
5+
<template shadowrootmode=open>
6+
7+
<style>
8+
9+
section {
10+
margin : 0;
11+
box-sizing : border-box;
12+
display : flex;
13+
align-items : center;
14+
gap : 10px;
15+
}
16+
17+
.icon {
18+
cursor : pointer;
19+
border-radius : 3px;
20+
border : 1px solid gray;
21+
box-sizing : border-box;
22+
width : 38px;
23+
height : 38px;
24+
}
25+
26+
.item {
27+
display : inline-flex;
28+
align-items : center;
29+
text-align : center;
30+
background : buttonface;
31+
border-radius : 3px;
32+
border : 1px solid lightgray;
33+
padding : 5px 7px;
34+
}
35+
36+
.item-label {
37+
}
38+
39+
::slotted(.title) {
40+
text-align : center;
41+
position : absolute;
42+
left : 0;
43+
right : 0;
44+
top : 0px;
45+
z-index : -1;
46+
margin : 0 auto;
47+
}
48+
49+
50+
.date {
51+
position : absolute;
52+
top : 5px;
53+
right : 5px;
54+
}
55+
56+
a {
57+
color : blue;
58+
}
59+
a:visited {
60+
color : blue;
61+
}
62+
63+
64+
</style>
65+
66+
<section>
67+
68+
<img id=help class=icon style='padding:2px' src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAABANJREFUSEvNl2tsVEUUx39n224pEVNsTcGqAYM1gYYP0mCUaILGLqVptzVGKZCArxIU2VYTYpQapU2Mj9jWR9H6wUesUdcGWoRSJIQYjUhETUkkRUVIoGztLqB9bOm2OzL7urtst3eXhsT77c495/+bOXPmzLlCEk9JydOZKsNi8ws2QYqAW4DskOsF4IRC/WRRdIvP393V9fZFM1mZyqC0dONsX8aMZ0SpjUCOmVjou0eJbM/wjb65e/f284l8YsCqbNN8JK0Ii5JeJXN2IXVjkJskMMbMCu4yVP1tolyBD4ohrNftF+dLY/o1AlbljsUIh4CsKwEl5aPoks7mlbFg++bnQF5JSmA6RlbLTHE2eo0V22teANUwHc2kfK2+WeJsGYqABysc9dcotiblPB2jaLDO3rXp1uOrrjCRUpmH02ed+9Ce112BFRdX1NavVmrrOlRQ4/nH4YN2GDgP826AiuXQ1AY1a2B+vsE5dBRO9UF+Hjj3GeMr7wbbncH3f4fB+Q30HA+8Voml4fOdjXWii4PfmnamCnIi4A+3wcvvwck+WFwAj1WC41Vo2gKdB+HYX0HRwWG4747gZJo+NcCPVEBWJuw4AIULYF0ZrK+D8QkeQDyjYxP5sqLcUa5EOqqApMAfdcCvvQbEvnxy8MQEfLILROCrN+CJbXDuHyoRRpWyS7Hd8a4gT8aB/zwNwyOQfS1kzzJWrEPr8sDX3wZXnAicZoEvu6HwVtjwIDz6Ikz4A+ARVIvY7DU/AkvjwB93wlk3LLgJiu8ywEd+g1Nn4fBRGB1LDL7n9mCOXBiE9v3QezIQJQ32wmENHgByr1qoL0v5ENitwT4gPWnwd7/AidNBuf5LIS9aBEsWws4DwTGXG2zLILzHk4PHJwfrLNbh0WGamwv3LoW2PbC2FG7MM6R6foczf0PJMmPs52Mw7AW/H37oiTvioRUHwPGhTqUipGgbHer45EpRLBXzSHKFj9MqYH24cqWilKJtRSCrVUukgBQCr6GwpCiUirkumpsRRBeQcMnUrc1CYFF0dxClOhtFpQmlD9hr9BYx1l7goK6y4LHokqm/6ktClDK9Eh0oShLA9ZmsRfjDZHJKpGGfviS0nb4Wx9MzdSSm7K8ygWYU8yYRb0HoNI+7O338YoFuAiONgM1euxpUm5nvzcBbKGZEGX4P1CcIcayerOnuaPxMj8V0mSvKa95XQrUZ/P5Le/Vs6AT0A08hDJk4iaJ1b2fThrBZDHhJdXVGTn/WF4KY5VFgrwtQtCOECmhCtELt8OR5Hz7S2qpTIfDENfQafr1r5jvJrNwsMgGAonVgzsimaOik4LBYaM+bzRJuCrgbxBHe08vt/h+/MIlmfzV+2v4DHQu0lKRbJa4AAAAASUVORK5CYII='>
69+
70+
<div class=item>
71+
72+
<top-menu component=grp v2.0></top-menu>
73+
74+
<a id=home class=item-label href='/'>
75+
home
76+
</a>
77+
78+
</div>
79+
80+
<slot></slot>
81+
82+
<div class=date>
83+
<slot name=date></slot>
84+
</div>
85+
86+
</section>
87+
88+
</template>
89+
90+
91+
<script>
92+
93+
94+
(function github_hdr({mod,root,node}){
95+
96+
var obj = {};
97+
98+
var df=true
99+
;
100+
101+
102+
var $,menu
103+
;
104+
105+
obj.initmod = function(params){
106+
107+
$ = params.$;
108+
menu = params.menu;
109+
110+
}//initmod
111+
112+
113+
//:
114+
115+
116+
var top;
117+
118+
119+
obj.init = async function(){
120+
121+
top = mod['top-menu']
122+
123+
top.initmod({$,menu});
124+
125+
top.init();
126+
127+
128+
}//init
129+
130+
131+
//:
132+
133+
134+
obj.initdom = function(rootnode){
135+
136+
var root = $.$(rootnode,'github-hdr');
137+
var shadow = root.shadowRoot;
138+
139+
top.initdom(shadow);
140+
141+
142+
}//initdom
143+
144+
145+
146+
return obj;
147+
148+
})//github_hdr
149+
150+
151+
</script>
152+
153+
</github-hdr>
154+

0 commit comments

Comments
 (0)