Skip to content

Commit b71df6e

Browse files
almasaeed2010almasaeed2010
committed
Added control sidebar to all pages
1 parent 802592a commit b71df6e

30 files changed

Lines changed: 4791 additions & 10 deletions

‎index.html‎

Lines changed: 171 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -280,6 +280,10 @@ <h3>
280280
</li>
281281
</ul>
282282
</li>
283+
<!-- Control Sidebar Toggle Button -->
284+
<li>
285+
<a href="#" data-toggle="control-sidebar"><i class="fa fa-outdent"></i></a>
286+
</li>
283287
</ul>
284288
</div>
285289
</nav>
@@ -892,6 +896,173 @@ <h3 class="box-title">Calendar</h3>
892896
</div>
893897
<strong>Copyright &copy; 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
894898
</footer>
899+
900+
<!-- Control Sidebar -->
901+
<aside class="control-sidebar">
902+
<!-- Create the tabs -->
903+
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
904+
<li class="active"><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></i></a></li>
905+
906+
<li><a href="#control-sidebar-settings-tab" data-toggle="tab"><i class="fa fa-gears"></i></a></li>
907+
</ul>
908+
<!-- Tab panes -->
909+
<div class="tab-content">
910+
<!-- Home tab content -->
911+
<div class="tab-pane active" id="control-sidebar-home-tab">
912+
<h3 class="control-sidebar-heading">Recent Activity</h3>
913+
<ul class='control-sidebar-menu'>
914+
<li>
915+
<a href='javascript::;'>
916+
<i class="menu-icon fa fa-birthday-cake bg-red"></i>
917+
<div class="menu-info">
918+
<h4 class="control-sidebar-subheading">Langdon's Birthday</h4>
919+
<p>Will be 23 on April 24th</p>
920+
</div>
921+
</a>
922+
</li>
923+
<li>
924+
<a href='javascript::;'>
925+
<i class="menu-icon fa fa-user bg-yellow"></i>
926+
<div class="menu-info">
927+
<h4 class="control-sidebar-subheading">Frodo Updated His Profile</h4>
928+
<p>New phone +1(800)555-1234</p>
929+
</div>
930+
</a>
931+
</li>
932+
<li>
933+
<a href='javascript::;'>
934+
<i class="menu-icon fa fa-envelope-o bg-light-blue"></i>
935+
<div class="menu-info">
936+
<h4 class="control-sidebar-subheading">Nora Joined Mailing List</h4>
937+
<p>nora@example.com</p>
938+
</div>
939+
</a>
940+
</li>
941+
<li>
942+
<a href='javascript::;'>
943+
<i class="menu-icon fa fa-file-code-o bg-green"></i>
944+
<div class="menu-info">
945+
<h4 class="control-sidebar-subheading">Cron Job 254 Executed</h4>
946+
<p>Execution time 5 seconds</p>
947+
</div>
948+
</a>
949+
</li>
950+
</ul><!-- /.control-sidebar-menu -->
951+
952+
<h3 class="control-sidebar-heading">Tasks Progress</h3>
953+
<ul class='control-sidebar-menu'>
954+
<li>
955+
<a href='javascript::;'>
956+
<h4 class="control-sidebar-subheading">
957+
Custom Template Design
958+
<span class="label label-danger pull-right">70%</span>
959+
</h4>
960+
<div class="progress progress-xxs">
961+
<div class="progress-bar progress-bar-danger" style="width: 70%"></div>
962+
</div>
963+
</a>
964+
</li>
965+
<li>
966+
<a href='javascript::;'>
967+
<h4 class="control-sidebar-subheading">
968+
Update Resume
969+
<span class="label label-success pull-right">95%</span>
970+
</h4>
971+
<div class="progress progress-xxs">
972+
<div class="progress-bar progress-bar-success" style="width: 95%"></div>
973+
</div>
974+
</a>
975+
</li>
976+
<li>
977+
<a href='javascript::;'>
978+
<h4 class="control-sidebar-subheading">
979+
Laravel Integration
980+
<span class="label label-waring pull-right">50%</span>
981+
</h4>
982+
<div class="progress progress-xxs">
983+
<div class="progress-bar progress-bar-warning" style="width: 50%"></div>
984+
</div>
985+
</a>
986+
</li>
987+
<li>
988+
<a href='javascript::;'>
989+
<h4 class="control-sidebar-subheading">
990+
Back End Framework
991+
<span class="label label-primary pull-right">68%</span>
992+
</h4>
993+
<div class="progress progress-xxs">
994+
<div class="progress-bar progress-bar-primary" style="width: 68%"></div>
995+
</div>
996+
</a>
997+
</li>
998+
</ul><!-- /.control-sidebar-menu -->
999+
1000+
</div><!-- /.tab-pane -->
1001+
<!-- Stats tab content -->
1002+
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
1003+
<!-- Settings tab content -->
1004+
<div class="tab-pane" id="control-sidebar-settings-tab">
1005+
<form method="post">
1006+
<h3 class="control-sidebar-heading">General Settings</h3>
1007+
<div class="form-group">
1008+
<label class="control-sidebar-subheading">
1009+
Report panel usage
1010+
<input type="checkbox" class="pull-right" checked />
1011+
</label>
1012+
<p>
1013+
Some information about this general settings option
1014+
</p>
1015+
</div><!-- /.form-group -->
1016+
1017+
<div class="form-group">
1018+
<label class="control-sidebar-subheading">
1019+
Allow mail redirect
1020+
<input type="checkbox" class="pull-right" checked />
1021+
</label>
1022+
<p>
1023+
Other sets of options are available
1024+
</p>
1025+
</div><!-- /.form-group -->
1026+
1027+
<div class="form-group">
1028+
<label class="control-sidebar-subheading">
1029+
Expose author name in posts
1030+
<input type="checkbox" class="pull-right" checked />
1031+
</label>
1032+
<p>
1033+
Allow the user to show his name in blog posts
1034+
</p>
1035+
</div><!-- /.form-group -->
1036+
1037+
<h3 class="control-sidebar-heading">Chat Settings</h3>
1038+
1039+
<div class="form-group">
1040+
<label class="control-sidebar-subheading">
1041+
Show me as online
1042+
<input type="checkbox" class="pull-right" checked />
1043+
</label>
1044+
</div><!-- /.form-group -->
1045+
1046+
<div class="form-group">
1047+
<label class="control-sidebar-subheading">
1048+
Turn off notifications
1049+
<input type="checkbox" class="pull-right" />
1050+
</label>
1051+
</div><!-- /.form-group -->
1052+
1053+
<div class="form-group">
1054+
<label class="control-sidebar-subheading">
1055+
Delete chat history
1056+
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
1057+
</label>
1058+
</div><!-- /.form-group -->
1059+
</form>
1060+
</div><!-- /.tab-pane -->
1061+
</div>
1062+
</aside><!-- /.control-sidebar -->
1063+
<!-- Add the sidebar's background. This div must be placed
1064+
immediately after the control sidebar -->
1065+
<div class='control-sidebar-bg'></div>
8951066
</div><!-- ./wrapper -->
8961067

