diff --git a/.idea/workspace.xml b/.idea/workspace.xml index 1227fdc..f5f25ae 100644 --- a/.idea/workspace.xml +++ b/.idea/workspace.xml @@ -12,7 +12,6 @@ - @@ -79,7 +78,7 @@ @@ -298,10 +304,10 @@ - + - + diff --git a/src/components/Qrcode.css b/src/components/Qrcode.css index 07d7833..297cf4e 100644 --- a/src/components/Qrcode.css +++ b/src/components/Qrcode.css @@ -18,10 +18,11 @@ .Qr-subtitle { margin-top: -1em; + margin-bottom: 0; } .Qr-s-subtitle { - margin-top: 0; + margin-top: 0.25em; margin-bottom: 0; } @@ -49,7 +50,7 @@ .Qr-box { white-space: nowrap; display: flex; - padding: 10px 13px 0px 23px; + padding: 0px 13px 0px 23px; } @media (min-width: 1000px) { @@ -117,27 +118,44 @@ transition-duration: 0.2s; } +tr { + width: 100%; + display: inline-flex; + justify-content: space-between ; +} + td:nth-child(1) { - font-size: 0.8em; + font-size: 1em; + white-space: nowrap; } td:nth-child(2) { - font-size: 0.8em; + white-space: nowrap; + font-size: 1em; +} + +td { + padding-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; +} + +.small-input { + font-size: 0.8em; + border: rgba(0,0,0,0.12) solid 2px; } .Qr-input { - font-size: 0.6em; caret-color: #44D7B6; padding: 0; line-height: 2em; box-sizing: border-box; - border: rgba(0,0,0,0.12) solid 2px; border-radius: 3em; outline: none; text-indent: 1em; diff --git a/src/components/Qrcode.js b/src/components/Qrcode.js index ea4bf21..499b93b 100644 --- a/src/components/Qrcode.js +++ b/src/components/Qrcode.js @@ -1,11 +1,16 @@ import React from "react"; import QrItem from './QrItem' import {getQrcodeData} from "../utils/qrcodeHandler"; -import './Qrcode.css' +import './Qrcode.css'; +import { InputNumber } from 'antd'; import QrRendererBase from './QrRendererBase' import QrRendererRound from './QrRendererRound' +function onChange(value) { + console.log('changed', value); +} + function QrBoxList(props) { return ( @@ -79,13 +84,13 @@ class Qrcode extends React.Component { 圆点大小 -  px + 随机种 - +