Juan Carlos Picado Herrera avatar Juan Carlos Picado Herrera committed 05e8799

Fixed css issues on login interface

Comments (0)

Files changed (5)

encuestame-war/src/main/webapp/WEB-INF/jsp/includes/mobile/css.jsp

 <link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/resources/css/default.css" />" />
 <link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/resources/css/public.css" />" />
 <link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/resources/css/mobile/default.css" />" />
-<link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/resources/css/login.css" />" />
 <link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/resources/js/dijit/themes/claro/claro.css"/>" />
 <link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/resources/js/dojox/form/resources/Rating.css"/>" />
 <link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/resources/js/dojo/resources/dojo.css" />" />

encuestame-war/src/main/webapp/WEB-INF/views/user/web/signin.jsp

 <%@ taglib uri="http://www.springframework.org/tags" prefix="s" %>
 <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
 <%@ include file="/WEB-INF/jsp/includes/taglibs.jsp" %>
- <div id="loginWrapper">
-       <div class="formWrapper">
-           <c:if test="${not empty message}">
-                <div class="${message.infoType.css}">${message.message}</div>
-           </c:if>
-           <c:if test="${signinError}">
-              <div class="error">
-              Your sign in information was incorrect.<br/>
-              Please try again or <a href="<c:url value="/user/signup" />">sign up</a> free.
+ <div id="web-login-wrapper" class="enme-auto-center">
+   <div class="web-form-wrapper" >
+       <c:if test="${not empty message}">
+            <div class="${message.infoType.css}">${message.message}</div>
+       </c:if>
+       <c:if test="${signinError}">
+          <div class="error">
+          Your sign in information was incorrect.<br/>
+          Please try again or <a href="<c:url value="/user/signup" />">sign up</a> free.
+          </div>
+      </c:if>
+      <div class="loginTitle defaultSectionTitle">Log in</div>
+       <form class="form" name="loginForm" id="loginForm"
+             action="<%=request.getContextPath()%>/user/signin/authenticate"
+             method="post">
+              <div class="field">
+              <div class="label">Username</div>
+              <div class="output">
+                 <input type="text" name="j_username" id="j_username"/></div>
               </div>
-          </c:if>
-           <form class="form" name="loginForm" id="loginForm" action="<%=request.getContextPath()%>/user/signin/authenticate"
-                 method="post">
-                  <div class="field">
-                  <div class="label">Username</div>
+              <div class="field">
+              <div class="label">Password</div>
+              <div class="output">
+                <span><input type="password" name="j_password" id="j_password" /></span>
+                <span><a href="<%=request.getContextPath()%>/user/forgot">Forgot?</a></span>
+              </div>
+              </div>
+              <div class="field">
+                 <div class="label"></div>
                   <div class="output">
-                     <input type="text" name="j_username" id="j_username"/></div>
+                      <input id="remember"  type="checkbox" name="_rememberMeServices" />
+                      <span>Keep me logged in</span>
                   </div>
-                  <div class="field">
-                  <div class="label">Password</div>
-                  <div class="output">
-                    <span><input type="password" name="j_password" id="j_password" /></span>
-                    <span><a href="<%=request.getContextPath()%>/user/forgot">Forgot?</a></span>
+               </div>
+                <div class="signIn">
+                    <input class="btn grey defaultButton" type="submit" value="Sign In" />
+                </div>
+        </form>
+        <div class="singup">
+           <span >
+                New User? <a href="<%=request.getContextPath()%>/user/signup"><span>Sign Up</span></a> for free
+           </span>
+        </div>
+         <c:if test="${social}">
+              <div class="web-social-signin">
+                  <div class="title">Select one of these thrid-party accouns to sign in</div>
+                  <div class="section">
+                      <form action="<%=request.getContextPath()%>/signin/google" method="POST">
+                          <button type="submit">
+                              <img src="<%=request.getContextPath()%>/resources/images/social/google/enme_google_conn.png" />
+                          </button>
+                      </form>
                   </div>
+                  <div class="section">
+                      <form action="<%=request.getContextPath()%>/signin/facebook" method="POST">
+                          <button type="submit">
+                              <img src="<%=request.getContextPath()%>/resources/images/social/facebook/enme_connect.gif" />
+                          </button>
+                      </form>
                   </div>
-                  <div class="field">
-                     <div class="label"></div>
-                      <div class="output">
-                          <input id="remember"  type="checkbox" name="_rememberMeServices" />
-                          <span>Keep me logged in</span>
-                      </div>
-                   </div>
-                    <div class="signIn">
-                        <input class="btn grey" type="submit" value="Sign In" />
-                        <span style="margin-left: 5px;">
-                            <a  href="<%=request.getContextPath()%>/user/signup"><span>You need account?</span></a>
-                        </span>
-                    </div>
-            </form>
-      </div>
+                </div>
+          </c:if>
     </div>
-     <c:if test="${social}">
-      <div class="socialConnect">
-          <div class="title">Do you already have an account on one of these sites?</div>
-<%--           <div class="twitter">
-              <form action="<%=request.getContextPath()%>/signin/twitter" method="POST">
-                  <button type="submit">
-                      <img src="<%=request.getContextPath()%>/resources/images/social/twitter/enme_signin_connect.png" />
-                  </button>
-              </form>
-          </div> --%>
-          <div class="twitter">
-              <form action="<%=request.getContextPath()%>/signin/google" method="POST">
-                  <button type="submit">
-                      <img src="<%=request.getContextPath()%>/resources/images/social/google/enme_google_conn.png" />
-                  </button>
-              </form>
-          </div>
-          <div class="twitter">
-              <form action="<%=request.getContextPath()%>/signin/facebook" method="POST">
-                  <button type="submit">
-                      <img src="<%=request.getContextPath()%>/resources/images/social/facebook/enme_connect.gif" />
-                  </button>
-              </form>
-          </div>
-         <%--  <div class="twitter">
-              <form action="<%=request.getContextPath()%>/signin/identica" method="POST">
-                  <button type="submit">
-                      <img src="<%=request.getContextPath()%>/resources/images/social/identica/enme_identica.png" />
-                  </button>
-              </form>
-          </div>
-          <div class="twitter">
-              <form action="<%=request.getContextPath()%>/signin/linkedin" method="POST">
-                  <button type="submit">
-                      <img src="<%=request.getContextPath()%>/resources/images/social/linkedin/enme_linkedin_connect.png" />
-                  </button>
-              </form>
-          </div>
-          <div class="twitter">
-              <form action="<%=request.getContextPath()%>/signin/yahoo" method="POST">
-                  <button type="submit">
-                      <img src="<%=request.getContextPath()%>/resources/images/social/yahoo/enme_yahoo_connect.png" />
-                  </button>
-              </form>
-          </div> --%>
-        </div>
-      </c:if>
+</div>

encuestame-war/src/main/webapp/resource/css/default.css

 
 a{
    text-decoration: none;
+   color: #3E6D8E;
 }
 
 a:hover{
    text-decoration: underline;
+   color: #3E6D8E;
 }
 
 img {
     background-image: url(../images/icons/emne_poll.png);
 }
 
+
+div.defaultSectionTitle{
+     font-size: 140%;
+    font-weight: bold;
+    margin-bottom: 4px;
+    margin-bottom: 5px;
+    background-color: #3E6D8E;
+    color: #FFF;
+    padding: 5px;
+
+}
+
 /** content container **/
 
 #content-container #enme-content div.publicMarginWrapper{

encuestame-war/src/main/webapp/resource/css/login.css

-#loginWrapper{
-    margin: 5em 20em;
-    float: left
-    text-align: left;
-    z-index: 1;
-}
-
-#loginWrapper .form{
-}
-
-#loginWrapper div.signIn{
-    margin: auto 8em ;
-    padding: 3px;
-    text-align: right;
-    width: 190px;
-}
-
-#loginWrapper div.field{
-    padding: 10px;
-}
-
-#loginWrapper div.forgotPassword{
-    font-size: 10px;
-    float: left;
-    margin-left: 100px;
-}
-
-#loginWrapper div.forgotPassword a{
-    color: #000;
-    text-decoration: none;
-}
-
-#loginWrapper div.forgotPassword a:hover{
-    color: #000;
-    text-decoration: underline;
-}
-
-
-#loginWrapper div.field div.label{
-    float: left;
-    color: #564F4F;
-    padding-top: 6px;
-    width: 90px;
-    font-size: 130%;
-}
-
-#loginWrapper div.field div.output input[type="text"]{
-    height: 20px;
-    width: 275px;
-    font-size: 16px;
-    font-weight: normal;
-    border-radius: 3px 3px 3px 3px;
-    -webkit-border-radius: 3px 3px 3px 3px;
-    -moz-border-radius: 3px 3px 3px 3px;
-    padding: 4px 2px;
-    border: 1px solid #AAAAAA;
-}
-
-#loginWrapper div.field div.output label{
-    margin-left: 90px;
-}
-
-#loginWrapper div.field div.output input[type="password"]{
-    height: 20px;
-    width: 275px;
-    font-size: 16px;
-    font-weight: normal;
-    border-radius: 3px 3px 3px 3px;
-    -webkit-border-radius: 3px 3px 3px 3px;
-    -moz-border-radius: 3px 3px 3px 3px;
-    padding: 4px 2px;
-    border: 1px solid #AAAAAA;
-}
-
-#loginWrapper div.field div.output span a{
-    font-size: 10px;
-    text-decoration: none;
-    padding-left: 5px;
-}
-
-#loginWrapper div.buttonGroup{
-    margin-left: 95px;
-    margin-top: 25px;
-}
-
-#loginWrapper div.formWrapper{
-    float: left;
-    min-width: 520px;
-}
-
-div.socialConnect{
-    margin-left: 47%;
-    max-width: 400px;
-    min-width: 350px;
-    padding: 10px;
-    -moz-border-radius: 15px;
-    border-radius: 15px;
-    background-color: #E7E7E7;
-    border: 1px solid #8BA0BC;
-}
-div.socialConnect .title{
-    font-size: 120%;
-    font-weight: bold;
-    color: #626366;
-    padding-bottom: 10px;
-}
-
-div.socialConnect .twitter{
-    padding: 4px;
-}
-
-div.socialConnect .facebook{
-    padding: 4px;
-}
-
-div.formWrapper div.options{
-    padding: 5px 5px 5px 100px;
-    font-size: 10px;
-    width: 300px;
-}
-
-div.formWrapper div.options a{
-    text-decoration: none;
-}
-
-div.formWrapper div.options a:hover{
-    color: #275296;
-}
-
-div.formWrapper div.options div.createAccount{
-
-}
-
-div.formWrapper div.options div.forgotPassword{
-
-}
-
-div.formWrapper a.button {
-    background: transparent url('../images/bg_button_a.gif') no-repeat scroll top right;
-    color: #444;
-    display: block;
-    float: left;
-    font: normal 12px arial, sans-serif;
-    height: 24px;
-    margin-right: 6px;
-    padding-right: 18px; /* sliding doors padding */
-    text-decoration: none;
-}
-
-div.formWrapper a.button span {
-    background: transparent url('../images/bg_button_span.gif') no-repeat;
-    display: block;
-    line-height: 14px;
-    padding: 5px 0 5px 18px;
-}
-
-div.formWrapper a.button:active {
-    background-position: bottom right;
-    color: #000;
-    outline: none; /* hide dotted outline in Firefox */
-}
-
-div.formWrapper a.button:active span {
-    background-position: bottom left;
-    padding: 6px 0 4px 18px; /* push text down 1px */
-}
-
-.shiny_box {
-    background: #0066FF;
-    color: #FFF;
-    width: 210px;
-    overflow: hidden;
-}
-.shiny_box p {
-    margin:10px;
-}
-
-.shiny_box .tl {
-    background-position: -340px 0px;
-}
-.shiny_box .tr {
-    background-position: -350px 0px;
-}
-.shiny_box .bl {
-    background-position: -340px 10px;
-}
-.shiny_box .br {
-    background-position: -350px 10px;
-}
-
-.shiny_box_body {
-    clear: both;
-    padding: 0 10px;
-    overflow: hidden;
-}
-* html .shiny_box_body {
-    height: 1%;
-}

encuestame-war/src/main/webapp/resource/css/public.css

-@import url("login.css");
-
 body.public-body{
     margin: 0;
     padding: 0;
   font-size: 20px;
   font-weight: bold;
   padding: 2px;
-}
+}
+
+
+/*** login **/
+
+#web-login-wrapper {
+  margin: 5em auto;
+  width: 45em;
+  z-index: 1;
+}
+
+#web-login-wrapper div.loginTitle{
+    padding-left: 10px;
+}
+
+#web-login-wrapper div.signIn {
+  margin: 0 auto;
+  padding: 3px;
+  width: 11em;
+}
+
+#web-login-wrapper div.field{
+    padding: 10px;
+}
+
+#web-login-wrapper div.forgotPassword{
+    font-size: 10px;
+    float: left;
+    margin-left: 100px;
+}
+
+#web-login-wrapper div.forgotPassword a{
+    color: #000;
+    text-decoration: none;
+}
+
+#web-login-wrapper div.forgotPassword a:hover{
+    color: #000;
+    text-decoration: underline;
+}
+
+
+#web-login-wrapper div.field div.label {
+  color: #000;
+  float: left;
+  font-size: 133%;
+  padding-top: 6px;
+  width: 90px;
+}
+
+#web-login-wrapper  input[type="text"]{
+    height: 20px;
+    width: 275px;
+    font-size: 16px;
+    font-weight: normal;
+    border-radius: 3px 3px 3px 3px;
+    -webkit-border-radius: 3px 3px 3px 3px;
+    -moz-border-radius: 3px 3px 3px 3px;
+    padding: 4px 2px;
+    border: 1px solid #AAAAAA;
+}
+
+#web-login-wrapper div.field div.output label{
+    margin-left: 90px;
+}
+
+#web-login-wrapper  input[type="password"]{
+        height: 20px;
+    width: 275px;
+    font-size: 16px;
+    font-weight: normal;
+    border-radius: 3px 3px 3px 3px;
+    -webkit-border-radius: 3px 3px 3px 3px;
+    -moz-border-radius: 3px 3px 3px 3px;
+    padding: 4px 2px;
+    border: 1px solid #AAAAAA;
+}
+
+#web-login-wrapper div.field div.output span a{
+    font-size: 10px;
+    text-decoration: none;
+    padding-left: 5px;
+}
+
+#web-login-wrapper div.buttonGroup{
+    margin-left: 95px;
+    margin-top: 25px;
+}
+
+#web-login-wrapper div.web-form-wrapper {
+  float: left;
+  min-width: 440px;
+  border-radius: 3px 3px 3px 3px;
+  -webkit-border-radius: 3px 3px 3px 3px;
+  -moz-border-radius: 3px 3px 3px 3px;
+  background-color: #F9F9F9;
+  border: 1px solid #8BA0BC;
+}
+
+#web-login-wrapper div.singup{
+    text-align: center;
+    padding: 10px;
+    font-size: 120%;
+}
+
+#web-login-wrapper div.web-social-signin {
+  border-top: 1px dotted gray;
+  max-width: 400px;
+  min-width: 350px;
+  padding: 10px;
+  margin: 10px;
+}
+
+#web-login-wrapper div.web-social-signin .title {
+  color: #000000;
+  font-size: 100%;
+  font-weight: bold;
+  padding-bottom: 10px;
+}
+
+#web-login-wrapper div.web-social-signin .section{
+    padding: 4px;
+}
+
+
+div.web-form-wrapper a.button {
+    color: #444;
+    display: block;
+    float: left;
+    font: normal 12px arial, sans-serif;
+    height: 24px;
+    margin-right: 6px;
+    padding-right: 18px; /* sliding doors padding */
+    text-decoration: none;
+}
+
+div.web-form-wrapper a.button span {
+    display: block;
+    line-height: 14px;
+    padding: 5px 0 5px 18px;
+}
+
+div.web-form-wrapper a.button:active {
+    background-position: bottom right;
+    color: #000;
+    outline: none; /* hide dotted outline in Firefox */
+}
+
+div.web-form-wrapper a.button:active span {
+    background-position: bottom left;
+    padding: 6px 0 4px 18px; /* push text down 1px */
+}
Tip: Filter by directory path e.g. /media app.js to search for public/media/app.js.
Tip: Use camelCasing e.g. ProjME to search for ProjectModifiedEvent.java.
Tip: Filter by extension type e.g. /repo .js to search for all .js files in the /repo directory.
Tip: Separate your search with spaces e.g. /ssh pom.xml to search for src/ssh/pom.xml.
Tip: Use ↑ and ↓ arrow keys to navigate and return to view the file.
Tip: You can also navigate files with Ctrl+j (next) and Ctrl+k (previous) and view the file with Ctrl+o.
Tip: You can also navigate files with Alt+j (next) and Alt+k (previous) and view the file with Alt+o.