Merge pull request #29 from substance/form-styles

Form styles
substance · Dec 19, 2019 · 776282d · 776282d
2 parents d561817 + edf14ac
commit 776282d
Show file tree

Hide file tree

Showing 6 changed files with 12 additions and 7 deletions.
diff --git a/styles/_form-row.scss b/styles/_form-row.scss
@@ -5,7 +5,7 @@
 
 .sc-form-row > .se-description > .se-label {
   float: left;
-  @include ts-interface;
+  @include ts-small-interface;
 }
 
 .sc-form-row > .se-description > .se-error {

diff --git a/styles/_modal.scss b/styles/_modal.scss
@@ -65,7 +65,7 @@
 }
 
 .sc-modal > .se-modal-body > .sc-form > * {
-  margin: var(--half-spacing) 0;
+  margin: var(--default-spacing) 0;
 }
 
 .sc-modal .sc-section > .se-section-label {

diff --git a/styles/_smart-figure-editor.scss b/styles/_smart-figure-editor.scss
@@ -20,6 +20,8 @@
 }
 
 .sc-smart-figure-editor .sc-surface {
+  padding: var(--input-padding);
+  margin: var(--negative-input-padding);
   cursor: text;
 }
 

diff --git a/styles/_smart-figure.scss b/styles/_smart-figure.scss
@@ -1,5 +1,6 @@
 .sc-smart-figure {
   @include ts-content;
+  margin-top: var(--double-spacing);
   padding-bottom: 200px;
 }
 

diff --git a/styles/_text-styles.scss b/styles/_text-styles.scss
@@ -11,39 +11,39 @@
 @mixin ts-heading-2 {
   font-family: var(--heading-font);
   color: var(--dark-text-color);
-  font-weight: 600;
+  font-weight: 500;
   font-size: 28px;
   line-height: 35px;
 }
 
 @mixin ts-heading-3 {
   font-family: var(--heading-font);
   color: var(--dark-text-color);
-  font-weight: 600;
+  font-weight: 500;
   font-size: 24px;
   line-height: 30px;
 }
 
 @mixin ts-heading-4 {
   font-family: var(--heading-font);
   color: var(--dark-text-color);
-  font-weight: 600;
+  font-weight: 500;
   font-size: 22px;
   line-height: 28px;
 }
 
 @mixin ts-heading-5 {
   font-family: var(--heading-font);
   color: var(--dark-text-color);
-  font-weight: 600;
+  font-weight: 500;
   font-size: 20px;
   line-height: 26px;
 }
 
 @mixin ts-heading-6 {
   font-family: var(--heading-font);
   color: var(--dark-text-color);
-  font-weight: 600;
+  font-weight: 500;
   font-size: 18px;
   line-height: 24px;
 }

diff --git a/styles/_variables.scss b/styles/_variables.scss
@@ -36,6 +36,8 @@
   --large-button-height: 48px;
   --default-button-height: 36px;
   --small-button-height: 26px;
+  --input-padding: 2px 4px;
+  --negative-input-padding: -2px -4px;
 
   /* Misc */
   --action-button-border-radius: 13px;