adding bugfix

main
HerrHase 2 weeks ago
parent 29cf4377fb
commit 782b6643cf

@ -1,6 +1,6 @@
{
"name": "@spd-minden/sozi-ui",
"version": "0.2.0",
"version": "0.2.1",
"description": "Components for CI of SPD",
"repository": {
"type": "git",

@ -14,27 +14,27 @@ $(function () {
*
*/
const button = $('#mobile-button')
const navigation = $('.sozi-ui__menu-list')
const navigationOpenClass = 'sozi-ui__menu-list--open'
const navigationWrapper = $('.sozi-ui__menu-list-wrapper')
const navigation = navigationWrapper.find('.sozi-ui__menu-list').first()
const buttonClass = 'button--open'
// open sidebar and button
const handleOpen = function() {
navigation.addClass(navigationOpenClass)
navigationWrapper.css('max-height', navigation.outerHeight() + 'px')
button.addClass(buttonClass)
}
// close sidebar and button
const handleClose = function() {
navigation.removeClass(navigationOpenClass)
navigationWrapper.css('max-height', '0px')
button.removeClass(buttonClass)
}
button.on('click', (event) => {
event.preventDefault()
if (navigation.hasClass(navigationOpenClass)) {
if (navigationWrapper.css('max-height') !== '0px') {
handleClose()
} else {
handleOpen()

@ -35,12 +35,11 @@
}
}
&-list {
&-list-wrapper {
@media only screen and (max-width: $grid__md - 1) {
overflow: hidden;
position: absolute;
max-height: 0;
height: 100%;
top: 86px;
left: 0;
background: white;

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

@ -1 +1 @@
(self.webpackChunk_spd_minden_sozi_ui=self.webpackChunk_spd_minden_sozi_ui||[]).push([[654],{874:()=>{}}]);
(self.webpackChunk_spd_minden_sozi_ui=self.webpackChunk_spd_minden_sozi_ui||[]).push([["spritemap"],{"?4e0c":()=>{eval("\n\n//# sourceURL=webpack://@spd-minden/sozi-ui/spritemap-dummy-module?")}}]);

@ -20,16 +20,34 @@
<div class="sozi-ui__menu">
<div class="sozi-ui__menu-start">
<a href="/">
<img src="/images/logo.svg" class="sozi-ui__menu-logo" />
<img src="/images/logo.svg" alt="SPD - Sozial Politik für dich" class="sozi-ui__menu-logo" />
</a>
</div>
<div class="sozi-ui__menu-start">
<a class="sozi-ui__menu-item" href="#ziele">
Ziele
</a>
<a class="sozi-ui__menu-item" href="#social-media">
Social Media
</a>
<button id="mobile-button" type="button" class="sozi-ui__button sozi-ui__button--menu sozi-ui__button--transparent hidden-md-up p-0">
<svg class="sozi-ui__icon" aria-hidden="true">
<use xlink:href="/symbol-defs.svg#icon-menu"></use>
</svg>
<svg class="sozi-ui__icon hidden" aria-hidden="true">
<use xlink:href="/symbol-defs.svg#icon-close"></use>
</svg>
</button>
<nav class="sozi-ui__menu-list hidden-sm-down">
<a class="sozi-ui__menu-item" href="/#echt-von-hier">
Echt von hier
</a>
<a class="sozi-ui__menu-item" href="/#da-trefft-ihr-mich">
Da trefft Ihr mich
</a>
<a class="sozi-ui__menu-item" href="/#da-komm-ich-wech">
Da komm ich wech
</a>
<a class="sozi-ui__menu-item" href="/#social-media">
Social Media
</a>
</nav>
</div>
</div>
</div>

@ -13,33 +13,43 @@
<body>
<header class="header">
<header class="site-header">
<div class="container">
<div class="grid">
<div class="col-12">
<div class="sozi-ui__menu">
<div class="sozi-ui__menu-start">
<a href="/">
<img src="/images/logo.svg" class="sozi-ui__menu-logo" />
<img src="/images/logo.svg" alt="SPD - Sozial Politik für dich" class="sozi-ui__menu-logo" />
</a>
</div>
<div class="sozi-ui__menu-start">
<a class="sozi-ui__menu-item" href="#ziele">
Soluta
</a>
<a class="sozi-ui__menu-item" href="#social-media">
Doming
</a>
<button id="mobile-button" type="button" class="button button--transparent">
<svg class="icon" aria-hidden="true">
<button id="mobile-button" type="button" class="sozi-ui__button sozi-ui__button--menu sozi-ui__button--transparent hidden-md-up p-0">
<svg class="sozi-ui__icon" aria-hidden="true">
<use xlink:href="/symbol-defs.svg#icon-menu"></use>
</svg>
<svg class="icon" aria-hidden="true">
<svg class="sozi-ui__icon hidden" aria-hidden="true">
<use xlink:href="/symbol-defs.svg#icon-close"></use>
</svg>
</button>
<div class="sozi-ui__menu-list-wrapper">
<nav class="sozi-ui__menu-list">
<a class="sozi-ui__menu-item" href="/#echt-von-hier">
Echt von hier
</a>
<a class="sozi-ui__menu-item" href="/#da-trefft-ihr-mich">
Da trefft Ihr mich
</a>
<a class="sozi-ui__menu-item" href="/#da-komm-ich-wech">
Da komm ich wech
</a>
<a class="sozi-ui__menu-item" href="/#social-media">
Social Media
</a>
</nav>
</div>
</div>
</div>
</div>
@ -139,6 +149,8 @@
</div>
</div>
</footer>
<script async src="/js/menu.js"></script>
</body>
</html>

Loading…
Cancel
Save