library-mirrors/pure
1
0
Fork 0
mirror of https://github.com/pure-css/pure.git synced 2024-10-05 19:24:19 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

fixes some problems with the custom implentation; the font-size: small rule ensures the caret :after for a dropdown menu does not affect the sizing of its parent box, which was causing bad vertical alignment of links in the horizontal menu.

Browse Source
This commit is contained in:
James Alley 2015-01-20 15:49:13 -08:00
parent 524b2fc90f
commit 704e5fd5ec
2 changed files with 14 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/menus/css/menus-dropdown.css
View File

@ -33,6 +33,7 @@
.pure-menu-has-children > .pure-menu-link:after {
padding-left: 0.5em;
content: "\25B8";
font-size: small;
}
/* Horizontal Menus - show the dropdown arrow */

22
src/menus/tests/manual/menus.html
View File

@ -17,42 +17,46 @@
padding: 2em 2em 8em;
}
/* Update background on menu. */
/* Update background on menu. */
.menu-custom,
.children-custom {
.children-custom,
.menu-custom .pure-menu-list {
background: #111;
padding: 0.8em;
border-radius: 5px;
}
/* Make the heading white */
.heading-custom {
color: white;
}
.heading-custom:hover {
background-color: transparent;
}
/* Make links light-gray with a transition */
.link-custom {
color: #ddd;
transition: color 0.5s;
}
/* Color links blue on hover and focus */
.link-custom:hover,
.link-custom:focus {
color: #40a4ff;
background-color: transparent;
}
/* Update the positioning of the toggle button
/* Update the positioning of the toggle button
because we are modifying the menu's padding, and change its color. */
.toggle-custom {
margin-top: 6px;
margin-right: 15px;
color: white;
}
</style>
</head>
<body>
<h1>div.pure-menu.pure-menu-horizontal</h1>
<div class="pure-menu pure-menu-horizontal">
<a href="#" class="pure-menu-link pure-menu-heading">Title</a>