From be900aa25ca205c467dcbbab9c284ef680441996 Mon Sep 17 00:00:00 2001
From: Shin'ya Ueoka <ueokande@i-beam.org>
Date: Mon, 29 Apr 2019 15:27:23 +0900
Subject: Clean settings components

---
 src/settings/components/ui/AddButton.jsx      | 12 +++++++
 src/settings/components/ui/AddButton.scss     | 13 +++++++
 src/settings/components/ui/DeleteButton.jsx   | 12 +++++++
 src/settings/components/ui/DeleteButton.scss  | 13 +++++++
 src/settings/components/ui/Input.jsx          | 52 +++++++++++++++++++++++++++
 src/settings/components/ui/Input.scss         | 29 +++++++++++++++
 src/settings/components/ui/add-button.jsx     | 12 -------
 src/settings/components/ui/add-button.scss    | 13 -------
 src/settings/components/ui/delete-button.jsx  | 12 -------
 src/settings/components/ui/delete-button.scss | 13 -------
 src/settings/components/ui/input.jsx          | 52 ---------------------------
 src/settings/components/ui/input.scss         | 29 ---------------
 12 files changed, 131 insertions(+), 131 deletions(-)
 create mode 100644 src/settings/components/ui/AddButton.jsx
 create mode 100644 src/settings/components/ui/AddButton.scss
 create mode 100644 src/settings/components/ui/DeleteButton.jsx
 create mode 100644 src/settings/components/ui/DeleteButton.scss
 create mode 100644 src/settings/components/ui/Input.jsx
 create mode 100644 src/settings/components/ui/Input.scss
 delete mode 100644 src/settings/components/ui/add-button.jsx
 delete mode 100644 src/settings/components/ui/add-button.scss
 delete mode 100644 src/settings/components/ui/delete-button.jsx
 delete mode 100644 src/settings/components/ui/delete-button.scss
 delete mode 100644 src/settings/components/ui/input.jsx
 delete mode 100644 src/settings/components/ui/input.scss

(limited to 'src/settings/components/ui')

