Skip to content

Commit 0ba8b3c

Browse files
opiepjopiepj
committed
(#27) added bootstrap components.
1 parent 17f0d9b commit 0ba8b3c

File tree

10 files changed

+95
-58
lines changed

10 files changed

+95
-58
lines changed

‎src/app/components/app.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<img src="angularjs-logo_patrick.png" alt="AngularP" height="54" width="54">
55
</a>
66
<span class="logo">{{ name | capitalize }} + Patrick + Webpack</span>
7-
<ul>
7+
<ul class="nav nav-tabs">
88
<li class="l-left">
99
<a [router-link]=" ['/home'] "class="top-nav-button ac-default-theme">Home</a>
1010
</li>

‎src/app/components/dashboard/styles/dashboard.css‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
span[x-large] {
2+
color: red;
3+
}

‎src/app/components/dashboard/styles/structure.css‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
ul {
2+
list-style-type: none;
3+
}

‎src/app/components/dashboard/views/dashboard.html‎

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,9 @@
1-
<style>
2-
span[x-large] {
3-
color: red;
4-
}
5-
</style>
61
<div>
72
<h2>Dashboard</h2>
8-
93
<div class="panel panel-primary">
104
<div class="panel-heading">This is a useless dashboard!</div>
115
<div class="panel-body">
126
<structure></structure>
137
</div>
148
</div>
15-
169
</div>

‎src/app/components/dashboard/views/structure.html‎

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -16,9 +16,3 @@ <h3>TypeScript File Structure</h3>
1616
</div>
1717
</div>
1818
</div>
19-
20-
<style>
21-
ul {
22-
list-style-type: none;
23-
}
24-
</style>

‎src/app/components/example-modules/example-modules.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
<li>
1313
<a class="ac-button md-default-theme"
1414
[router-link]=" ['./tictactoe'] "
15-
(click)="active = 2"
15+
(click)="active = 1"
1616
[class.active]="active === 2">Tic tac toe</a>
1717
</li>
1818
<li>

‎src/app/components/example-modules/memory-module/views/memory.html‎

Lines changed: 20 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,20 @@
1-
<div>Pairs left to match: {{game.unmatchedPairs}}</div>
2-
<div>Matching: {{game.firstPick.title}}</div>
3-
<table>
4-
<tr *ng-for="#row of game.grid" class="row">
5-
<td *ng-for="#tile of row">
6-
<div class="card">
7-
<img class="back" (click)="game.flipTile(tile)" [hidden]="tile.flipped" src="img/memory_game/back.png">
8-
<img class="front" (click)="game.flipTile(tile)" [hidden]="!tile.flipped" src="img/memory_game/{{tile.title}}.png">
9-
</div>
10-
</td>
11-
</tr>
12-
</table>
13-
<div class="message">{{game.message}}</div>
1+
<div style="padding: 0 16px;">
2+
<h2>Memory Game</h2>
3+
<div class="panel panel-default">
4+
<div class="panel-body">
5+
<div>Pairs left to match: {{game.unmatchedPairs}}</div>
6+
<div>Matching: {{game.firstPick.title}}</div>
7+
<table>
8+
<tr *ng-for="#row of game.grid" class="row">
9+
<td *ng-for="#tile of row">
10+
<div class="card">
11+
<img class="back" (click)="game.flipTile(tile)" [hidden]="tile.flipped" src="img/memory_game/back.png">
12+
<img class="front" (click)="game.flipTile(tile)" [hidden]="!tile.flipped" src="img/memory_game/{{tile.title}}.png">
13+
</div>
14+
</td>
15+
</tr>
16+
</table>
17+
<div class="message">{{game.message}}</div>
18+
</div>
19+
</div>
20+
</div>

‎src/app/components/example-modules/search-module/views/search.html‎

Lines changed: 21 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,21 @@
1-
<div style="padding: 0 16px;">
2-
<h2>Search Github repos</h2>
3-
4-
<section>
5-
6-
<input autosuggest (term)="showResults($event)" (loading)="loading = $event" type="text" autofocus>
7-
<img style="width: 20px;position: absolute;" [hidden]="!loading" src="https://www.brown.edu/sites/default/themes/pawtuxet/img/loader-larger.gif">
8-
9-
</section>
10-
11-
<section>
12-
13-
<div *ng-for="#repo of repos" style="padding: 0.5em 0.5em 0.5em 0;">
14-
<a [href]="repo.html_url" target="_blank">
15-
{{ repo.owner.login }}/<b>{{ repo.name }}</b>
16-
</a>
17-
</div>
18-
19-
</section>
20-
</div>
1+
<div style="padding: 0 16px;">
2+
<h2>Search Github repos</h2>
3+
4+
<div class="panel panel-default">
5+
<div class="panel-body">
6+
<form class="navbar-form navbar-left" role="search">
7+
<div class="form-group">
8+
<input autosuggest class="form-control" placeholder="Search" (term)="showResults($event)" (loading)="loading = $event" type="text" autofocus><img style="width: 20px;position: absolute;" [hidden]="!loading" src="https://www.brown.edu/sites/default/themes/pawtuxet/img/loader-larger.gif">
9+
</div>
10+
</form>
11+
</div>
12+
<div class="panel-footer">
13+
<div *ng-for="#repo of repos" style="padding: 0.5em 0.5em 0.5em 0;">
14+
<a [href]="repo.html_url" target="_blank">
15+
{{ repo.owner.login }}/<b>{{ repo.name }}</b>
16+
</a>
17+
</div>
18+
</div>
19+
</div>
20+
21+
</div>

‎src/app/components/example-modules/tictactoe-module/views/tictactoe.html‎

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,13 @@
1-
<div style="padding: 0 16px;">
2-
<h1>Tic Tac Toe</h1>
3-
<h2 *ng-if="game.winner">{{ game.winner }} won!</h2>
4-
<h2 *ng-if="game.draw">draw</h2>
5-
<button (click)="reset()">reset</button>
6-
<board [board]="game.board" (select)="game.play($event)"></board>
7-
</div>
1+
<div style="padding: 0 16px;">
2+
<h2>Tic Tac Toe</h2>
3+
<div class="panel panel-default">
4+
<div class="panel-body">
5+
<div style="padding: 0 16px;">
6+
<h2 *ng-if="game.winner">{{ game.winner }} won!</h2>
7+
<h2 *ng-if="game.draw">draw</h2>
8+
<button (click)="reset()">reset</button>
9+
<board [board]="game.board" (select)="game.play($event)"></board>
10+
</div>
11+
</div>
12+
</div>
13+
</div>

‎src/app/components/home/views/home.html‎

Lines changed: 33 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,33 @@
1-
<div class="home">
2-
<h2>Home</h2>
3-
</div>
1+
<div class="jumbotron">
2+
<div class="container">
3+
<div class="page-header">
4+
<h1>Angular 2.0 App <small>by Patrick Opie and Tom Manion</small></h1>
5+
</div>
6+
<p>This app serves as an example of using angular 2.0 with webpack. All the modules you see are written in TypeScript.
7+
Check out our repo to learn more!</p>
8+
<p><a class="btn btn-primary btn-lg" href="https://github.com/1337programming/angular2.0-App" role="button">Learn more</a></p>
9+
</div>
10+
</div>
11+
12+
<div class="media">
13+
<div class="media-left">
14+
<a href="#">
15+
<img class="media-object" width="64" height="64" src="http://res.cloudinary.com/buddahbelly/image/upload/v1423072364/brilliantbritz/angular-js.png" alt="Angular">
16+
</a>
17+
</div>
18+
<div class="media-left">
19+
<a href="#">
20+
<img class="media-object" width="64" height="64" src="https://reactweek.com/images/webpack.png" alt="Webpack">
21+
</a>
22+
</div>
23+
<div class="media-left">
24+
<a href="#">
25+
<img class="media-object" width="64" height="64" src="http://brunch.io/images/others/gulp.png" alt="Gulp">
26+
</a>
27+
</div>
28+
<div class="media-left">
29+
<a href="#">
30+
<img class="media-object" width="64" height="64" src="https://pbs.twimg.com/profile_images/2660272602/87a5a0fdc86455c3f94b0b0eebfdb1b9_400x400.png" alt="TypeScript">
31+
</a>
32+
</div>
33+
</div>

0 commit comments

Comments
 (0)