[Glitch] Add OCR tool to media editing modal

Port 28636f43e4 to glitch-soc Signed-off-by: Thibaut Girka <thib@sitedethib.com>
2019-08-15 15:13:26 +02:00
parent 066034c62e
commit 41c7fec796
4 changed files with 118 additions and 18 deletions
--- a/app/javascript/flavours/glitch/styles/components/modal.scss
+++ b/app/javascript/flavours/glitch/styles/components/modal.scss
@@ -565,16 +565,48 @@
    padding: 10px;
    font-family: inherit;
    font-size: 14px;
-    resize: vertical;
+    resize: none;
    border: 0;
    outline: 0;
    border-radius: 4px;
    border: 1px solid $ui-secondary-color;
-    margin-bottom: 20px;
+    min-height: 100px;
+    max-height: 50vh;
+    margin-bottom: 10px;

    &:focus {
      border: 1px solid darken($ui-secondary-color, 8%);
    }
+
+    &__wrapper {
+      background: $white;
+      border: 1px solid $ui-secondary-color;
+      margin-bottom: 10px;
+      border-radius: 4px;
+
+      .setting-text {
+        border: 0;
+        margin-bottom: 0;
+        border-radius: 0;
+
+        &:focus {
+          border: 0;
+        }
+      }
+
+      &__modifiers {
+        color: $inverted-text-color;
+        font-family: inherit;
+        font-size: 14px;
+        background: $white;
+      }
+    }
+
+    &__toolbar {
+      display: flex;
+      justify-content: space-between;
+      margin-bottom: 20px;
+    }
  }

  .setting-text-label {