Skip to content
This repository was archived by the owner on Feb 2, 2025. It is now read-only.

Commit 7675603

Browse files
shanmukhatejashanmukhateja
committed
feat: Change demo project theme
- Remove loading GIF
1 parent 1f6e503 commit 7675603

File tree

8 files changed

+40
-38
lines changed

8 files changed

+40
-38
lines changed

‎demo/src/app/app.component.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ ul.side-nav.fixed ul.collapsible-accordion .collapsible-body li a {
3535

3636
.side-nav .logo a {
3737
height: 120px !important;
38-
background-color: #66ceff;
38+
background-color: #2196f3;
3939
color: #fff;
4040
}
4141

‎demo/src/app/app.component.html

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -19,10 +19,10 @@ <h3>
1919
</li>
2020
<li><a class="subheader">Getting Started</a></li>
2121
<li class="bold">
22-
<a routerLink="/getting-started" class="waves-effect waves-teal">Installation</a>
22+
<a routerLink="/getting-started" class="waves-effect waves-blue">Installation</a>
2323
</li>
2424
<li class="bold">
25-
<a routerLink="/basic/with-ajax" class="waves-effect waves-teal">Quickstart</a>
25+
<a routerLink="/basic/with-ajax" class="waves-effect waves-blue">Quickstart</a>
2626
</li>
2727
<li>
2828
<div class="divider"></div>
@@ -32,7 +32,7 @@ <h3>
3232
<li class="no-padding">
3333
<ul class="collapsible collapsible-accordion">
3434
<li class="bold">
35-
<a class="collapsible-header waves-effect waves-teal">Basic Examples</a>
35+
<a class="collapsible-header waves-effect waves-blue">Basic Examples</a>
3636
<div class="collapsible-body">
3737
<ul>
3838
<li>
@@ -57,7 +57,7 @@ <h3>
5757
</div>
5858
</li>
5959
<li class="bold">
60-
<a class="collapsible-header waves-effect waves-teal">Angular</a>
60+
<a class="collapsible-header waves-effect waves-blue">Angular</a>
6161
<div class="collapsible-body">
6262
<ul>
6363
<li>
@@ -76,7 +76,7 @@ <h3>
7676
</div>
7777
</li>
7878
<li class="bold">
79-
<a class="collapsible-header waves-effect waves-teal">Filtering</a>
79+
<a class="collapsible-header waves-effect waves-blue">Filtering</a>
8080
<div class="collapsible-body">
8181
<ul>
8282
<li>
@@ -89,7 +89,7 @@ <h3>
8989
</div>
9090
</li>
9191
<li class="bold">
92-
<a class="collapsible-header waves-effect waves-teal">DT extensions</a>
92+
<a class="collapsible-header waves-effect waves-blue">DT extensions</a>
9393
<div class="collapsible-body">
9494
<ul>
9595
<li>
@@ -113,10 +113,10 @@ <h3>
113113
<li><a class="subheader">Support</a></li>
114114

115115
<li class="bold">
116-
<a routerLink="/faq" class="waves-effect waves-teal">FAQ</a>
116+
<a routerLink="/faq" class="waves-effect waves-blue">FAQ</a>
117117
</li>
118118
<li class="bold">
119-
<a routerLink="/more-help" class="waves-effect waves-teal">Resources</a>
119+
<a routerLink="/more-help" class="waves-effect waves-blue">Resources</a>
120120
</li>
121121
<li>
122122
<div class="divider"></div>
@@ -142,7 +142,7 @@ <h3>
142142
<div class="footer-copyright">
143143
<div class="container">
144144
<p>
145-
<span class="white-text text-darken-2"> Designed and built with &lt;3 by
145+
<span class="white-text text-darken-2"> Designed and built with ❤️ by
146146
<a class="grey-text text-darken-4" href="https://github.com/l-lin"><u>Louis LIN</u></a>, <a
147147
class="grey-text text-darken-4" href="https://github.com/shanmukhateja"><u>Surya Teja K</u></a> and
148148
contributors.

‎demo/src/app/base-demo/base-demo.component.css

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

1111
#toTop {
1212
padding: 7px 14px;
13-
background: #4d8ead;
13+
background: #1565c0;
1414
color: #fff;
1515
position: fixed;
1616
bottom: 65px;

‎demo/src/app/getting-started.component.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,6 @@ <h1 class="header center-on-small-only">Installation</h1>
77
</div>
88
</div>
99
</div>
10-
<div class="container">
10+
<div id="getting-started-wrapper" class="container">
1111
<markdown src="assets/docs/get-started.md"></markdown>
1212
</div>

‎demo/src/app/welcome.component.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ <h1 class="header center-on-small-only">Angular DataTables</h1>
1717
<markdown [src]="installMd"></markdown>
1818

1919
<!-- Features -->
20-
<h5>Features:</h5>
20+
<h5 class="header">Features:</h5>
2121
<div class="section">
2222
<div class="row">
2323
<div class="col s12 m12 l12">

‎demo/src/assets/loading.gif

-194 KB
Binary file not shown.

‎demo/src/index.html

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,9 +13,7 @@
1313

1414
<body>
1515
<app-root>
16-
<div class="loading">
17-
<img src="assets/loading.gif" alt="Loading..." />
18-
</div>
16+
<div class="loading">Loading..</div>
1917
</app-root>
2018
</body>
2119

‎demo/src/styles.css

Lines changed: 26 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -9,18 +9,22 @@ header, main, footer {
99
padding-left: 300px;
1010
}
1111

12+
.waves-effect.waves-blue .waves-ripple {
13+
background-color: #90caf9;
14+
}
15+
1216
@media only screen and (max-width: 992px) {
1317
header, main, footer {
1418
padding-left: 0;
1519
}
1620
}
1721

18-
.top-banner {
22+
.top-banner {
1923
height: 120px !important;
2024
}
2125

2226
.banner {
23-
background-color: #66ceff;
27+
background-color: #2196f3;
2428
}
2529

2630
.banner .header {
@@ -36,7 +40,7 @@ header, main, footer {
3640
}
3741

3842
.header {
39-
color: #66ceff;
43+
color: #2196f3;
4044
}
4145

4246
.caption {
@@ -52,24 +56,33 @@ header, main, footer {
5256
footer.page-footer {
5357
padding-top: 0;
5458
margin-top: 5px;
55-
background-color: #66ceff;
59+
background-color: #2196f3;
5660
}
5761

5862
.footer-copyright {
5963
font-weight: 400 !important;
6064
}
6165

6266
/* Tabs */
67+
68+
.tabs {
69+
overflow: hidden;
70+
}
71+
6372
.tabs .tab a {
6473
color: white;
6574
}
6675

67-
.tabs .tab a:hover, .tabs .tab a.active {
68-
color: #66ceff;
76+
.tabs .tab a:hover {
77+
color: rgba(144, 202, 249, 0.6);
78+
}
79+
80+
.tabs .tab a.active {
81+
color: #90caf9;
6982
}
7083

7184
.tabs .indicator {
72-
background-color: #66ceff;
85+
background-color: #2196f3;
7386
}
7487

7588
.anchor-links {
@@ -80,21 +93,6 @@ footer.page-footer {
8093
margin-bottom: 20px;
8194
}
8295

83-
/* Loading */
84-
85-
.loading {
86-
background-color: #66ceff;
87-
text-align: center;
88-
height: 100%;
89-
}
90-
91-
.loading img {
92-
position: fixed;
93-
top: 50%;
94-
left: 50%;
95-
transform: translate(-50%, -50%);
96-
}
97-
9896
/* Revert DataTables styles, as Materialize override some default styles... */
9997

10098
.dataTables_wrapper label {
@@ -140,3 +138,9 @@ div.code-toolbar > .toolbar button {
140138
padding: 4px !important;
141139
font-size: 15px !important;
142140
}
141+
142+
/* markdown library stuff */
143+
144+
markdown h5 {
145+
color: #2196f3 !important;
146+
}

0 commit comments

Comments
 (0)