Create a seperate CSS file for the login screen

This commit is contained in:
Anton Georgiev 2014-11-28 21:43:52 +00:00
parent e5841a96d5
commit adb16f72a0
3 changed files with 65 additions and 69 deletions

View File

@ -21,8 +21,9 @@ app.get("/*", (req, res, next) ->
file = req.params[0]
console.log "\t :: Express :: file requested : " + file
if file is "public/js/app.js" or file is "config.json"
if file is "public/js/app.js" or file is "public/stylesheets/login.css" or file is "config.json"
#Send the requesting client the file.
res.sendfile __dirname + "/" + file
next
)
)

View File

@ -0,0 +1,61 @@
body {
margin:0;
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: 14px;
line-height: 1.42857143;
}
.login { }
.login-banner {
background:#f2f2f2;
height:325px;
border-bottom: 1px solid rgba(0,0,0,.05);
}
.login-form {
width:25%;
margin:0 auto;
background:#fff;
border:1px solid #ddd;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
top:45%;
padding:40px;
display:block;
position: relative;
-webkit-box-shadow: inset 0 3px 6px rgba(0,0,0,.05);
box-shadow: inset 0 3px 6px rgba(0,0,0,.05);
}
.login-form label {
display: inline-block;
max-width: 100%;
margin-bottom: 5px;
font-weight: 700;
}
.login-form input {
display: block;
width: 100%;
padding: 12px 18px;
font-size: 14px;
line-height: 1.42857143;
background-image: none;
border: 1px solid #c7cdd1;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
margin-bottom: 20px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.success {
color: #FFF;
background: #54A7DB;
border:0 !important;
}
.success:hover {
background: #4695c6;
cursor: pointer;
}

View File

@ -4,73 +4,7 @@
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.4/angular.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script src="../public/js/app.js"></script>
<style>
body {
margin:0;
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: 14px;
line-height: 1.42857143;
}
.login { }
.login-banner {
background:#f2f2f2;
height:325px;
border-bottom: 1px solid rgba(0,0,0,.05);
}
.login-form {
width:25%;
margin:0 auto;
background:#fff;
border:1px solid #ddd;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
top:45%;
padding:40px;
display:block;
position: relative;
-webkit-box-shadow: inset 0 3px 6px rgba(0,0,0,.05);
box-shadow: inset 0 3px 6px rgba(0,0,0,.05);
}
.login-form label {
display: inline-block;
max-width: 100%;
margin-bottom: 5px;
font-weight: 700;
}
.login-form input {
display: block;
width: 100%;
padding: 12px 18px;
font-size: 14px;
line-height: 1.42857143;
background-image: none;
border: 1px solid #c7cdd1;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
margin-bottom: 20px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.success {
color: #FFF;
background: #54A7DB;
border:0 !important;
}
.success:hover {
background: #4695c6;
cursor: pointer;
}
</style>
<link rel="stylesheet" href="../public/stylesheets/login.css"></link>
</head>
<body>