welcome page

frontend/templates/registration/welcome.html

@@ -3,18 +3,25 @@
 
 {% block title %}Welcome to Unglue.It{% endblock %}
 {% block doccontent %}
-<div id="welcomesearch">
-<p>Welcome, {{user.username}}!</p><p id="link-to-next"></p>
+<div class="registration">
+    <div class="registration-content">
+
+        <h1>Welcome, {{user.username}}!</h1>
+        <h2>
             <label>Search and add free-licenced books! </label>
+        </h2>
+        <div id="header-search-bar">
             <form action="{% url 'search' %}" method="get">
-                				    <input type="text" onfocus="imgfocus()" onblur="imgblur(0)" size="25" class="inputbox" name="q" value="{{ q }}">
-                				    <input type="submit" class="greenbutton" value="Search">
+                <input role="search" type="text" placeholder="Search" id="welcomesearch" size="25" onfocus="imgfocus()" onblur="imgblur(15)" class="inputbox" name="q" value="{{ q }}"></input>
+                <i class="fa fa-search"></i>
             </form>
         </div>
         <br />
         <div class="welcomealternatives">
             Or you can <a href="{% url 'edit_user' %}">change your username</a> &#151; <a href="{% url 'work_list' 'popular' %}">see the site's favorite books</a>   &#151; <a href="{% url 'feedback' %}">send us feedback</a> &#151; <a href="{% url 'notification_notice_settings' %}">manage your contact preferences</a>
         </div>
+    </div>
+</div>
 {% endblock %}
 
 

static/scss/registration.scss

@@ -7,14 +7,7 @@
 
     justify-content: center;
 
-    .helptext {
-        font-style: italic;
-
-        &:before {
-            white-space: pre;
-            content: "\A";
-        }
-    }
+    padding: 10px;
 }
 
 .google-signup {
@@ -34,12 +27,12 @@
     line-height:0.1em;
     margin:10px 0 20px;
 }
+
 .linetext-inner {
     background:#fff;
     padding:0 10px;
 }
 
-
 .login_box {
     border: solid 3px $blue-grey;
     @include one-border-radius(5px);
@@ -64,73 +57,13 @@
     }
 }
 
-
 .actionbutton {
     @include actionbuttons;
     float: left;
 }
 
-#welcomesearch {
-    label {
-        display: block;
-        margin: 0 auto;
-        font-size: $font-size-header;
-        padding-bottom: 10px;
-    }
-
-    p {
-        margin-bottom: 5px;
-    }
-
-    form {
-        margin: 0 auto;
-        width:210px;
-        background:url("#{$image-base}landingpage/search-box-two.png") 0 0 no-repeat;
-        height:36px;
-        display:block;
-        overflow:hidden;
-    }
-
-    input {
-        &.inputbox {
-            border:none;
-            color:#66942e;
-            @include height(26px);
-            font-size: $font-size-default;
-            float:left;
-            padding:0;
-            margin:5px 0 5px 20px;
-            width: 149px;
-            outline: none;
-
-            &:focus {
-                border: none;
-            }
-        }
-
-        &.greenbutton[type="submit"] {
-            background:url("#{$image-base}landingpage/search-button-two.png") 0 0 no-repeat;
-            width:40px;
-            height:40px;
-            padding:0;
-            margin:0;
-            border:none;
-            display:block;
-            float: right;
-            text-indent:-10000px;
-			      font-size:0;
-			      @include one-border-radius(0);
-		    }
-	  }
-}
-
 .welcomealternatives {
 	  border-top: 1px solid $blue-grey;
 	  margin-top: 10px;
 	  padding-top: 5px;
 }
-
-label:before {
-    content: "\A";
-    white-space: pre;
-}