From a6588e4453bf2e309100d5b38f7bd2d02d032dd9 Mon Sep 17 00:00:00 2001
From: ciaochaos <1272777550@qq.com>
Date: Fri, 1 May 2020 22:26:28 +0800
Subject: [PATCH] 0.1.0.2
---
.idea/workspace.xml | 18 ++++++++++------
public/index.html | 4 ++--
src/components/Qrcode.css | 43 +++++++++++++++++++++++++++++++++------
3 files changed, 51 insertions(+), 14 deletions(-)
diff --git a/.idea/workspace.xml b/.idea/workspace.xml
index 88a8350..718c30c 100644
--- a/.idea/workspace.xml
+++ b/.idea/workspace.xml
@@ -12,9 +12,8 @@
-
+
-
@@ -85,7 +84,7 @@
1588240852207
-
+
1588308749650
@@ -339,7 +338,14 @@
1588338725028
-
+
+ 1588341982123
+
+
+
+ 1588341982123
+
+
@@ -367,10 +373,10 @@
-
+
-
+
diff --git a/public/index.html b/public/index.html
index e31be85..e42a74d 100644
--- a/public/index.html
+++ b/public/index.html
@@ -1,5 +1,5 @@
-
+
@@ -26,7 +26,7 @@
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
- React App
+ qrbtf.com
diff --git a/src/components/Qrcode.css b/src/components/Qrcode.css
index b38bac1..516fbe2 100644
--- a/src/components/Qrcode.css
+++ b/src/components/Qrcode.css
@@ -1,12 +1,19 @@
.Qr-titled {
background-color: rgba(0,0,0,0.06);
box-sizing: border-box;
- border-top: rgba(0,0,0,0.06) solid 3px;
- border-bottom: rgba(0,0,0,0.06) solid 3px;
+ border-top: rgba(0,0,0,0.06) solid 2px;
+ border-bottom: rgba(0,0,0,0.06) solid 2px;
padding-top: calc((10px + 2vmin) * 2);
padding-bottom: calc((10px + 2vmin) * 2);
}
+@media (min-width: 500px) {
+ .Qr-titled {
+ border-top: rgba(0,0,0,0.06) solid 3px;
+ border-bottom: rgba(0,0,0,0.06) solid 3px;
+ }
+}
+
.Qr-titled-nobg {
padding-top: calc((10px + 2vmin) * 2);
padding-bottom: calc((10px + 2vmin) * 2);
@@ -77,13 +84,19 @@
height: calc((100vw - 56px) / 2);
border-radius: 10px;
box-sizing: border-box;
- border: rgba(0,0,0,0.12) solid 3px;
+ border: rgba(0,0,0,0.12) solid 2px;
-webkit-transition-timing-function: ease-in-out;
transition-timing-function: ease-in-out;
-webkit-transition-duration: 0.2s; /* Safari */
transition-duration: 0.2s;
}
+@media (min-width: 500px) {
+ .Qr-item-image {
+ border: rgba(0,0,0,0.12) solid 3px;
+ }
+}
+
.Qr-item-image-inner {
opacity: 0.36;
-webkit-transition-timing-function: ease-in-out;
@@ -152,17 +165,29 @@ table {
font-size: calc(10px + 2vmin);
margin-top: calc((10px + 2vmin) * 2);
margin-bottom: calc((10px + 2vmin) * 2);
- border: rgba(0,0,0,0.12) solid 3px;
+ border: rgba(0,0,0,0.12) solid 2px;
width: 20em;
max-width: calc(100vw - 46px);
}
+@media (min-width: 500px) {
+ .big-input {
+ border: rgba(0,0,0,0.12) solid 3px;
+ }
+}
+
.small-input {
font-size: 0.9em;
- border: rgba(0,0,0,0.12) solid 3px;
+ border: rgba(0,0,0,0.12) solid 2px;
width: calc((100vw - 56px) / 2);
}
+@media (min-width: 500px) {
+ .small-input {
+ border: rgba(0,0,0,0.12) solid 3px;
+ }
+}
+
@media (min-width: 500px) {
.small-input {
width: 200px;
@@ -234,7 +259,7 @@ table {
outline: none;
padding: 0;
box-sizing: border-box;
- border: rgba(0,0,0,0.12) solid 3px;
+ border: rgba(0,0,0,0.12) solid 2px;
-webkit-transition-timing-function: ease-in-out;
transition-timing-function: ease-in-out;
-webkit-transition-duration: 0.2s; /* Safari */
@@ -247,6 +272,12 @@ table {
color: rgba(0,0,0,0.6);
}
+@media (min-width: 500px) {
+ .dl-btn {
+ border: rgba(0,0,0,0.12) solid 3px;
+ }
+}
+
.dl-btn:hover {
border-color: #44D7B6;
color: #44D7B6;