Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 3f2ebea

Browse files
author
AbdelrahmanSE
committed
Application Header and Footer
1 parent 1a15b72 commit 3f2ebea

File tree

9 files changed

+80
-21
lines changed

9 files changed

+80
-21
lines changed

‎src/assets/scss/modules/_footer.scss‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
footer {
2+
background-color: #888;
3+
color: #fff;
4+
padding: 20px 0;
5+
}

‎src/assets/scss/style.scss‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
/** Modules **/
2+
@import "modules/footer";

‎src/modules/app/app.view.html‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
1-
Hello World App
2-
3-
<!-- <div ng-view></div> -->
1+
<header-component></header-component>
2+
<divng-view></div>
3+
<footer-component></footer-component>

‎src/modules/common/common.module.js‎

Lines changed: 7 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,18 @@
1-
21
(function() {
32
"use strict";
43

54
angular.module("UsersApp.CommonModule", []);
65

6+
const Header = require("./header-component/header");
7+
const Footer = require("./footer-component/footer");
8+
79
/**
810
* Directives
911
*/
1012
angular
1113
.module("UsersApp.CommonModule")
12-
.directive("headerComponent", function() {
13-
return {
14-
restrict: "E",
15-
scope: {},
16-
template: "<h1>Hello</h1>"
17-
}
18-
});
14+
.directive("headerComponent", Header.Directive);
15+
angular
16+
.module("UsersApp.CommonModule")
17+
.directive("footerComponent", Footer.Directive);
1918
})();
Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<footer>
2+
<div class="container">
3+
<div class="row">
4+
<div class="col-md-12">
5+
AngularJS Application &copy; 2019.
6+
</div>
7+
</div>
8+
</div>
9+
</footer>
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
module.exports.Directive = function() {
2+
return {
3+
restrict: "E",
4+
scope: {},
5+
templateUrl: "/modules/common/footer-component/footer-component.view.html"
6+
};
7+
};
8+

‎src/modules/common/header-component/header-component.directive.js‎

Lines changed: 0 additions & 9 deletions
This file was deleted.
Lines changed: 39 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,39 @@
1-
Hello
1+
<header>
2+
<nav class="navbar navbar-expand-lg navbar-light bg-light">
3+
<div class="container">
4+
<a class="navbar-brand" href="#">Users Details App</a>
5+
<button
6+
class="navbar-toggler"
7+
type="button"
8+
data-toggle="collapse"
9+
data-target="#navbarNavDropdown"
10+
aria-controls="navbarNavDropdown"
11+
aria-expanded="false"
12+
aria-label="Toggle navigation"
13+
>
14+
<span class="navbar-toggler-icon"></span>
15+
</button>
16+
<div class="collapse navbar-collapse" id="navbarNavDropdown">
17+
<ul class="navbar-nav">
18+
<li class="nav-item">
19+
<a class="nav-link" href="#">Home</a>
20+
</li>
21+
<li class="nav-item">
22+
<a class="nav-link" href="#">Users</a>
23+
</li>
24+
</ul>
25+
26+
<ul class="navbar-nav ml-auto">
27+
<li class="nav-item active">
28+
<a
29+
class="nav-link"
30+
href="https://github.com/AbdelrahmanSE/angularjs-users-details"
31+
target="_blank"
32+
>Github Repo</a
33+
>
34+
</li>
35+
</ul>
36+
</div>
37+
</div>
38+
</nav>
39+
</header>
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
module.exports.Directive = function() {
2+
return {
3+
restrict: "E",
4+
scope: {},
5+
templateUrl: "/modules/common/header-component/header-component.view.html"
6+
};
7+
};

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /