Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commit498a791

Browse files
committed
gh ribbon
1 parentc0124d7 commit498a791

File tree

2 files changed

+45
-10
lines changed

2 files changed

+45
-10
lines changed

‎examples/GUI/demo.css‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -48,6 +48,7 @@ header {
4848
background:rgba(15,25,35,0.4);
4949
box-shadow:01px3pxrgba(0,0,0,0.2);
5050
z-index:10;
51+
position: relative;
5152
}
5253

5354
h1 {
@@ -69,6 +70,7 @@ h1 {
6970
display: flex;
7071
align-items: center;
7172
gap:10px;
73+
margin-right:60px;
7274
}
7375

7476
.button {
@@ -572,6 +574,19 @@ footer a:hover {
572574
.shortcuts {
573575
display: none;
574576
}
577+
578+
.toolbar {
579+
margin-right:50px;
580+
}
581+
582+
.button {
583+
padding:6px10px;
584+
font-size:0.8em;
585+
}
586+
587+
h1 {
588+
font-size:1.2rem;
589+
}
575590
}
576591

577592
body.resizing {
@@ -595,6 +610,22 @@ body.resizing {
595610
animation: octocat-wave560ms ease-in-out;
596611
}
597612

613+
.github-corner {
614+
z-index:20;
615+
position: absolute;
616+
top:0;
617+
right:0;
618+
}
619+
620+
.github-cornersvg {
621+
opacity:0.7;
622+
transition: opacity0.3s ease;
623+
}
624+
625+
.github-corner:hoversvg {
626+
opacity:1;
627+
}
628+
598629
@keyframes octocat-wave {
599630
0%,100% {transform:rotate(0); }
600631
20%,60% {transform:rotate(-25deg); }
@@ -608,6 +639,10 @@ body.resizing {
608639
.github-corner .octo-arm {
609640
animation: octocat-wave560ms ease-in-out;
610641
}
642+
.github-cornersvg {
643+
width:50px;
644+
height:50px;
645+
}
611646
}
612647

613648
.actions {

‎examples/GUI/index.html‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,15 @@
1515
</head>
1616

1717
<body>
18+
<!-- GitHub corner -->
19+
<ahref="https://github.com/sql-js/sql.js"class="github-corner"aria-label="View on GitHub">
20+
<svgwidth="60"height="60"viewBox="0 0 250 250"style="fill:rgba(79, 190, 255, 0.3); color:#0f1923; position: absolute; top: 0; border: 0; right: 0;"aria-hidden="true">
21+
<pathd="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
22+
<pathd="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"style="transform-origin: 130px 106px;"class="octo-arm"></path>
23+
<pathd="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>
24+
</svg>
25+
</a>
26+
1827
<header>
1928
<h1>SQL.js Interpreter</h1>
2029
<divclass="toolbar">
@@ -46,7 +55,7 @@ <h1>SQL.js Interpreter</h1>
4655
<circlecx="12"cy="12"r="10"></circle>
4756
<polylinepoints="12 6 12 12 16 14"></polyline>
4857
</svg>
49-
Examples & History
58+
Examples
5059
</button>
5160
</div>
5261
</header>
@@ -194,15 +203,6 @@ <h1>SQL.js Interpreter</h1>
194203
</span>
195204
</template>
196205

197-
<!-- GitHub corner -->
198-
<ahref="https://github.com/sql-js/sql.js"class="github-corner"aria-label="View on GitHub">
199-
<svgwidth="80"height="80"viewBox="0 0 250 250"style="fill:#4fbeff; color:#0f1923; position: absolute; top: 0; border: 0; right: 0;"aria-hidden="true">
200-
<pathd="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
201-
<pathd="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"style="transform-origin: 130px 106px;"class="octo-arm"></path>
202-
<pathd="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>
203-
</svg>
204-
</a>
205-
206206
<scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.58.1/mode/sql/sql.min.js"></script>
207207
<scripttype="text/javascript"src="gui.js"></script>
208208
</body>

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp