Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
laurakalbag-dot-com
laurakalbag-dot-com
Commits
1860f8b2
Commit
1860f8b2
authored
Feb 07, 2019
by
Laura Kalbag
⚡
Browse files
Make nav better on narrower viewports. Closes #44
parent
561c57b7
Changes
1
Show whitespace changes
Inline
Side-by-side
themes/static-kalbag/static/css/style.css
View file @
1860f8b2
...
...
@@ -455,34 +455,39 @@ figcaption, .site-footer p, .site-footer small, .note {
.navigation-menu
ul
{
background
:
hsla
(
var
(
--tab-five
),
0.1
);
display
:
flex
;
flex-direction
:
row
;
flex-wrap
:
wrap
;
justify-content
:
center
;
align-content
:
stretch
;
align-items
:
stretch
;
grid-template-columns
:
repeat
(
7
,
1
fr
);
list-style-type
:
none
;
margin
:
0
;
padding
:
0
;
padding
:
0
0
0.5em
0.5em
;
}
.navigation-menu
ul
li
{
background
:
hsl
(
var
(
--secondary-bg
));
@media
screen
and
(
min-width
:
37em
)
{
.navigation-menu
ul
{
/* 7 = number of columns = number of links in nav */
display
:
grid
;
grid-template-columns
:
repeat
(
7
,
auto
);
padding
:
0
;
}
}
.navigation-menu
ul
a
{
border-radius
:
0.75em
;
display
:
block
;
padding
:
calc
(
var
(
--layout-unit
)/
3
)
var
(
--layout-unit
);
margin
:
0.5em
0.5em
0
0
;
padding
:
calc
(
var
(
--layout-unit
)/
3
)
calc
(
var
(
--layout-unit
)/
2
);
text-align
:
center
;
text-decoration
:
none
;
}
@media
screen
and
(
min-width
:
3
5
em
)
{
@media
screen
and
(
min-width
:
3
7
em
)
{
.navigation-menu
ul
a
{
padding
:
calc
(
var
(
--layout-unit
)/
3
)
var
(
--layout-unit
);
border-radius
:
0
;
display
:
block
;
margin
:
0
;
}
}
/* set active navigation link background colour */
.navigation-menu
li
.active
a
,
body
.blog
.navigation-menu
a
[
href
=
"/posts/"
],
body
.latest
.navigation-menu
a
[
href
=
"/latest/"
]
{
background
:
rgba
(
255
,
255
,
255
,
0.85
);
...
...
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