Skip to content

Commit 9d14b40

Browse files
chaoyen1111chaoyen1111
committed
Revert "fix: 🐛 fix input style disappear and urlPath"
This reverts commit df9a264.
1 parent c4b5200 commit 9d14b40

File tree

4 files changed

+126
-142
lines changed

4 files changed

+126
-142
lines changed

‎css/main.css‎

Lines changed: 102 additions & 129 deletions
Original file line numberDiff line numberDiff line change
@@ -53,8 +53,8 @@ body {
5353
overflow: hidden;
5454
}
5555

56-
.content.loading * {
57-
opacity: 0;
56+
.content.loading *{
57+
opacity:0;
5858
}
5959

6060
.panel {
@@ -63,7 +63,7 @@ body {
6363
height: 100%;
6464
top: 0;
6565
left: 0;
66-
transition: .3s;
66+
transition:.3s;
6767
}
6868

6969
/* setting */
@@ -153,13 +153,13 @@ body {
153153
background: rgba(100, 200, 255, .3);
154154
}
155155

156-
#setting #saveBtn {
156+
#setting #saveBtn{
157157
width: max-content;
158-
font-size: 1.2rem;
159-
margin: 30px auto 10px;
160-
padding: 10px 30px;
161-
background: #e50;
162-
border-radius: 20px;
158+
font-size:1.2rem;
159+
margin:30px auto 10px;
160+
padding:10px 30px;
161+
background:#e50;
162+
border-radius:20px;
163163
text-shadow: #900 0 0 5px;
164164
}
165165

@@ -306,14 +306,12 @@ body {
306306
z-index: 2;
307307
vertical-align: middle;
308308
}
309-
310-
#main01 footer .monster-btn svg {
311-
transition: .3s;
312-
background: none;
309+
#main01 footer .monster-btn svg{
310+
transition:.3s;
311+
background:none;
313312
}
314-
315-
#main01 footer .monster-btn.click svg {
316-
width: 90%;
313+
#main01 footer .monster-btn.click svg{
314+
width:90%;
317315
}
318316

319317
/* main02 */
@@ -350,7 +348,7 @@ body {
350348
color: #ddd;
351349
margin: 0 auto;
352350
padding: 10px 1rem;
353-
box-shadow: inset #ccc 0 0 0 0, #ccc 0 0 0 3px;
351+
box-shadow:inset #ccc 0 0 0 0, #ccc 0 0 0 3px;
354352
border-radius: 10px;
355353
border-top-right-radius: 0;
356354
border-bottom-right-radius: 0;
@@ -360,12 +358,12 @@ body {
360358
display: inline-block;
361359
font-size: 1.5rem;
362360
line-height: 1;
363-
box-shadow: inset #ccc 0 0 0 0, #ccc 0 0 0 3px;
361+
box-shadow:inset #ccc 0 0 0 0, #ccc 0 0 0 3px;
364362
border-radius: 10px;
365363
background: rgba(255, 255, 255, .1);
366364
color: #fff;
367365
vertical-align: top;
368-
transition: .3s;
366+
transition:.3s;
369367
padding: 10px 1rem;
370368
border-top-left-radius: 0;
371369
border-bottom-left-radius: 0;
@@ -374,26 +372,26 @@ body {
374372

375373
#main02 .input-group-button.click {
376374
background: rgba(255, 255, 255, .4);
377-
box-shadow: inset #ccc 0 0 0 3px, #ccc 0 0 0 0;
375+
box-shadow:inset #ccc 0 0 0 3px, #ccc 0 0 0 0;
378376
}
379377

380378
#main02 .btn {
381379
display: inline-block;
382380
width: 38%;
383381
height: 14%;
384-
box-shadow: inset #ccc 0 0 0 0, #ccc 0 0 0 3px;
382+
box-shadow:inset #ccc 0 0 0 0, #ccc 0 0 0 3px;
385383
margin: 7px 5px;
386384
border-radius: 10px;
387385
background: rgba(255, 255, 255, .1);
388386
color: #fff;
389387
vertical-align: top;
390388
-webkit-user-select: none;
391-
transition: .3s;
389+
transition:.3s;
392390
}
393391

394392
#main02 .btn.click {
395393
background: rgba(255, 255, 255, .4);
396-
box-shadow: inset #ccc 0 0 0 3px, #ccc 0 0 0 0;
394+
box-shadow:inset #ccc 0 0 0 3px, #ccc 0 0 0 0;
397395
}
398396

399397
#main02 .btn::before {
@@ -408,147 +406,122 @@ body {
408406
display: inline-block;
409407
vertical-align: middle;
410408
font-size: 1.5rem;
411-
transition: .3s;
409+
transition:.3s;
412410
}
413411

414412
#main02 .btn.click span {
415413
font-size: 1.4rem;
416414
}
417415

418416
/* popup */
419-
#popup {
420-
top: 20%;
421-
left: 15%;
422-
width: 70%;
423-
height: max-content;
424-
border: 3px solid #fff;
425-
z-index: 20;
426-
border-radius: 20px;
427-
padding: 30px 10px;
428-
text-align: center;
429-
background: rgba(50, 100, 150, .9);
430-
color: #fff;
431-
opacity: 0;
417+
#popup{
418+
top:20%;
419+
left:15%;
420+
width:70%;
421+
height:max-content;
422+
border:3px solid #fff;
423+
z-index:20;
424+
border-radius:20px;
425+
padding:30px 10px;
426+
text-align:center;
427+
background:rgba(50,100,150,.9);
428+
color:#fff;
429+
opacity:0;
432430
pointer-events: none;
433-
transition: .3s;
431+
transition:.3s;
434432
}
435-
436-
#popup.show {
437-
top: 17%;
438-
opacity: 1;
433+
#popup.show{
434+
top:17%;
435+
opacity:1;
439436
pointer-events: auto;
440437
}
441-
442-
#popup h4 {
443-
font-size: 1.1rem;
444-
margin-bottom: 10px;
438+
#popup h4{
439+
font-size:1.1rem;
440+
margin-bottom:10px;
445441
}
446-
447-
#saveUrl {
448-
font-size: 1.1rem;
449-
width: 100%;
450-
word-wrap: break-word;
442+
#saveUrl{
443+
font-size:1.1rem;
444+
width:100%;
445+
word-wrap:break-word;
451446
line-height: 1.5;
452447
}
453-
454-
#saveUrl::selection {
455-
color: #fff;
456-
background: none;
448+
#saveUrl::selection{
449+
color:#fff;
450+
background:none;
457451
}
458-
459-
#copy {
460-
font-size: 1.1rem;
461-
padding: 10px 30px;
462-
width: max-content;
463-
margin: 20px auto 0;
464-
background: #e50;
465-
border-radius: 20px;
452+
#copy{
453+
font-size:1.1rem;
454+
padding:10px 30px;
455+
width:max-content;
456+
margin:20px auto 0;
457+
background:#e50;
458+
border-radius:20px;
466459
}
467-
468-
#copy.copied {
460+
#copy.copied{
469461
pointer-events: none;
470-
opacity: .7;
462+
opacity:.7;
471463
}
472-
473-
#popupClose {
474-
position: absolute;
475-
width: 40px;
476-
height: 40px;
464+
#popupClose{
465+
position:absolute;
466+
width:40px;
467+
height:40px;
477468
border-radius: 50%;
478-
border: 3px solid #fff;
479-
background: #123;
480-
top: -18px;
481-
right: -18px;
469+
border:3px solid #fff;
470+
background:#123;
471+
top:-18px;
472+
right:-18px;
482473
}
483-
484474
#popupClose::before,
485-
#popupClose::after {
486-
content: "";
487-
position: absolute;
488-
width: 80%;
489-
height: 10%;
475+
#popupClose::after{
476+
content:"";
477+
position:absolute;
478+
width:80%;
479+
height:10%;
490480
transform-origin: 50% 50%;
491-
background: #fff;
492-
top: 45%;
493-
left: 10%;
481+
background:#fff;
482+
top:45%;
483+
left:10%;
494484
}
495-
496-
#popupClose::before {
497-
transform: rotate(45deg);
485+
#popupClose::before{
486+
transform:rotate(45deg);
498487
}
499-
500-
#popupClose::after {
501-
transform: rotate(-45deg);
488+
#popupClose::after{
489+
transform:rotate(-45deg);
502490
}
503491

504492
/* message */
505493

506-
#message {
507-
width: 60%;
508-
top: -10px;
509-
left: 20%;
510-
height: max-content;
511-
background: rgba(255, 255, 255, .2);
512-
border: 1px dashed #fff;
513-
border-radius: 20px;
494+
#message{
495+
width:60%;
496+
top:-10px;
497+
left:20%;
498+
height:max-content;
499+
background:rgba(255,255,255,.2);
500+
border:1px dashed #fff;
501+
border-radius:20px;
514502
padding: 0 10px;
515-
opacity: 0;
516-
transition: .3s;
503+
opacity:0;
504+
transition:.3s;
517505
pointer-events: none;
518506
}
519-
520-
#message.show {
521-
opacity: 1;
522-
top: 15px;
507+
#message.show{
508+
opacity:1;
509+
top:15px;
523510
}
524511

