Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
S
SWLab UI
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
hyeryung
SWLab UI
Commits
910cdef6
Commit
910cdef6
authored
8 months ago
by
박민석
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
update navigation style
parent
e111b072
Show whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
55 additions
and
7 deletions
+55
-7
base.css
src/css/base.css
+1
-1
header.css
src/css/header.css
+2
-0
nav.css
src/css/nav.css
+50
-5
nav-tree.hbs
src/partials/nav-tree.hbs
+2
-1
No files found.
src/css/base.css
View file @
910cdef6
...
@@ -32,7 +32,7 @@ a {
...
@@ -32,7 +32,7 @@ a {
}
}
a
:hover
{
a
:hover
{
text-decoration
:
underli
ne
;
text-decoration
:
no
ne
;
}
}
a
:active
{
a
:active
{
...
...
This diff is collapsed.
Click to expand it.
src/css/header.css
View file @
910cdef6
...
@@ -10,7 +10,9 @@ body {
...
@@ -10,7 +10,9 @@ body {
.navbar
{
.navbar
{
background
:
var
(
--color-white
);
background
:
var
(
--color-white
);
border-bottom
:
1px
solid
var
(
--color-bwg-main
);
color
:
var
(
--color-bwg-main
);
color
:
var
(
--color-bwg-main
);
height
:
4.5rem
;
font-size
:
calc
(
16
/
var
(
--rem-base
)
*
1rem
);
font-size
:
calc
(
16
/
var
(
--rem-base
)
*
1rem
);
position
:
fixed
;
position
:
fixed
;
top
:
0
;
top
:
0
;
...
...
This diff is collapsed.
Click to expand it.
src/css/nav.css
View file @
910cdef6
...
@@ -16,7 +16,8 @@
...
@@ -16,7 +16,8 @@
@media
screen
and
(
min-width
:
769px
)
{
@media
screen
and
(
min-width
:
769px
)
{
.nav-container
{
.nav-container
{
width
:
var
(
--nav-width
);
/* width: var(--nav-width); */
width
:
20.125rem
;
}
}
}
}
...
@@ -71,6 +72,7 @@
...
@@ -71,6 +72,7 @@
overflow-y
:
scroll
;
overflow-y
:
scroll
;
overscroll-behavior
:
none
;
overscroll-behavior
:
none
;
height
:
var
(
--nav-panel-menu-height
);
height
:
var
(
--nav-panel-menu-height
);
padding
:
1.25em
;
}
}
.nav-panel-menu
:not
(
.is-active
)
.nav-menu
{
.nav-panel-menu
:not
(
.is-active
)
.nav-menu
{
...
@@ -90,9 +92,9 @@
...
@@ -90,9 +92,9 @@
.nav-menu
{
.nav-menu
{
min-height
:
100%
;
min-height
:
100%
;
padding
:
0.5rem
0.75rem
;
line-height
:
var
(
--nav-line-height
);
position
:
relative
;
position
:
relative
;
padding
:
0.5rem
0.5rem
0.5rem
0
;
line-height
:
1.375
;
}
}
.nav-menu-toggle
{
.nav-menu-toggle
{
...
@@ -128,8 +130,8 @@
...
@@ -128,8 +130,8 @@
.nav-list
{
.nav-list
{
list-style
:
none
;
list-style
:
none
;
margin
:
0
0
0
0.75rem
;
padding
:
0
;
padding
:
0
;
margin
:
0
;
}
}
.nav-menu
>
.nav-list
+
.nav-list
{
.nav-menu
>
.nav-list
+
.nav-list
{
...
@@ -138,6 +140,24 @@
...
@@ -138,6 +140,24 @@
.nav-item
{
.nav-item
{
margin-top
:
0.5em
;
margin-top
:
0.5em
;
position
:
relative
;
}
.nav-item
.nav-link
{
padding
:
0.5rem
0
0.35rem
0.25rem
;
display
:
block
;
border-bottom
:
1px
solid
transparent
;
border-radius
:
3px
;
}
.nav-item
.nav-link
:hover
{
border-bottom
:
1px
solid
var
(
--color-bwg-main
);
border-radius
:
0
;
}
.nav-item.is-current-page
>
a
{
background
:
var
(
--color-bwg-main
);
color
:
var
(
--color-white
);
}
}
/* adds some breathing room below a nested list */
/* adds some breathing room below a nested list */
...
@@ -151,6 +171,30 @@
...
@@ -151,6 +171,30 @@
margin
:
0
;
margin
:
0
;
}
}
.nav-item
[
data-depth
=
"1"
]
>
.nav-link
{
padding-left
:
1.25rem
;
}
.nav-item
[
data-depth
=
"1"
]
>
.nav-item-toggle
{
left
:
1rem
;
}
.nav-item
[
data-depth
=
"2"
]
>
.nav-link
{
padding-left
:
1.75rem
;
}
.nav-item
[
data-depth
=
"2"
]
>
.nav-item-toggle
{
left
:
1.5rem
;
}
.nav-item
[
data-depth
=
"3"
]
>
.nav-link
{
padding-left
:
2.25rem
;
}
.nav-item
[
data-depth
=
"3"
]
>
.nav-item-toggle
{
left
:
2rem
;
}
.nav-item
:not
(
.is-active
)
>
.nav-list
{
.nav-item
:not
(
.is-active
)
>
.nav-list
{
display
:
none
;
display
:
none
;
}
}
...
@@ -164,8 +208,9 @@
...
@@ -164,8 +208,9 @@
position
:
absolute
;
position
:
absolute
;
height
:
calc
(
var
(
--nav-line-height
)
*
1em
);
height
:
calc
(
var
(
--nav-line-height
)
*
1em
);
width
:
calc
(
var
(
--nav-line-height
)
*
1em
);
width
:
calc
(
var
(
--nav-line-height
)
*
1em
);
margin-top
:
-0.0
5em
;
margin-top
:
0.3
5em
;
margin-left
:
calc
(
var
(
--nav-line-height
)
*
-1em
);
margin-left
:
calc
(
var
(
--nav-line-height
)
*
-1em
);
top
:
0.15rem
;
}
}
.nav-item.is-active
>
.nav-item-toggle
{
.nav-item.is-active
>
.nav-item-toggle
{
...
...
This diff is collapsed.
Click to expand it.
src/partials/nav-tree.hbs
View file @
910cdef6
...
@@ -11,7 +11,8 @@
...
@@ -11,7 +11,8 @@
{{
~#
if
(
eq
./
urlType
'internal'
)
}}{{{
relativize
./
url
}}}
{{
~#
if
(
eq
./
urlType
'internal'
)
}}{{{
relativize
./
url
}}}
{{
~
else}}{{{
./
url
}}}{{
~
/
if
}}
"
>
{{{
./
content
}}}
</a>
{{
~
else}}{{{
./
url
}}}{{
~
/
if
}}
"
>
{{{
./
content
}}}
</a>
{{else}}
{{else}}
<span
class=
"nav-text"
>
{{{
./
content
}}}
</span>
{{!-- <span class="nav-text">{{{./content}}}</span> --}}
<a
class=
"nav-link"
href=
"#"
>
{{{
./
content
}}}
</a>
{{/if}}
{{/if}}
{{/if}}
{{/if}}
{{>
nav-tree
navigation
=
./
items
level
=
(
increment
..
/
level
)
}}
{{>
nav-tree
navigation
=
./
items
level
=
(
increment
..
/
level
)
}}
...
...
This diff is collapsed.
Click to expand it.
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment