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
This repository was archived by the owner on Sep 5, 2019. It is now read-only.

Commit 8def568

Browse files
committed
Fix and update
1 parent 14e0efb commit 8def568

File tree

7 files changed

+146
-19
lines changed

7 files changed

+146
-19
lines changed

‎css/style.menu.css‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,7 @@
5252
font-size: 100%;
5353
list-style: none;
5454
margin: 0;
55+
overflow: hidden;
5556
}
5657

5758
.sidebar ul.menu li {
@@ -79,7 +80,7 @@
7980

8081
.sidebar ul.menu li ul li ul {
8182
display: none;
82-
margin: 15px 10px;
83+
margin: 15px 015px8px;
8384
padding-left: 10px;
8485
}
8586

@@ -102,11 +103,11 @@
102103
}
103104

104105
.sidebar ul.menu li ul li.parent a.employ.rotate:before {
105-
transform: rotate(-180deg);
106+
transform: rotate(180deg);
106107
}
107108

108-
.sidebar ul.menu li ul li.parent a.employ.rotate.active:before {
109-
transform: rotate(180deg);
109+
.sidebar ul.menu li ul li.parent a.employ.rotate-revert:before {
110+
transform: rotate(-180deg);
110111
}
111112

112113
/* perfect scrollbar

‎css/style.menu.dark.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@
5858
}
5959

6060
.sidebar ul.menu li ul li ul {
61-
border-left: 2px solid #363c49;
61+
border-left: 1px solid #363c49;
6262
}
6363

6464
/* notice

‎css/style.menu.light.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@
5858
}
5959

6060
.sidebar ul.menu li ul li ul {
61-
border-left: 2px solid #ebebeb;
61+
border-left: 1px solid #ebebeb;
6262
}
6363

6464
/* notice

‎js/responsive.menu.js‎

Lines changed: 18 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,43 @@
11

2-
/*
3-
* Responsive menu.
2+
/*!
3+
* CSS UI - Responsive menu
4+
* Copyright Zdeněk Papučík
5+
* MIT License
46
*/
57
(function($) {
68

7-
// click show/hide menu
9+
10+
// toggle sidebar menu
811
$('.nav .click').on('click', function() {
912
$('.nav .responsive').toggleClass('expandable');
1013
});
1114

15+
1216
// init menu
1317
$('ul.menu li').each(function() {
1418
$(this).parent().find('li.parent a.employ').addClass('up');
15-
if ($(this).children('li.parent a.current').length > 0 ) {
16-
$(this).parent().find('ul.submenu').toggle();
17-
$(this).parent().find('li.parent a.employ').addClass('active down');
19+
if ($(this).find('li.parent a.current').length > 0 ) {
20+
$(this).parent().find('a.current').addClass('active down');
21+
$(this).parent().find('a.current').next('ul.submenu').show();
1822
}
1923
});
2024

25+
2126
// active menu
2227
$('ul.menu li a').on('click', function() {
23-
$(this).parent('li.parent').find('a.employ').toggleClass('active');
24-
$(this).parent().find('ul.submenu').slideToggle('fast');
25-
$(this).parent().find('ul.submenu ul.submenu').toggle();
28+
$(this).parent().find('a.employ').toggleClass('active');
29+
$(this).next('ul.submenu').slideToggle('fast');
2630
});
2731

32+
2833
// click transition
2934
$('a.employ').on('click', function() {
3035
$(this).addClass('transition');
3136
$(this).toggleClass('rotate');
37+
if ($(this).parent().find('a.employ').hasClass('down')) {
38+
$(this).toggleClass('rotate-revert');
39+
}
3240
});
3341

42+
3443
}(jQuery));

‎package-lock.json‎

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919
"dependencies": {
2020
"css-ui-simple": "^2.5.2",
2121
"font-awesome": "^4.7.0",
22-
"jquery": "^3.3.1",
22+
"jquery": "^3.4.1",
2323
"open-sans-fontface": "^1.4.0",
2424
"perfect-scrollbar": "^1.4.0"
2525
},

‎responsive.menu.html‎

Lines changed: 117 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,117 @@
1+
<!DOCTYPE html>
2+
<html lang="cs">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1">
6+
<title>CSS UI - Simple responsive menu</title>
7+
8+
<!-- css -->
9+
<link rel="stylesheet" href="node_modules/normalize.css/normalize.css">
10+
<link rel="stylesheet" href="node_modules/perfect-scrollbar/css/perfect-scrollbar.css">
11+
<link rel="stylesheet" href="node_modules/font-awesome/css/font-awesome.css">
12+
<link rel="stylesheet" href="node_modules/open-sans-fontface/open-sans.css">
13+
<link rel="stylesheet" href="node_modules/css-ui-simple/css/cssui.css">
14+
15+
<!-- css menu -->
16+
<link rel="stylesheet" href="css/style.menu.css">
17+
<link rel="stylesheet" href="css/style.menu.light.css">
18+
<style>
19+
body {
20+
background: #f2f2f2;
21+
font-family: 'Open Sans', sans-serif;
22+
font-size: 1.438em;
23+
}
24+
</style>
25+
</head>
26+
<body>
27+
<!-- nav wrapper -->
28+
<div class="nav">
29+
30+
<!-- click show/hide menu -->
31+
<div class="click"></div>
32+
33+
<!-- sidebar -->
34+
<div class="sidebar">
35+
36+
<!-- title for sidebar -->
37+
<div class="title">
38+
<p>Responsive menu</p>
39+
</div>
40+
<div class="responsive">
41+
<ul class="menu scrollbar">
42+
43+
<!-- simple menu -->
44+
<li>
45+
<span class="name">Translate</span>
46+
<ul>
47+
<li><a href="#">Czech</a></li>
48+
<li><a href="#" class="current">English</a></li>
49+
</ul>
50+
</li>
51+
52+
<!-- dropdown menu -->
53+
<li>
54+
<span class="name">Dashboard</span>
55+
<ul>
56+
<li><a href="#">Home</a></li>
57+
<li class="parent">
58+
<a href="#" class="employ current">Settings</a>
59+
<ul class="submenu">
60+
<li><a href="#">Timezone</a></li>
61+
<li><a href="#">Permissions</a></li>
62+
<li><a href="#" class="employ current">Maintenance</a>
63+
<ul class="submenu">
64+
<li><a href="#">On</a></li>
65+
<li><a href="#" class="current">Off</a></li>
66+
</ul>
67+
</li>
68+
</ul>
69+
</li>
70+
71+
<!-- notice info -->
72+
<li><a href="#">Notice<span class="notice">3</span></a></li>
73+
</ul>
74+
</li>
75+
76+
<!-- dropdown menu -->
77+
<li>
78+
<span class="name">Coments</span>
79+
<ul>
80+
<li><a href="#">New</a></li>
81+
<li class="parent">
82+
<a href="#" class="employ">Settings comments</a>
83+
<ul class="submenu">
84+
<li><a href="#">Disable</a></li>
85+
<li><a href="#">Enable</a></li>
86+
</ul>
87+
</li>
88+
</ul>
89+
</li>
90+
91+
<!-- simple menu -->
92+
<li>
93+
<span class="name">Blog</span>
94+
<ul>
95+
<li><a href="#">Add</a></li>
96+
<li><a href="#">List</a></li>
97+
</ul>
98+
</li>
99+
</ul>
100+
</div>
101+
</div>
102+
</div>
103+
104+
<!-- content wrapper -->
105+
<div class="content-wrapper"></div>
106+
107+
<!-- javascript libraries and plugins -->
108+
<script src="node_modules/jquery/dist/jquery.js"></script>
109+
<script src="node_modules/perfect-scrollbar/dist/perfect-scrollbar.js"></script>
110+
<script src="js/responsive.menu.js"></script>
111+
<script>
112+
$(function() {
113+
new PerfectScrollbar('.scrollbar');
114+
});
115+
</script>
116+
</body>
117+
</html>

0 commit comments

Comments
(0)

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