全局样式

src/components/PageContent/index.js

@@ -0,0 +1,34 @@
+import { CloseOutlined, LeftOutlined } from '@ant-design/icons';
+import styles from './index.less';
+
+export default (props) => {
+  const {
+    title,
+    children,
+    center,
+    style,
+    closeable = true,
+    returnable = false,
+  } = props;
+
+  return (
+    <div className={styles.page} style={style}>
+      <div className={styles.pageTitle}>
+        <div>
+          {returnable ? <LeftOutlined /> : <span className={styles.titleBar} />}
+
+          <span
+            className={styles.title}
+            style={{ fontSize: 22, paddingLeft: 12 }}
+          >
+            {title}
+          </span>
+        </div>
+        <div className={styles.center}>{center}</div>
+        <div>{closeable && <CloseOutlined />}</div>
+      </div>
+
+      {children}
+    </div>
+  );
+};

src/components/PageContent/index.less

@@ -0,0 +1,31 @@
+.page {
+  background-color: #a0bcda54;
+  height: 100%;
+  padding: 20px;
+
+  .pageTitle {
+    display: flex;
+    padding: 0 10px;
+    margin-bottom: 10px;
+    height: 40px;
+    align-items: center;
+    position: relative;
+    justify-content: space-between;
+  }
+  .titleBar {
+    width: 8px;
+    height: 30px;
+    background-color: #366cda;
+    float: left;
+  }
+  .title {
+    font-size: 22px;
+    padding-left: 12px;
+  }
+  .center {
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+  }
+}

src/global.less

@@ -0,0 +1,98 @@
+// Reset default browser styles
+* {
+  box-sizing: border-box;
+}
+
+#root {
+  min-height: 100vh;
+}
+
+html,
+body,
+ul,
+ol,
+li,
+dl,
+dt,
+dd,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+pre,
+code,
+form,
+fieldset,
+legend,
+input,
+textarea,
+p,
+blockquote,
+th,
+td,
+hr,
+button {
+  margin: 0;
+  padding: 0;
+  font-size: 100%;
+  font-family: inherit;
+  vertical-align: baseline;
+  border: 0 none;
+  color: inherit;
+  background: transparent;
+  box-sizing: border-box;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+body {
+  color: #333;
+}
+
+// Remove list styles on ul, ol
+ul,
+ol {
+  list-style: none;
+}
+
+// Remove link styles
+a {
+  text-decoration: none;
+  color: inherit;
+}
+
+// Remove table border
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+// Remove input styling for IE
+input[type='text'],
+input[type='password'],
+input[type='number'],
+textarea {
+  appearance: none;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  // border-radius: 0;
+}
+
+// Remove button styling for IE
+button,
+input[type='submit'],
+input[type='reset'] {
+  appearance: none;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  border: 0 none;
+  background: none;
+  padding: 0;
+  cursor: pointer;
+}
+
+// Remove outline on focus
+*:focus {
+  outline: none;
+}