8971068
<!-- jQuery 2.1.3 -->

‎index2.html‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1116,8 +1116,7 @@ <h3 class="box-title">Recently Added Products</h3>
11161116
<aside class="control-sidebar">
11171117
<!-- Create the tabs -->
11181118
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
1119-
<li class="active"><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></i></a></li>
1120-
<!--li><a href="#control-sidebar-stats-tab" data-toggle="tab"><i class="fa fa-pie-chart"></i></a></li-->
1119+
<li class="active"><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></i></a></li>
11211120
<li><a href="#control-sidebar-settings-tab" data-toggle="tab"><i class="fa fa-gears"></i></a></li>
11221121
</ul>
11231122
<!-- Tab panes -->

‎pages/UI/buttons.html‎

Lines changed: 173 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
1313
<!-- Theme style -->
1414
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
15-
<!-- AdminLTE Skins. Choose a skin from the css/skins
15+
<!-- AdminLTE Skins. Choose a skin from the css/skins
1616
folder instead of downloading all of them to reduce the load. -->
1717
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
1818

@@ -25,7 +25,7 @@
2525
</head>
2626
<body class="skin-blue sidebar-mini">
2727
<div class="wrapper">
28-
28+
2929
<header class="main-header">
3030
<!-- Logo -->
3131
<a href="../../index2.html" class="logo">
@@ -271,6 +271,10 @@ <h3>
271271
</li>
272272
</ul>
273273
</li>
274+
<!-- Control Sidebar Toggle Button -->
275+
<li>
276+
<a href="#" data-toggle="control-sidebar"><i class="fa fa-outdent"></i></a>
277+
</li>
274278
</ul>
275279
</div>
276280
</nav>
@@ -1325,6 +1329,173 @@ <h3 class='box-title'>Vertical Button Group</h3>
13251329
</div>
13261330
<strong>Copyright &copy; 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
13271331
</footer>
1332+
1333+
<!-- Control Sidebar -->
1334+
<aside class="control-sidebar">
1335+
<!-- Create the tabs -->
1336+
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
1337+
<li class="active"><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></i></a></li>
1338+
1339+
<li><a href="#control-sidebar-settings-tab" data-toggle="tab"><i class="fa fa-gears"></i></a></li>
1340+
</ul>
1341+
<!-- Tab panes -->
1342+
<div class="tab-content">
1343+
<!-- Home tab content -->
1344+
<div class="tab-pane active" id="control-sidebar-home-tab">
1345+
<h3 class="control-sidebar-heading">Recent Activity</h3>
1346+
<ul class='control-sidebar-menu'>
1347+
<li>
1348+
<a href='javascript::;'>
1349+
<i class="menu-icon fa fa-birthday-cake bg-red"></i>
1350+
<div class="menu-info">
1351+
<h4 class="control-sidebar-subheading">Langdon's Birthday</h4>
1352+
<p>Will be 23 on April 24th</p>
1353+
</div>
1354+
</a>
1355+
</li>
1356+
<li>
1357+
<a href='javascript::;'>
1358+
<i class="menu-icon fa fa-user bg-yellow"></i>
1359+
<div class="menu-info">
1360+
<h4 class="control-sidebar-subheading">Frodo Updated His Profile</h4>
1361+
<p>New phone +1(800)555-1234</p>
1362+
</div>
1363+
</a>
1364+
</li>
1365+
<li>
1366+
<a href='javascript::;'>
1367+
<i class="menu-icon fa fa-envelope-o bg-light-blue"></i>
1368+
<div class="menu-info">
1369+
<h4 class="control-sidebar-subheading">Nora Joined Mailing List</h4>
1370+
<p>nora@example.com</p>
1371+
</div>
1372+
</a>
1373+
</li>
1374+
<li>
1375+
<a href='javascript::;'>
1376+
<i class="menu-icon fa fa-file-code-o bg-green"></i>
1377+
<div class="menu-info">
1378+
<h4 class="control-sidebar-subheading">Cron Job 254 Executed</h4>
1379+
<p>Execution time 5 seconds</p>
1380+
</div>
1381+
</a>
1382+
</li>
1383+
</ul><!-- /.control-sidebar-menu -->
1384+
1385+
<h3 class="control-sidebar-heading">Tasks Progress</h3>
1386+
<ul class='control-sidebar-menu'>
1387+
<li>
1388+
<a href='javascript::;'>
1389+
<h4 class="control-sidebar-subheading">
1390+
Custom Template Design
1391+
<span class="label label-danger pull-right">70%</span>
1392+
</h4>
1393+
<div class="progress progress-xxs">
1394+
<div class="progress-bar progress-bar-danger" style="width: 70%"></div>
1395+
</div>
1396+
</a>
1397+
</li>
1398+
<li>
1399+
<a href='javascript::;'>
1400+
<h4 class="control-sidebar-subheading">
1401+
Update Resume
1402+
<span class="label label-success pull-right">95%</span>
1403+
</h4>
1404+
<div class="progress progress-xxs">
1405+
<div class="progress-bar progress-bar-success" style="width: 95%"></div>
1406+
</div>
1407+
</a>
1408+
</li>
1409+
<li>
1410+
<a href='javascript::;'>
1411+
<h4 class="control-sidebar-subheading">
1412+
Laravel Integration
1413+
<span class="label label-waring pull-right">50%</span>
1414+
</h4>
1415+
<div class="progress progress-xxs">
1416+
<div class="progress-bar progress-bar-warning" style="width: 50%"></div>
1417+
</div>
1418+
</a>
1419+
</li>
1420+
<li>
1421+
<a href='javascript::;'>
1422+
<h4 class="control-sidebar-subheading">
1423+
Back End Framework
1424+
<span class="label label-primary pull-right">68%</span>
1425+
</h4>
1426+
<div class="progress progress-xxs">
1427+
<div class="progress-bar progress-bar-primary" style="width: 68%"></div>
1428+
</div>
1429+
</a>
1430+
</li>
1431+
</ul><!-- /.control-sidebar-menu -->
1432+
1433+
</div><!-- /.tab-pane -->
1434+
<!-- Stats tab content -->
1435+
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
1436+
<!-- Settings tab content -->
1437+
<div class="tab-pane" id="control-sidebar-settings-tab">
1438+
<form method="post">
1439+
<h3 class="control-sidebar-heading">General Settings</h3>
1440+
<div class="form-group">
1441+
<label class="control-sidebar-subheading">
1442+
Report panel usage
1443+
<input type="checkbox" class="pull-right" checked />
1444+
</label>
1445+
<p>
1446+
Some information about this general settings option
1447+
</p>
1448+
</div><!-- /.form-group -->
1449+
1450+
<div class="form-group">
1451+
<label class="control-sidebar-subheading">
1452+
Allow mail redirect
1453+
<input type="checkbox" class="pull-right" checked />
1454+
</label>
1455+
<p>
1456+
Other sets of options are available
1457+
</p>
1458+
</div><!-- /.form-group -->
1459+
1460+
<div class="form-group">
1461+
<label class="control-sidebar-subheading">
1462+
Expose author name in posts
1463+
<input type="checkbox" class="pull-right" checked />
1464+
</label>
1465+
<p>
1466+
Allow the user to show his name in blog posts
1467+
</p>
1468+
</div><!-- /.form-group -->
1469+
1470+
<h3 class="control-sidebar-heading">Chat Settings</h3>
1471+
1472+
<div class="form-group">
1473+
<label class="control-sidebar-subheading">
1474+
Show me as online
1475+
<input type="checkbox" class="pull-right" checked />
1476+
</label>
1477+
</div><!-- /.form-group -->
1478+
1479+
<div class="form-group">
1480+
<label class="control-sidebar-subheading">
1481+
Turn off notifications
1482+
<input type="checkbox" class="pull-right" />
1483+
</label>
1484+
</div><!-- /.form-group -->
1485+
1486+
<div class="form-group">
1487+
<label class="control-sidebar-subheading">
1488+
Delete chat history
1489+
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
1490+
</label>
1491+
</div><!-- /.form-group -->
1492+
</form>
1493+
</div><!-- /.tab-pane -->
1494+
</div>
1495+
</aside><!-- /.control-sidebar -->
1496+
<!-- Add the sidebar's background. This div must be placed
1497+
immediately after the control sidebar -->
1498+
<div class='control-sidebar-bg'></div>
13281499
</div><!-- ./wrapper -->
13291500

13301501
<!-- jQuery 2.1.3 -->

0 commit comments

Comments
 (0)