diff --git a/src/settings/components/ui/AddButton.jsx b/src/settings/components/ui/AddButton.jsx
new file mode 100644
index 0000000..185a03b
--- /dev/null
+++ b/src/settings/components/ui/AddButton.jsx
@@ -0,0 +1,12 @@
+import './AddButton.scss';
+import React from 'react';
+
+class AddButton extends React.Component {
+  render() {
+    return <input
+      className='ui-add-button' type='button' value='&#x271a;'
+      {...this.props} />;
+  }
+}
+
+export default AddButton;
diff --git a/src/settings/components/ui/AddButton.scss b/src/settings/components/ui/AddButton.scss
new file mode 100644
index 0000000..beb5688
--- /dev/null
+++ b/src/settings/components/ui/AddButton.scss
@@ -0,0 +1,13 @@
+.ui-add-button {
+  border: none;
+  padding: 4;
+  display: inline;
+  background: none;
+  font-weight: bold;
+  color: green;
+  cursor: pointer;
+
+  &:hover {
+    color: darkgreen;
+  }
+}
diff --git a/src/settings/components/ui/DeleteButton.jsx b/src/settings/components/ui/DeleteButton.jsx
new file mode 100644
index 0000000..75811cd
--- /dev/null
+++ b/src/settings/components/ui/DeleteButton.jsx
@@ -0,0 +1,12 @@
+import './DeleteButton.scss';
+import React from 'react';
+
+class DeleteButton extends React.Component {
+  render() {
+    return <input
+      className='ui-delete-button' type='button' value='&#x2716;'
+      {...this.props} />;
+  }
+}
+
+export default DeleteButton;
diff --git a/src/settings/components/ui/DeleteButton.scss b/src/settings/components/ui/DeleteButton.scss
new file mode 100644
index 0000000..5932a72
--- /dev/null
+++ b/src/settings/components/ui/DeleteButton.scss
@@ -0,0 +1,13 @@
+
+.ui-delete-button {
+  border: none;
+  padding: 4;
+  display: inline;
+  background: none;
+  color: red;
+  cursor: pointer;
+
+  &:hover {
+    color: darkred;
+  }
+}
diff --git a/src/settings/components/ui/Input.jsx b/src/settings/components/ui/Input.jsx
new file mode 100644
index 0000000..d090f5b
--- /dev/null
+++ b/src/settings/components/ui/Input.jsx
@@ -0,0 +1,52 @@
+import React from 'react';
+import './Input.scss';
+
+class Input extends React.Component {
+
+  renderText(props) {
+    let inputClassName = props.error ? 'input-error' : '';
+    return <div className='settings-ui-input'>
+      <label htmlFor={props.id}>{ props.label }</label>
+      <input type='text' className={inputClassName} {...props} />
+    </div>;
+  }
+
+  renderRadio(props) {
+    let inputClassName = props.error ? 'input-error' : '';
+    return <div className='settings-ui-input'>
+      <label>
+        <input type='radio' className={inputClassName} {...props} />
+        { props.label }
+      </label>
+    </div>;
+  }
+
+  renderTextArea(props) {
+    let inputClassName = props.error ? 'input-error' : '';
+    return <div className='settings-ui-input'>
+      <label
+        htmlFor={props.id}
+      >{ props.label }</label>
+      <textarea className={inputClassName} {...props} />
+      <p className='settings-ui-input-error'>{ this.props.error }</p>
+    </div>;
+  }
+
+  render() {
+    let { type } = this.props;
+
+    switch (this.props.type) {
+    case 'text':
+      return this.renderText(this.props);
+    case 'radio':
+      return this.renderRadio(this.props);
+    case 'textarea':
+      return this.renderTextArea(this.props);
+    default:
+      console.warn(`Unsupported input type ${type}`);
+    }
+    return null;
+  }
+}
+
+export default Input;
diff --git a/src/settings/components/ui/Input.scss b/src/settings/components/ui/Input.scss
new file mode 100644
index 0000000..ad4daf8
--- /dev/null
+++ b/src/settings/components/ui/Input.scss
@@ -0,0 +1,29 @@
+.settings-ui-input {
+  page-break-inside: avoid;
+
+  * {
+    page-break-inside: avoid;
+  }
+
+  label {
+    font-weight: bold;
+    min-width: 14rem;
+    display: inline-block;
+  }
+
+  input[type='text'] {
+    padding: 4px;
+    width: 8rem;
+  }
+
+  input.input-crror,
+  textarea.input-error {
+    box-shadow: 0 0 2px red;
+  }
+
+  &-error {
+    font-weight: bold;
+    color: red;
+    min-height: 1.5em;
+  }
+}
diff --git a/src/settings/components/ui/add-button.jsx b/src/settings/components/ui/add-button.jsx
deleted file mode 100644
index 031d28b..0000000
--- a/src/settings/components/ui/add-button.jsx
+++ /dev/null
@@ -1,12 +0,0 @@
-import './add-button.scss';
-import React from 'react';
-
-class AddButton extends React.Component {
-  render() {
-    return <input
-      className='ui-add-button' type='button' value='&#x271a;'
-      {...this.props} />;
-  }
-}
-
-export default AddButton;
diff --git a/src/settings/components/ui/add-button.scss b/src/settings/components/ui/add-button.scss
deleted file mode 100644
index beb5688..0000000
--- a/src/settings/components/ui/add-button.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-.ui-add-button {
-  border: none;
-  padding: 4;
-  display: inline;
-  background: none;
-  font-weight: bold;
-  color: green;
-  cursor: pointer;
-
-  &:hover {
-    color: darkgreen;
-  }
-}
diff --git a/src/settings/components/ui/delete-button.jsx b/src/settings/components/ui/delete-button.jsx
deleted file mode 100644
index 3dfe14a..0000000
--- a/src/settings/components/ui/delete-button.jsx
+++ /dev/null
@@ -1,12 +0,0 @@
-import './delete-button.scss';
-import React from 'react';
-
-class DeleteButton extends React.Component {
-  render() {
-    return <input
-      className='ui-delete-button' type='button' value='&#x2716;'
-      {...this.props} />;
-  }
-}
-
-export default DeleteButton;
diff --git a/src/settings/components/ui/delete-button.scss b/src/settings/components/ui/delete-button.scss
deleted file mode 100644
index 5932a72..0000000
--- a/src/settings/components/ui/delete-button.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-
-.ui-delete-button {
-  border: none;
-  padding: 4;
-  display: inline;
-  background: none;
-  color: red;
-  cursor: pointer;
-
-  &:hover {
-    color: darkred;
-  }
-}
diff --git a/src/settings/components/ui/input.jsx b/src/settings/components/ui/input.jsx
deleted file mode 100644
index 2f42b62..0000000
--- a/src/settings/components/ui/input.jsx
+++ /dev/null
@@ -1,52 +0,0 @@
-import React from 'react';
-import './input.scss';
-
-class Input extends React.Component {
-
-  renderText(props) {
-    let inputClassName = props.error ? 'input-error' : '';
-    return <div className='settings-ui-input'>
-      <label htmlFor={props.id}>{ props.label }</label>
-      <input type='text' className={inputClassName} {...props} />
-    </div>;
-  }
-
-  renderRadio(props) {
-    let inputClassName = props.error ? 'input-error' : '';
-    return <div className='settings-ui-input'>
-      <label>
-        <input type='radio' className={inputClassName} {...props} />
-        { props.label }
-      </label>
-    </div>;
-  }
-
-  renderTextArea(props) {
-    let inputClassName = props.error ? 'input-error' : '';
-    return <div className='settings-ui-input'>
-      <label
-        htmlFor={props.id}
-      >{ props.label }</label>
-      <textarea className={inputClassName} {...props} />
-      <p className='settings-ui-input-error'>{ this.props.error }</p>
-    </div>;
-  }
-
-  render() {
-    let { type } = this.props;
-
-    switch (this.props.type) {
-    case 'text':
-      return this.renderText(this.props);
-    case 'radio':
-      return this.renderRadio(this.props);
-    case 'textarea':
-      return this.renderTextArea(this.props);
-    default:
-      console.warn(`Unsupported input type ${type}`);
-    }
-    return null;
-  }
-}
-
-export default Input;
diff --git a/src/settings/components/ui/input.scss b/src/settings/components/ui/input.scss
deleted file mode 100644
index ad4daf8..0000000
--- a/src/settings/components/ui/input.scss
+++ /dev/null
@@ -1,29 +0,0 @@
-.settings-ui-input {
-  page-break-inside: avoid;
-
-  * {
-    page-break-inside: avoid;
-  }
-
-  label {
-    font-weight: bold;
-    min-width: 14rem;
-    display: inline-block;
-  }
-
-  input[type='text'] {
-    padding: 4px;
-    width: 8rem;
-  }
-
-  input.input-crror,
-  textarea.input-error {
-    box-shadow: 0 0 2px red;
-  }
-
-  &-error {
-    font-weight: bold;
-    color: red;
-    min-height: 1.5em;
-  }
-}
-- 
cgit v1.2.3