From 3198f305154d0be8687551b472e490ece3944bba Mon Sep 17 00:00:00 2001
From: Ana Gelez <ana@gelez.xyz>
Date: Fri, 2 Aug 2019 15:36:54 +0200
Subject: [PATCH] Editor: Make it clearer that editable areas are editable

- Add a border on the left when hovering
- Make full sentences to explain where you can write
---
 plume-front/src/editor.rs | 10 ++++++++--
 static/css/_article.scss  | 13 ++++++++++++-
 2 files changed, 20 insertions(+), 3 deletions(-)

diff --git a/plume-front/src/editor.rs b/plume-front/src/editor.rs
index 36095a26..38b03322 100644
--- a/plume-front/src/editor.rs
+++ b/plume-front/src/editor.rs
@@ -142,11 +142,17 @@ fn init_editor() -> Result<(), EditorError> {
         let subtitle_val = get_elt_value("subtitle");
         let content_val = get_elt_value("editor-content");
         // And pre-fill the new editor with this values
-        let title = init_widget(&ed, "h1", i18n!(CATALOG, "Title"), title_val, true)?;
+        let title = init_widget(
+            &ed,
+            "h1",
+            i18n!(CATALOG, "Enter your title"),
+            title_val,
+            true,
+        )?;
         let subtitle = init_widget(
             &ed,
             "h2",
-            i18n!(CATALOG, "Subtitle, or summary"),
+            i18n!(CATALOG, "Enter a subtitle, or a summary"),
             subtitle_val,
             true,
         )?;
diff --git a/static/css/_article.scss b/static/css/_article.scss
index a3843d4f..b40fb66b 100644
--- a/static/css/_article.scss
+++ b/static/css/_article.scss
@@ -389,7 +389,18 @@ main .article-meta {
 
   article {
     max-width: none;
-    min-height: 80vh;
+    min-height: 2em;
+  }
+
+  & > *[contenteditable] {
+    margin-left: -20px;
+    padding-left: 18px;
+    border-left: 2px solid transparent;
+    transition: border-left-color 0.1s ease-in;
+
+    &:hover {
+      border-left-color: transparentize($black, 0.6);
+    }
   }
 }