Convert vanilla CSS to SASS

1 files changed, 134 insertions, 0 deletions

diff --git a/assets/sass/_form.sass b/assets/sass/_form.sass
new file mode 100644
index 00000000..05a332a1
--- /dev/null
+++ b/assets/sass/_form.sass
@@ -0,0 +1,134 @@
+form
+  margin-bottom: 20px
+
+label
+  cursor: pointer
+  display: block
+  margin-top: 10px
+
+input
+  &[type="number"], &[type="date"], &[type="email"], &[type="password"], &[type="text"]
+    color: #888
+    border: 1px solid #ccc
+    width: 300px
+    max-width: 95%
+    font-size: 100%
+    height: 25px
+    padding-bottom: 0
+    font-family: sans-serif
+    margin-top: 10px
+    +appearance
+  &[type="number"]:focus, &[type="date"]:focus, &[type="email"]:focus, &[type="password"]:focus, &[type="text"]:focus
+    color: #000
+    border-color: rgba(82, 168, 236, 0.8)
+    outline: 0
+    box-shadow: 0 0 8px rgba(82, 168, 236, 0.6)
+
+textarea:focus
+  color: #000
+  border-color: rgba(82, 168, 236, 0.8)
+  outline: 0
+  box-shadow: 0 0 8px rgba(82, 168, 236, 0.6)
+
+input
+  &.form-numeric, &[type="number"]
+    width: 70px
+
+textarea
+  border: 1px solid #ccc
+  width: 400px
+  max-width: 99%
+  height: 200px
+  font-size: 100%
+  font-family: sans-serif
+
+select
+  max-width: 95%
+  &:focus
+    outline: 0
+
+.tag-autocomplete
+  width: 400px
+
+span.select2-container
+  margin-top: 2px
+
+\::-webkit-input-placeholder, ::-ms-input-placeholder, ::-moz-placeholder
+  color: #ddd
+  padding-top: 2px
+
+.form-actions
+  padding-top: 20px
+  clear: both
+
+input.form-error, textarea.form-error
+  border: 2px solid #b94a48
+
+input.form-error:focus, textarea.form-error:focus
+  box-shadow: none
+  border: 2px solid #b94a48
+
+.form-required
+  color: red
+  padding-left: 5px
+  font-weight: bold
+
+.form-errors
+  color: #b94a48
+  list-style-type: none
+
+ul.form-errors li
+  margin-left: 0
+
+.form-help
+  font-size: 0.8em
+  color: brown
+  margin-bottom: 15px
+
+.form-inline
+  padding: 0
+  margin: 0
+  border: none
+  label
+    display: inline
+  input, select
+    margin: 0 15px 0 0
+  .form-required
+    display: none
+
+.form-inline-group
+  display: inline
+
+input
+  &.form-datetime, &.form-date
+    width: 150px
+  &.form-input-large
+    width: 400px
+  &.form-input-small
+    width: 150px
+
+.form-columns
+  display: -webkit-flex
+  display: flex
+  -webkit-flex-direction: row
+  flex-direction: row
+
+.form-column
+  margin-right: 25px
+
+.form-login
+  width: 350px
+  margin: 8% auto 0
+  li
+    margin-left: 25px
+    line-height: 25px
+  h2
+    margin-bottom: 30px
+    font-size: 1.5em
+    font-weight: bold
+
+.reset-password
+  margin-top: 20px
+  a
+    font-size: 0.8em
+    color: #999