From 3e8500d466b641ef34c24f8b0de8163a44ba7a9e Mon Sep 17 00:00:00 2001 From: jackyzha0 Date: Fri, 5 Mar 2021 22:17:18 -0800 Subject: refactoring css --- frontend/src/components/Form/Button.js | 0 frontend/src/components/Form/Input.js | 3 +++ frontend/src/components/Form/index.js | 0 frontend/src/components/Form/mixins.js | 33 +++++++++++++++++++++++++++++++++ 4 files changed, 36 insertions(+) create mode 100644 frontend/src/components/Form/Button.js create mode 100644 frontend/src/components/Form/Input.js create mode 100644 frontend/src/components/Form/index.js create mode 100644 frontend/src/components/Form/mixins.js (limited to 'frontend/src/components/Form') diff --git a/frontend/src/components/Form/Button.js b/frontend/src/components/Form/Button.js new file mode 100644 index 0000000..e69de29 diff --git a/frontend/src/components/Form/Input.js b/frontend/src/components/Form/Input.js new file mode 100644 index 0000000..86af7d1 --- /dev/null +++ b/frontend/src/components/Form/Input.js @@ -0,0 +1,3 @@ +import {RelPositioning} from "../Inputs/shared"; +import React from "react"; + diff --git a/frontend/src/components/Form/index.js b/frontend/src/components/Form/index.js new file mode 100644 index 0000000..e69de29 diff --git a/frontend/src/components/Form/mixins.js b/frontend/src/components/Form/mixins.js new file mode 100644 index 0000000..dd26f7e --- /dev/null +++ b/frontend/src/components/Form/mixins.js @@ -0,0 +1,33 @@ +import {css} from 'styled-components'; + +export const Dropshadow = css` + box-shadow: 0 14px 28px rgba(27, 33, 48,0.06), 0 10px 10px rgba(27, 33, 48,0.02); +` + +export const InputLike = css` + width: 100%; + font-family: 'JetBrains Mono', monospace; + font-size: 0.8em; + padding: calc(0.8em - 1px); + border-radius: 3px; + border: 1px solid ${p => p.theme.colors.border}; + outline: none; + margin: 1.7em 0; +` + +export const ButtonLike = css` + font-family: 'JetBrains Mono', serif; + font-weight: 700; + padding: 0.8em 2em; + margin: 2em 0; + outline: 0; + + ${p => p.primary ? ` + color: #faf9f5; + background-color: #111111; + ` : ` + color: #faf9f5; + background-color: #111111; + `} + +` \ No newline at end of file -- cgit v1.2.3