1- <!doctype html> < html lang =" en " > < head > </ head > < body >
2-
3-
1+ <!doctype html>
2+ < html lang =" en " >
3+ < head >
44 < meta charset ="utf-8 ">
55 < title > @uiw/reset.css</ title >
6- < meta name =" viewport " content ="width=device-width, initial-scale=1 ">
6+ < meta content ="width=device-width, initial-scale=1 " name =" viewport ">
77 < meta description ="A tiny modern CSS reset. ">
88 < meta keywords ="css,less,reset,mini ">
99 < link rel ="icon " href ="data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20100%20100%22%3E%3Ctext%20y=%22.9em%22%20font-size=%2290%22%3E💅%3C/text%3E%3C/svg%3E " type ="image/x-icon ">
10-
11- < dark-mode permanent ="true " style ="position: fixed; top: 8px; left: 10px; z-index: 999; " dark ="Dark " light ="Light "> </ dark-mode > < script > const t = document ; const e = "_dark_mode_theme_" ; const s = "permanent" ; const o = "colorschemechange" ; const i = "permanentcolorscheme" ; const h = "light" ; const r = "dark" ; const n = ( t , e , s = e ) => { Object . defineProperty ( t , s , { enumerable :true , get ( ) { const t = this . getAttribute ( e ) ; return t === null ?"" :t } , set ( t ) { this . setAttribute ( e , t ) } } ) } ; const c = ( t , e , s = e ) => { Object . defineProperty ( t , s , { enumerable :true , get ( ) { return this . hasAttribute ( e ) } , set ( t ) { if ( t ) { this . setAttribute ( e , "" ) } else { this . removeAttribute ( e ) } } } ) } ; class a extends HTMLElement { static get observedAttributes ( ) { return [ "mode" , h , r , s ] } LOCAL_NANE = e ; constructor ( ) { super ( ) ; this . t ( ) } connectedCallback ( ) { n ( this , "mode" ) ; n ( this , r ) ; n ( this , h ) ; c ( this , s ) ; const a = localStorage . getItem ( e ) ; if ( a && [ h , r ] . includes ( a ) ) { this . mode = a ; this . permanent = true } if ( this . permanent && ! a ) { localStorage . setItem ( e , this . mode ) } const l = [ h , r ] . includes ( a ) ; if ( this . permanent && a ) { this . o ( ) } else { if ( window . matchMedia && window . matchMedia ( "(prefers-color-scheme: dark)" ) . matches ) { this . mode = r ; this . o ( ) } if ( window . matchMedia && window . matchMedia ( "(prefers-color-scheme: light)" ) . matches ) { this . mode = h ; this . o ( ) } } if ( ! this . permanent && ! l ) { window . matchMedia ( "(prefers-color-scheme: light)" ) . onchange = t => { this . mode = t . matches ?h :r ; this . o ( ) } ; window . matchMedia ( "(prefers-color-scheme: dark)" ) . onchange = t => { this . mode = t . matches ?r :h ; this . o ( ) } } const d = new MutationObserver ( ( ( s , h ) => { this . mode = t . documentElement . dataset . colorMode ; if ( this . permanent && l ) { localStorage . setItem ( e , this . mode ) ; this . i ( i , { permanent :this . permanent } ) } this . h ( ) ; this . i ( o , { colorScheme :this . mode } ) } ) ) ; d . observe ( t . documentElement , { attributes :true } ) ; this . i ( o , { colorScheme :this . mode } ) ; this . h ( ) } attributeChangedCallback ( t , s , o ) { if ( t === "mode" && s !== o && [ h , r ] . includes ( o ) ) { const t = localStorage . getItem ( e ) ; if ( this . mode === t ) { this . mode = o ; this . h ( ) ; this . o ( ) } else if ( this . mode && this . mode !== t ) { this . h ( ) ; this . o ( ) } } else if ( ( t === h || t === r ) && s !== o ) { this . h ( ) } if ( t === "permanent" && typeof this . permanent === "boolean" ) { this . permanent ?localStorage . setItem ( e , this . mode ) :localStorage . removeItem ( e ) } } o ( ) { t . documentElement . setAttribute ( "data-color-mode" , this . mode ) } h ( ) { this . icon . textContent = this . mode === h ?"🌒" :"🌞" ; this . text . textContent = this . mode === h ?this . getAttribute ( r ) :this . getAttribute ( h ) } t ( ) { var s = this . attachShadow ( { mode :"open" } ) ; this . label = t . createElement ( "span" ) ; this . label . setAttribute ( "class" , "wrapper" ) ; this . label . onclick = ( ) => { this . mode = this . mode === h ?r :h ; if ( this . permanent ) { localStorage . setItem ( e , this . mode ) } this . o ( ) ; this . h ( ) } ; s . appendChild ( this . label ) ; this . icon = t . createElement ( "span" ) ; this . label . appendChild ( this . icon ) ; this . text = t . createElement ( "span" ) ; this . label . appendChild ( this . text ) ; const o = `
10+ </ head >
11+ < body > < script type ="module "> const GITHUB_CORNERS_TEMPLATE = document . createElement ( "template" ) ;
12+ GITHUB_CORNERS_TEMPLATE . innerHTML = `
13+ <style>
14+ :host a:hover .octo-arm { animation: octocat-wave 560ms ease-in-out; }
15+ @keyframes octocat-wave {
16+ 0%, 100% { transform: rotate(0); }
17+ 20%, 60% { transform: rotate(-25deg); }
18+ 40%, 80% { transform: rotate(10deg); }
19+ }
20+ @media (max-width:500px) {
21+ :host a:hover .octo-arm { animation: none; }
22+ :host .octo-arm { animation: octocat-wave 560ms ease-in-out; }
23+ }
24+ :host svg { z-index: 99; position: fixed; border: 0px; top: 0px; }
25+ </style>
26+ <svg width="80" height="80" viewBox="0 0 250 250" aria-hidden="true">
27+ <a xlink:href="https://github.com/uiwjs/react-github-corners" target="_blank" rel="nofollow sponsored" style="fill: rgb(21, 21, 19); color: rgb(255, 255, 255);">
28+ <g>
29+ <path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
30+ <path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" class="octo-arm" style="transform-origin: 130px 106px;"></path>
31+ <path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path>
32+ </g>
33+ </a>
34+ </svg>
35+ ` ;
36+ export class GithubCorners extends HTMLElement {
37+ constructor ( ) {
38+ super ( ) ;
39+ this . right = '0' ;
40+ this . shadow = this . attachShadow ( { mode : 'open' } ) ;
41+ this . shadow . appendChild ( this . ownerDocument . importNode ( GITHUB_CORNERS_TEMPLATE . content , true ) ) ;
42+ this . update ( ) ;
43+ }
44+ static get observedAttributes ( ) {
45+ return [ 'style' , 'z-index' , 'target' , 'height' , 'width' , 'href' , 'color' , 'fill' , 'position' , 'top' , 'left' , 'right' , 'bottom' , 'transform' ] ;
46+ }
47+ setAttr ( name , value ) {
48+ const svg = this . shadow . querySelector ( 'svg' ) ;
49+ if ( / ( h r e f ) / . test ( name . toLocaleLowerCase ( ) ) ) {
50+ svg . lastElementChild . setAttribute ( 'xlink:href' , value ) ;
51+ }
52+ else if ( / ( c o l o r | f i l l ) / . test ( name . toLocaleLowerCase ( ) ) ) {
53+ svg . firstElementChild . style [ name ] = value ;
54+ }
55+ else if ( / ( z - i n d e x | p o s i t i o n | t o p | l e f t | r i g h t | b o t t o m | t r a n s f o r m ) / . test ( name . toLocaleLowerCase ( ) ) ) {
56+ svg . style [ name ] = value ;
57+ }
58+ else {
59+ svg . setAttribute ( name , value ) ;
60+ }
61+ }
62+ update ( ) {
63+ ;
64+ [ ...this . getAttributeNames ( ) , 'right' ] . forEach ( ( name ) => {
65+ const value = this . getAttribute ( name ) || this [ name ] || '' ;
66+ this . setAttr ( name , value ) ;
67+ } ) ;
68+ }
69+ attributeChangedCallback ( name , oldValue , newValue ) {
70+ if ( oldValue !== newValue ) {
71+ this . setAttr ( name , newValue ) ;
72+ }
73+ }
74+ }
75+ customElements . define ( 'github-corners' , GithubCorners ) ; </ script > < github-corners target ="__blank " position ="fixed " z-index ="999 " href ="https://github.com/uiwjs/reset-css.git "> </ github-corners > < dark-mode style ="position: fixed; top: 8px; left: 10px; z-index: 999; " dark ="Dark " light ="Light " permanent ="true "> </ dark-mode > < script > const t = document ; const e = "_dark_mode_theme_" ; const s = "permanent" ; const o = "colorschemechange" ; const i = "permanentcolorscheme" ; const h = "light" ; const r = "dark" ; const n = ( t , e , s = e ) => { Object . defineProperty ( t , s , { enumerable :true , get ( ) { const t = this . getAttribute ( e ) ; return t === null ?"" :t } , set ( t ) { this . setAttribute ( e , t ) } } ) } ; const c = ( t , e , s = e ) => { Object . defineProperty ( t , s , { enumerable :true , get ( ) { return this . hasAttribute ( e ) } , set ( t ) { if ( t ) { this . setAttribute ( e , "" ) } else { this . removeAttribute ( e ) } } } ) } ; class a extends HTMLElement { static get observedAttributes ( ) { return [ "mode" , h , r , s ] } LOCAL_NANE = e ; constructor ( ) { super ( ) ; this . t ( ) } connectedCallback ( ) { n ( this , "mode" ) ; n ( this , r ) ; n ( this , h ) ; c ( this , s ) ; const a = localStorage . getItem ( e ) ; if ( a && [ h , r ] . includes ( a ) ) { this . mode = a ; this . permanent = true } if ( this . permanent && ! a ) { localStorage . setItem ( e , this . mode ) } const l = [ h , r ] . includes ( a ) ; if ( this . permanent && a ) { this . o ( ) } else { if ( window . matchMedia && window . matchMedia ( "(prefers-color-scheme: dark)" ) . matches ) { this . mode = r ; this . o ( ) } if ( window . matchMedia && window . matchMedia ( "(prefers-color-scheme: light)" ) . matches ) { this . mode = h ; this . o ( ) } } if ( ! this . permanent && ! l ) { window . matchMedia ( "(prefers-color-scheme: light)" ) . onchange = t => { this . mode = t . matches ?h :r ; this . o ( ) } ; window . matchMedia ( "(prefers-color-scheme: dark)" ) . onchange = t => { this . mode = t . matches ?r :h ; this . o ( ) } } const d = new MutationObserver ( ( ( s , h ) => { this . mode = t . documentElement . dataset . colorMode ; if ( this . permanent && l ) { localStorage . setItem ( e , this . mode ) ; this . i ( i , { permanent :this . permanent } ) } this . h ( ) ; this . i ( o , { colorScheme :this . mode } ) } ) ) ; d . observe ( t . documentElement , { attributes :true } ) ; this . i ( o , { colorScheme :this . mode } ) ; this . h ( ) } attributeChangedCallback ( t , s , o ) { if ( t === "mode" && s !== o && [ h , r ] . includes ( o ) ) { const t = localStorage . getItem ( e ) ; if ( this . mode === t ) { this . mode = o ; this . h ( ) ; this . o ( ) } else if ( this . mode && this . mode !== t ) { this . h ( ) ; this . o ( ) } } else if ( ( t === h || t === r ) && s !== o ) { this . h ( ) } if ( t === "permanent" && typeof this . permanent === "boolean" ) { this . permanent ?localStorage . setItem ( e , this . mode ) :localStorage . removeItem ( e ) } } o ( ) { t . documentElement . setAttribute ( "data-color-mode" , this . mode ) } h ( ) { this . icon . textContent = this . mode === h ?"🌒" :"🌞" ; this . text . textContent = this . mode === h ?this . getAttribute ( r ) :this . getAttribute ( h ) } t ( ) { var s = this . attachShadow ( { mode :"open" } ) ; this . label = t . createElement ( "span" ) ; this . label . setAttribute ( "class" , "wrapper" ) ; this . label . onclick = ( ) => { this . mode = this . mode === h ?r :h ; if ( this . permanent ) { localStorage . setItem ( e , this . mode ) } this . o ( ) ; this . h ( ) } ; s . appendChild ( this . label ) ; this . icon = t . createElement ( "span" ) ; this . label . appendChild ( this . icon ) ; this . text = t . createElement ( "span" ) ; this . label . appendChild ( this . text ) ; const o = `
1276[data-color-mode*='dark'], [data-color-mode*='dark'] body {
1377 color-scheme: dark;
1478 --color-theme-bg: #0d1117;
92156 }
93157 }
94158}
95- customElements . define ( 'markdown-style' , MarkdownStyle ) ; </ script > < markdown-style style ="max-width: 960px; margin: 0 auto 60px auto; padding: 8px " class ="markdown-style ">
159+ customElements . define ( 'markdown-style' , MarkdownStyle ) ; </ script > < markdown-style style ="max-width: 960px; margin: 0 auto 60px auto; padding: 8px;max-width: 960px; " class ="markdown-style ">
96160 < h2 id ="resetcss "> < a class ="anchor " aria-hidden ="true " tabindex ="-1 " href ="#resetcss "> < span class ="octicon octicon-link "> </ span > </ a > reset.css</ h2 >
97161 < p >
98162 < a href ="https://www.npmjs.com/@uiw/reset.css "> < img src ="https://img.shields.io/npm/v/@uiw/reset.css.svg " alt ="NPM Version "> </ a >
@@ -172,6 +236,5 @@ <h3 id="license"><a class="anchor" aria-hidden="true" tabindex="-1" href="#licen
172236 target . classList . remove ( 'active' ) ;
173237 } , 2000 ) ;
174238 } ) ;
175- } </ script > </ markdown-style >
176-
177- </ body > </ html >
239+ } </ script > </ markdown-style > </ body >
240+ </ html >
0 commit comments