From 9fa666cba70e4dbd51d6678bffba21df96e38a8e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Kli=C5=9B?= Date: Wed, 1 Jul 2015 10:07:29 +0200 Subject: [PATCH] Added multiline "placeholder" to 3rd step of setup Closes #5459 - added a PNG background with 2 emails addresses as a "placeholder" - added a `required` attribute for textarea in 3rd step of the setup - taking an advantage of `:valid` pseudo-class to hide the background picture with email addresses --- core/client/app/styles/layouts/flow.css | 10 ++++++++++ core/client/app/templates/setup/three.hbs | 2 +- .../public/assets/img/invite-placeholder.png | Bin 0 -> 7860 bytes 3 files changed, 11 insertions(+), 1 deletion(-) create mode 100644 core/client/public/assets/img/invite-placeholder.png diff --git a/core/client/app/styles/layouts/flow.css b/core/client/app/styles/layouts/flow.css index 7dfd7d1ca5..f55eb30dd3 100644 --- a/core/client/app/styles/layouts/flow.css +++ b/core/client/app/styles/layouts/flow.css @@ -384,6 +384,16 @@ line-height: 1.4em; } +.gh-flow-invite textarea { + background: url(img/invite-placeholder.png) 8px 10px no-repeat; + background-size: 202px 48px; + box-shadow: none; /* Remove some default styling for Firefox (required attribute) */ +} + +.gh-flow-invite textarea:valid { + background: none; +} + @media (max-width: 460px) { .gh-flow-content .gh-flow-invite label i { display: none; diff --git a/core/client/app/templates/setup/three.hbs b/core/client/app/templates/setup/three.hbs index 1cf977e60a..49af9a8b0c 100644 --- a/core/client/app/templates/setup/three.hbs +++ b/core/client/app/templates/setup/three.hbs @@ -8,7 +8,7 @@
- {{textarea class="gh-input" name="users" placeholder="john@example.com" value=users}} + {{textarea class="gh-input" name="users" value=users required="required"}}