Skip to content

Commit 6616a64

Browse files
jbutkojbutko
committed
client: home refactoring
1 parent fc27483 commit 6616a64

File tree

9 files changed

+74
-38
lines changed

9 files changed

+74
-38
lines changed

‎client/src/app/auth/auth.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
<!-- login -->
44
<div class="row" ng-if="!vm.user">
5-
<div class="col-xs-12">
5+
<div class="col-xs-offset-4 col-xs-4">
66
<form
77
ng-submit="vm.login(vm.username, vm.password)"
88
name="login"

‎client/src/app/home/home.html‎

Lines changed: 39 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,44 @@
1-
<div class="container-fluid">
1+
<div class="container-fluid home">
2+
<div class="row">
3+
<div class="col-xs-offset-2 col-xs-8">
4+
<p>Do not waste your valuable time with every new project by configuring app and folder structure - use <strong>ExpressJS, Socket.io &amp; AngularJS Boilerplate</strong> and start working straight on what really matters.</p>
25

3-
<div class="row">
6+
<h3>FEATURES:</h3>
7+
<h4>Server:</h4>
8+
<ul>
9+
<li>* ExpressJS API with JSON web token (JWT) authentification</li>
10+
<li>* Socket.IO for realtime messages implemented both on ExpressJS API as well as AngularJS client</li>
11+
<li>* Mocha test runner to test your ExpressJS app</li>
12+
<li>* Routes for create user, authenticate user, get user, get users, change password and update user</li>
13+
<li>* Tests for user controller</li>
14+
<li>* Built in packages for paginated responses or request parameters checking with express-validator</li>
15+
<li>* Postman collection to test out API endpoints in Postman desktop app</li>
16+
<li>* PM2 process files in JSON format for dev/production enviroments</li>
17+
</ul>
418

5-
<div class="col-md-5 col-md-offset-3 text-center">
6-
<p>Do not waste your valuable time with every new project by configuring app and folder structure - use <strong>ExpressJS, Socket.io &amp; AngularJS Boilerplate</strong> and start working straight on what really matters.</p>
19+
<h4>Client:</h4>
20+
<ul>
21+
<li>* Component oriented AngularJS client app built on version 1.6.x</li>
22+
<li>* SASS preprocessor with bootstrap grid system</li>
23+
<li>* Gulp with browser-sync for serving app including tasks for SASS files compilation, JShint linting or build task for generating minified production version</li>
24+
<li>* UI-Router for seamless AngularJS routing</li>
25+
</ul>
726

27+
<h4>Setup:</h4>
28+
<div>
29+
<strong>Clone: </strong>
30+
<span class="code">git clone git@github.com:jbutko/ExpressJS-Socket.IO-AngularJS-Boilerplate.git</span>
31+
</div>
832

9-
<h3>FEATURES:</h3>
10-
<ul>
11-
<li>* Component oriented AngularJS client app built on version 1.6.x</li>
12-
<li>* ExpressJS API with JSON webtoken authentification</li>
13-
<li>* Socket.io for realtime messages implement on both AngularJS client as well as ExpressJS API</li>
14-
<li>* Mocha test runner to test your ExpressJS app</li>
15-
</ul>
16-
</div>
17-
</div>
33+
<div>
34+
<strong>Server: </strong>
35+
<span class="code">cd server&&npm install&&npm start</span>
36+
</div>
37+
38+
<div>
39+
<strong>Client: </strong>
40+
<span class="code">cd client&&npm install&&gulp</span>
41+
</div>
42+
</div>
43+
</div>
1844
</div>

‎client/src/app/home/home.scss‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
.home {
2+
3+
ul {
4+
margin: 0 0 20px 0;
5+
}
6+
}

‎client/src/app/main-nav/main-nav.html‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
<div class="row">
77
<div class="col-xs-12">
88
<!-- login/logout -->
9-
<div class="auth pull-right">
9+
<div class="auth">
1010
<auth></auth>
1111
</div>
1212
</div>
@@ -18,9 +18,6 @@
1818
<h1 class="logo">
1919
<a ui-sref="home" rel="nofollow">ExpressJS, Socket.io &amp; AngularJS Boilerplate</a>
2020
</h1>
21-
</div>
22-
<div class="col-xs-12">
23-
<!-- logo -->
2421
<h4 class="logo">
2522
Everything you need to start your new realtime MEAN app!
2623
</h4>

‎client/src/app/main-nav/main-nav.scss‎

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,14 @@
11
.main-nav {
2-
background-color: $blue;
2+
background-color: #86C3AF;
33
padding: 20px;
44
width: 100%;
55
text-align: center;
66

7-
a {
8-
color: $black;
7+
li {
8+
display: inline-block;
9+
}
10+
11+
.logo {
12+
margin-bottom: 5px;
913
}
1014
}

‎client/styles/breakpoints/_base.scss‎

Lines changed: 5 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -29,21 +29,14 @@ html {
2929
box-sizing: inherit;
3030
}
3131

32-
a {
33-
34-
&:hover {
35-
cursor: pointer;
36-
}
37-
}
38-
3932
ul {
4033
list-style-type: none;
4134
margin: 0;
4235
padding: 0;
4336
}
4437

4538
li {
46-
display: inline-block;
39+
display: block;
4740
margin-right: 50px;
4841

4942
&:last-child {
@@ -57,13 +50,14 @@ LINK STYLES
5750

5851
a,
5952
a:visited {
60-
color: $link-color;
53+
color: lighten($link-color, 5%);
6154
text-decoration: none;
6255

6356
/* on hover */
64-
&:hover, &:focus {
57+
&:hover,
58+
&:focus {
6559
color: $link-hover;
66-
text-decoration: underline;
60+
cursor: pointer;
6761
}
6862

6963
/* on click */

‎client/styles/partials/_helpers.scss‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -162,3 +162,8 @@ strong {
162162
-ms-transition: all 0.2s ease;
163163
-o-transition: all 0.2s ease;
164164
}
165+
166+
.code {
167+
font-family: Consolas, "Courier new", serif;
168+
font-size: 15px;
169+
}

‎client/styles/partials/_variables.scss‎

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -6,17 +6,15 @@ Variables
66

77
$black: #231f20;
88
$white: #fff;
9-
$blue: #00AFF0;
10-
11-
$light-gray: #f8f9fa;
129
$gray: #eaedf2;
13-
$text-color: #5c6b80;
10+
$disabled-gray: #cfcfcf;
1411

12+
// links
13+
$text-color: #5c6b80;
1514
$link-color: $black;
1615
$link-hover: darken($link-color, 9%);
1716

18-
$border-color: #ccc;
19-
$disabled-gray: #cfcfcf;
17+
// alerts
2018
$alert-red: red;
2119
$alert-green: #645564;
2220
$alert-blue: blue;

‎client/styles/style.scss‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -96,6 +96,12 @@ main nav
9696
@import "../src/app/main-nav/main-nav.scss";
9797

9898

99+
/*********************
100+
home
101+
*********************/
102+
@import "../src/app/home/home.scss";
103+
104+
99105
/*********************
100106
auth
101107
*********************/

0 commit comments

Comments
 (0)