Skip to content

Commit 99dc1cc

Browse files
hikalkanhikalkan
committed
Added language switch.
1 parent 4ac50f1 commit 99dc1cc

File tree

11 files changed

+381
-89
lines changed

11 files changed

+381
-89
lines changed

‎angular/.angular-cli.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,8 @@
6161
"../node_modules/abp-web-resources/Abp/Framework/scripts/libs/abp.spin.js",
6262
"../node_modules/abp-web-resources/Abp/Framework/scripts/libs/abp.sweet-alert.js",
6363
"../node_modules/abp-web-resources/Abp/Framework/scripts/libs/abp.moment.js",
64-
"../src/bsb-theme/js/admin.js"
64+
"../src/bsb-theme/js/admin.js",
65+
"../src/bsb-theme/js/demo.js"
6566
],
6667
"environmentSource": "environments/environment.ts",
6768
"environments": {

‎angular/src/app/app.component.html

Lines changed: 240 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,242 @@
1-
<topbar></topbar>
1+
<!-- Overlay For Sidebars -->
2+
<div class="overlay"></div>
3+
<!-- #END# Overlay For Sidebars -->
4+
<!-- Search Bar -->
5+
<div class="search-bar">
6+
<div class="search-icon">
7+
<i class="material-icons">search</i>
8+
</div>
9+
<input type="text" placeholder="START TYPING...">
10+
<div class="close-search">
11+
<i class="material-icons">close</i>
12+
</div>
13+
</div>
14+
<!-- #END# Search Bar -->
15+
<!-- Top Bar -->
16+
<nav class="navbar">
17+
<div class="container-fluid">
18+
<div class="navbar-header">
19+
<a href="javascript:void(0);" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false"></a>
20+
<a href="javascript:void(0);" class="bars"></a>
21+
<a class="navbar-brand" asp-controller="Home" asp-action="Index"><i class="fa fa-cubes"></i> AbpProjectName</a>
22+
</div>
23+
<div class="collapse navbar-collapse" id="navbar-collapse">
24+
<ul class="nav navbar-nav navbar-right">
25+
<li><a href="javascript:void(0);" class="js-search" data-close="true"><i class="material-icons">search</i></a></li>
26+
<topbar-languageswitch></topbar-languageswitch>
27+
<li class="pull-right"><a href="javascript:void(0);" class="js-right-sidebar" data-close="true"><i class="material-icons">more_vert</i></a></li>
28+
</ul>
29+
</div>
30+
</div>
31+
</nav>
32+
<!-- #Top Bar -->
233

3-
<div class="container">
34+
35+
<section>
36+
<!-- Left Sidebar -->
37+
<aside id="leftsidebar" class="sidebar">
38+
<!-- User Info -->
39+
<div class="user-info">
40+
<div class="image">
41+
<img src="/assets/images/user.png" width="48" height="48" alt="User" />
42+
</div>
43+
<div class="info-container">
44+
<div class="name" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">John Doe</div>
45+
<div class="email">[email protected]</div>
46+
<div class="btn-group user-helper-dropdown">
47+
<i class="material-icons" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">keyboard_arrow_down</i>
48+
<ul class="dropdown-menu pull-right">
49+
<li><a href="javascript:void(0);"><i class="material-icons">person</i>Profile</a></li>
50+
<li role="seperator" class="divider"></li>
51+
<li><a href="javascript:void(0);"><i class="material-icons">group</i>Followers</a></li>
52+
<li><a href="javascript:void(0);"><i class="material-icons">shopping_cart</i>Sales</a></li>
53+
<li><a href="javascript:void(0);"><i class="material-icons">favorite</i>Likes</a></li>
54+
<li role="seperator" class="divider"></li>
55+
<li><a href="javascript:void(0);"><i class="material-icons">input</i>Sign Out</a></li>
56+
</ul>
57+
</div>
58+
</div>
59+
</div>
60+
<!-- #User Info -->
61+
<!-- Menu -->
62+
<div class="menu">
63+
<ul class="list">
64+
<li class="header">MAIN NAVIGATION</li>
65+
<li>
66+
<a href="../../index.html">
67+
<i class="material-icons">home</i>
68+
<span>Home</span>
69+
</a>
70+
</li>
71+
<li>
72+
<a href="../../pages/typography.html">
73+
<i class="material-icons">text_fields</i>
74+
<span>Typography</span>
75+
</a>
76+
</li>
77+
</ul>
78+
</div>
79+
<!-- #Menu -->
80+
<!-- Footer -->
81+
<div class="legal">
82+
<div class="copyright">
83+
&copy; 2016 <a href="javascript:void(0);">AdminBSB - Material Design</a>.
84+
</div>
85+
<div class="version">
86+
<b>Version: </b> 1.0.4
87+
</div>
88+
</div>
89+
<!-- #Footer -->
90+
</aside>
91+
<!-- #END# Left Sidebar -->
92+
<!-- Right Sidebar -->
93+
<aside id="rightsidebar" class="right-sidebar">
94+
<ul class="nav nav-tabs tab-nav-right" role="tablist">
95+
<li role="presentation" class="active"><a href="#skins" data-toggle="tab">SKINS</a></li>
96+
<li role="presentation"><a href="#settings" data-toggle="tab">SETTINGS</a></li>
97+
</ul>
98+
<div class="tab-content">
99+
<div role="tabpanel" class="tab-pane fade in active in active" id="skins">
100+
<ul class="demo-choose-skin">
101+
<li data-theme="red" class="active">
102+
<div class="red"></div>
103+
<span>Red</span>
104+
</li>
105+
<li data-theme="pink">
106+
<div class="pink"></div>
107+
<span>Pink</span>
108+
</li>
109+
<li data-theme="purple">
110+
<div class="purple"></div>
111+
<span>Purple</span>
112+
</li>
113+
<li data-theme="deep-purple">
114+
<div class="deep-purple"></div>
115+
<span>Deep Purple</span>
116+
</li>
117+
<li data-theme="indigo">
118+
<div class="indigo"></div>
119+
<span>Indigo</span>
120+
</li>
121+
<li data-theme="blue">
122+
<div class="blue"></div>
123+
<span>Blue</span>
124+
</li>
125+
<li data-theme="light-blue">
126+
<div class="light-blue"></div>
127+
<span>Light Blue</span>
128+
</li>
129+
<li data-theme="cyan">
130+
<div class="cyan"></div>
131+
<span>Cyan</span>
132+
</li>
133+
<li data-theme="teal">
134+
<div class="teal"></div>
135+
<span>Teal</span>
136+
</li>
137+
<li data-theme="green">
138+
<div class="green"></div>
139+
<span>Green</span>
140+
</li>
141+
<li data-theme="light-green">
142+
<div class="light-green"></div>
143+
<span>Light Green</span>
144+
</li>
145+
<li data-theme="lime">
146+
<div class="lime"></div>
147+
<span>Lime</span>
148+
</li>
149+
<li data-theme="yellow">
150+
<div class="yellow"></div>
151+
<span>Yellow</span>
152+
</li>
153+
<li data-theme="amber">
154+
<div class="amber"></div>
155+
<span>Amber</span>
156+
</li>
157+
<li data-theme="orange">
158+
<div class="orange"></div>
159+
<span>Orange</span>
160+
</li>
161+
<li data-theme="deep-orange">
162+
<div class="deep-orange"></div>
163+
<span>Deep Orange</span>
164+
</li>
165+
<li data-theme="brown">
166+
<div class="brown"></div>
167+
<span>Brown</span>
168+
</li>
169+
<li data-theme="grey">
170+
<div class="grey"></div>
171+
<span>Grey</span>
172+
</li>
173+
<li data-theme="blue-grey">
174+
<div class="blue-grey"></div>
175+
<span>Blue Grey</span>
176+
</li>
177+
<li data-theme="black">
178+
<div class="black"></div>
179+
<span>Black</span>
180+
</li>
181+
</ul>
182+
</div>
183+
<div role="tabpanel" class="tab-pane fade" id="settings">
184+
<div class="demo-settings">
185+
<p>GENERAL SETTINGS</p>
186+
<ul class="setting-list">
187+
<li>
188+
<span>Report Panel Usage</span>
189+
<div class="switch">
190+
<label><input type="checkbox" checked><span class="lever"></span></label>
191+
</div>
192+
</li>
193+
<li>
194+
<span>Email Redirect</span>
195+
<div class="switch">
196+
<label><input type="checkbox"><span class="lever"></span></label>
197+
</div>
198+
</li>
199+
</ul>
200+
<p>SYSTEM SETTINGS</p>
201+
<ul class="setting-list">
202+
<li>
203+
<span>Notifications</span>
204+
<div class="switch">
205+
<label><input type="checkbox" checked><span class="lever"></span></label>
206+
</div>
207+
</li>
208+
<li>
209+
<span>Auto Updates</span>
210+
<div class="switch">
211+
<label><input type="checkbox" checked><span class="lever"></span></label>
212+
</div>
213+
</li>
214+
</ul>
215+
<p>ACCOUNT SETTINGS</p>
216+
<ul class="setting-list">
217+
<li>
218+
<span>Offline</span>
219+
<div class="switch">
220+
<label><input type="checkbox"><span class="lever"></span></label>
221+
</div>
222+
</li>
223+
<li>
224+
<span>Location Permission</span>
225+
<div class="switch">
226+
<label><input type="checkbox" checked><span class="lever"></span></label>
227+
</div>
228+
</li>
229+
</ul>
230+
</div>
231+
</div>
232+
</div>
233+
</aside>
234+
<!-- #END# Right Sidebar -->
235+
</section>
236+
237+
238+
<section class="content">
239+
<div class="container-fluid">
4240
<router-outlet></router-outlet>
5-
</div>
241+
</div>
242+
</section>

‎angular/src/app/app.component.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@ export class AppComponent extends AppComponentBase implements OnInit, AfterViewI
3939
}
4040

4141
ngAfterViewInit(): void {
42-
42+
($ as any).AdminBSB.activateAll();
43+
($ as any).AdminBSB.activateDemo();
4344
}
4445
}

‎angular/src/app/app.module.ts

Lines changed: 25 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -22,30 +22,32 @@ import { UsersComponent } from '@app/users/users.component';
2222
import { CreateUserModalComponent } from '@app/users/create-user-modal.component';
2323
import { TenantsComponent } from '@app/tenants/tenants.component';
2424
import { CreateTenantModalComponent } from '@app/tenants/create-tenant-modal.component';
25+
import { TopBarLanguageSwitchComponent } from 'app/layout/topbar-languageswitch.component';
2526

2627
@NgModule({
27-
declarations: [
28-
AppComponent,
29-
HomeComponent,
30-
AboutComponent,
31-
UsersComponent,
32-
CreateUserModalComponent,
33-
TenantsComponent,
34-
CreateTenantModalComponent
35-
],
36-
imports: [
37-
CommonModule,
38-
FormsModule,
39-
HttpModule,
40-
JsonpModule,
41-
ModalModule.forRoot(),
42-
AbpModule,
43-
AppRoutingModule,
44-
ServiceProxyModule,
45-
SharedModule
46-
],
47-
providers: [
48-
49-
]
28+
declarations: [
29+
AppComponent,
30+
HomeComponent,
31+
AboutComponent,
32+
UsersComponent,
33+
CreateUserModalComponent,
34+
TenantsComponent,
35+
CreateTenantModalComponent,
36+
TopBarLanguageSwitchComponent
37+
],
38+
imports: [
39+
CommonModule,
40+
FormsModule,
41+
HttpModule,
42+
JsonpModule,
43+
ModalModule.forRoot(),
44+
AbpModule,
45+
AppRoutingModule,
46+
ServiceProxyModule,
47+
SharedModule
48+
],
49+
providers: [
50+
51+
]
5052
})
5153
export class AppModule { }

‎angular/src/app/home/home.component.html

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,5 @@
11
<div [@routerTransition]>
2-
<h1>{{l('WellcomeMessage')}}</h1>
3-
<div class="row">
4-
<div class="col-md-12">
5-
<i class="material-icons">people</i>
6-
</div>
2+
<div class="block-header">
3+
<h2>{{l('WellcomeMessage')}}</h2>
74
</div>
85
</div>

‎angular/src/app/layout/topbar-languageswitch.component.html

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<li class="dropdown">
2+
<a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown" role="button">
3+
<i class="{{currentLanguage.icon}}" title="{{currentLanguage.displayName}}"></i>
4+
{{currentLanguage.displayName}}
5+
<b class="caret"></b>
6+
</a>
7+
<ul class="dropdown-menu pull-right">
8+
<li *ngFor="let language of languages">
9+
<a *ngIf="language.name != currentLanguage.name" href="#" (click)="changeLanguage(language.name)"><i class="{{language.icon}}"></i> {{language.displayName}}</a>
10+
</li>
11+
</ul>
12+
</li>

0 commit comments

Comments
 (0)