525-
#message h4 {
526-
color: #fff;
527-
font-size: 1.2rem;
528-
text-align: center;
529-
line-height: 1.8;
512+
#message h4{
513+
color:#fff;
514+
font-size:1.2rem;
515+
text-align:center;
516+
line-height:1.8;
530517
}
531518

532519
.noselect {
533-
-webkit-touch-callout: none;
534-
/* iOS Safari */
535-
-webkit-user-select: none;
536-
/* Safari */
537-
-khtml-user-select: none;
538-
/* Konqueror HTML */
539-
-moz-user-select: none;
540-
/* Old versions of Firefox */
541-
-ms-user-select: none;
542-
/* Internet Explorer/Edge */
543-
user-select: none;
544-
/* Non-prefixed version, currently
520+
-webkit-touch-callout: none; /* iOS Safari */
521+
-webkit-user-select: none; /* Safari */
522+
-khtml-user-select: none; /* Konqueror HTML */
523+
-moz-user-select: none; /* Old versions of Firefox */
524+
-ms-user-select: none; /* Internet Explorer/Edge */
525+
user-select: none; /* Non-prefixed version, currently
545526
supported by Chrome, Edge, Opera and Firefox */
546-
}
547-
548-
input {
549-
-webkit-appearance: none;
550-
/* Safari 和 Chrome，常用於iOS下移除內建樣式 */
551-
-moz-appearance: none;
552-
/* FireFox */
553-
appearance: none;
554527
}

‎index-en.html‎

Lines changed: 22 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -6,28 +6,39 @@
66
name="viewport"
77
content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
88
/>
9-
<meta name="author" content="webduino" />
10-
<meta name="copyright" content="webduino" />
11-
<title>Webduino 萬用遙控器</title>
9+
<meta name="author" content="oxxo.studio" />
10+
<meta name="copyright" content="oxxo.studio" />
11+
<title>Webduino Remote Control</title>
1212

1313
<meta
1414
name="description"
15-
content="Webduino 萬用遙控器，受到老師學生們喜愛，能夠透過搖桿和多顆按鈕發送網路廣播訊號，輕鬆遙控自走車、操控物聯網設備！"
15+
content="這是針對 Webduino 所設計的萬用遙控器，可以透過虛擬機器人搖桿或十顆按鈕發送網路廣播訊號，輕鬆串連物聯網的各種生活體驗。"
1616
/>
1717
<meta
1818
itemprop="description"
19-
content="Webduino 萬用遙控器，受到老師學生們喜愛，能夠透過搖桿和多顆按鈕發送網路廣播訊號，輕鬆遙控自走車、操控物聯網設備！"
19+
content="這是針對 Webduino 所設計的萬用遙控器，可以透過虛擬機器人搖桿或十顆按鈕發送網路廣播訊號，輕鬆串連物聯網的各種生活體驗。"
20+
/>
21+
<meta
22+
itemprop="image"
23+
content="https://www.oxxostudio.tw/webduino-remote/media/snapshot.jpg"
2024
/>
21-
<meta itemprop="image" content="" />
2225
<meta
2326
property="og:description"
24-
content="Webduino 萬用遙控器，受到老師學生們喜愛，能夠透過搖桿和多顆按鈕發送網路廣播訊號，輕鬆遙控自走車、操控物聯網設備！"
27+
content="這是針對 Webduino 所設計的萬用遙控器，可以透過虛擬機器人搖桿或十顆按鈕發送網路廣播訊號，輕鬆串連物聯網的各種生活體驗。"
2528
/>
2629
<meta property="og:title" content="Webduino 遙控器" />
27-
<meta property="og:url" content="https://webduino.io" />
28-
<meta property="og:image" content="" />
29-
<link rel="icon" href="webduino.ico" type="image/x-icon" />
30-
<link rel="canonical" href="https://webduino.io/" />
30+
<meta
31+
property="og:url"
32+
content="https://www.oxxostudio.tw/webduino-remote/index.html"
33+
/>
34+
<meta
35+
property="og:image"
36+
content="https://www.oxxostudio.tw/webduino-remote/media/snapshot.jpg"
37+
/>
38+
<link
39+
rel="canonical"
40+
href="https://www.oxxostudio.tw/webduino-remote/index.html"
41+
/>
3142

3243
<link rel="stylesheet" href="css/main.css" />
3344
</head>

0 commit comments

Comments
 (0)