Cloned2Preserve
/
qrbtf
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

0.1.0.2

This commit is contained in:
ciaochaos 2020-05-01 22:06:22 +08:00
parent 2d247b0fd4
commit 3172033a92
3 changed files with 100 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
.idea/workspace.xml
View File

@ -13,6 +13,8 @@
<list default="true" id="78c692f3-8e9f-49c7-86c1-0c5e9d711b1f" name="Default Changelist" comment="0.1.0.2">
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/App.css" beforeDir="false" afterPath="$PROJECT_DIR$/src/App.css" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/components/Qrcode.css" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/Qrcode.css" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/components/Qrcode.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/Qrcode.js" afterDir="false" />
</list>
<option name="SHOW_DIALOG" value="false" />
<option name="HIGHLIGHT_CONFLICTS" value="true" />
@ -83,7 +85,7 @@
<option name="presentableId" value="Default" />
<updated>1588240852207</updated>
<workItem from="1588240855414" duration="15673000" />
<workItem from="1588305721761" duration="23650000" />
<workItem from="1588305721761" duration="26719000" />
</task>
<task id="LOCAL-00001" summary="0.1.0.1">
<created>1588308749650</created>
@ -330,7 +332,14 @@
<option name="project" value="LOCAL" />
<updated>1588338498869</updated>
</task>
<option name="localTasksCounter" value="36" />
<task id="LOCAL-00036" summary="0.1.0.2">
<created>1588338725028</created>
<option name="number" value="00036" />
<option name="presentableId" value="LOCAL-00036" />
<option name="project" value="LOCAL" />
<updated>1588338725028</updated>
</task>
<option name="localTasksCounter" value="37" />
<servers />
</component>
<component name="TypeScriptGeneratedFilesManager">
@ -358,10 +367,10 @@
<screen x="0" y="23" width="2541" height="1057" />
</state>
<state x="1161" y="421" key="#Notifications/428.1103.1680.1027/0.23.2541.1057/-1600.203.1600.877@0.23.2541.1057" timestamp="1588307553058" />
<state x="870" y="291" key="Vcs.Push.Dialog.v2" timestamp="1588338517711">
<state x="870" y="291" key="Vcs.Push.Dialog.v2" timestamp="1588338730401">
<screen x="0" y="23" width="2541" height="1057" />
</state>
<state x="870" y="291" key="Vcs.Push.Dialog.v2/428.1103.1680.1027/0.23.2541.1057/-1600.203.1600.877@0.23.2541.1057" timestamp="1588338517711" />
<state x="870" y="291" key="Vcs.Push.Dialog.v2/428.1103.1680.1027/0.23.2541.1057/-1600.203.1600.877@0.23.2541.1057" timestamp="1588338730401" />
<state x="997" y="347" key="git4idea.merge.GitPullDialog" timestamp="1588322703667">
<screen x="0" y="23" width="2541" height="1057" />
</state>

78
src/components/Qrcode.css
View File

@ -10,6 +10,10 @@
.Qr-titled-nobg {
padding-top: calc((10px + 2vmin) * 2);
padding-bottom: calc((10px + 2vmin) * 2);
-webkit-transition-timing-function: ease-in-out;
transition-timing-function: ease-in-out;
-webkit-transition-duration: 0.2s; /* Safari */
transition-duration: 0.2s;
}
.Qr-title {
@ -123,6 +127,7 @@ tr {
width: 100%;
display: inline-flex;
justify-content: space-between ;
align-items: center;
}
td:nth-child(1) {
@ -139,17 +144,29 @@ td {
padding-bottom: 10px;
}
table {
margin-bottom: -10px;
}
.big-input {
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;
width: 20em;
max-width: calc(100vw - 46px);
}
.small-input {
font-size: 0.8em;
border: rgba(0,0,0,0.12) solid 2px;
font-size: 0.9em;
border: rgba(0,0,0,0.12) solid 3px;
width: calc((100vw - 56px) / 2);
}
@media (min-width: 500px) {
.small-input {
width: 200px;
}
}
.Qr-input {
@ -160,7 +177,6 @@ td {
border-radius: 3em;
outline: none;
text-indent: 1em;
max-width: calc(100vw - 46px);
overflow: visible;
-webkit-transition-timing-function: ease-in-out;
transition-timing-function: ease-in-out;
@ -197,5 +213,59 @@ td {
}
.Qr-div-table {
max-width: 600px;
max-width: 410px;
}
.div-btn {
white-space: nowrap;
overflow-x: hidden;
display: flex;
justify-content: space-between;
}
.dl-btn {
float: left;
font-size: 1em;
line-height: 1em;
margin: 0;
width: calc((100vw - 56px) / 2);
height: 2em;
border-radius: 3em;
outline: none;
padding: 0;
box-sizing: border-box;
border: rgba(0,0,0,0.12) solid 3px;
-webkit-transition-timing-function: ease-in-out;
transition-timing-function: ease-in-out;
-webkit-transition-duration: 0.2s; /* Safari */
transition-duration: 0.2s;
-webkit-appearance: none;
-webkit-text-size-adjust: 100%;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
background: white;
font-family: 'Futura', sans-serif;
color: rgba(0,0,0,0.6);
}
.dl-btn:hover {
border-color: #44D7B6;
color: #44D7B6;
}
.dl-btn:active {
-webkit-transition-duration: 0s; /* Safari */
transition-duration: 0s;
border-color: #3BBC9F;
color: #3BBC9F;
}
@media (min-width: 500px) {
.div-btn {
max-width: 410px;
}
.dl-btn {
width: 200px;
height: 2em;
}
}

13
src/components/Qrcode.js
View File

@ -98,6 +98,19 @@ class Qrcode extends React.Component {
</div>
</div>
</div>
<div className="Qr-titled">
<div className="Qr-Centered title-margin">
<div className="Qr-s-title">Downloads</div>
<p className="Qr-s-subtitle">下载二维码</p>
</div>
<div className="Qr-Centered">
<div className="div-btn">
<button className="dl-btn">SVG</button>
<button className="dl-btn">JPG</button>
</div>
</div>
</div>
</div>
);
}