spd-minden
/
sozi-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

adding bugfix

Browse Source
main
HerrHase 2 weeks ago
parent 29cf4377fb
commit 782b6643cf
8 changed files with 1860 additions and 30 deletions
Show Stats Download Patch File Download Diff File

2
package.json
Unescape View File

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

10
src/js/menu.js
Unescape View File

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

3
src/scss/components/_menu.scss
Unescape View File

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

1803
templates/css/styles.css
View File

File diff suppressed because one or more lines are too long

2
templates/js/menu.js
View File

File diff suppressed because one or more lines are too long

2
templates/js/spritemap.js
Unescape View File

@ -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?")}}]);

26
templates/panel.html
Unescape View File

@ -20,16 +20,34 @@
<div class="sozi-ui__menu"> <div class="sozi-ui__menu">
<div class="sozi-ui__menu-start"> <div class="sozi-ui__menu-start">
<a href="/"> <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> </a>
</div> </div>
<div class="sozi-ui__menu-start"> <div class="sozi-ui__menu-start">
<a class="sozi-ui__menu-item" href="#ziele">
Ziele <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>
<a class="sozi-ui__menu-item" href="#social-media"> <a class="sozi-ui__menu-item" href="/#social-media">
Social Media Social Media
</a> </a>
</nav>
</div> </div>
</div> </div>
</div> </div>

36
templates/topics.html
Unescape View File

@ -13,33 +13,43 @@
<body> <body>
<header class="header"> <header class="site-header">
<div class="container"> <div class="container">
<div class="grid"> <div class="grid">
<div class="col-12"> <div class="col-12">
<div class="sozi-ui__menu"> <div class="sozi-ui__menu">
<div class="sozi-ui__menu-start"> <div class="sozi-ui__menu-start">
<a href="/"> <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> </a>
</div> </div>
<div class="sozi-ui__menu-start"> <div class="sozi-ui__menu-start">
<a class="sozi-ui__menu-item" href="#ziele"> <button id="mobile-button" type="button" class="sozi-ui__button sozi-ui__button--menu sozi-ui__button--transparent hidden-md-up p-0">
Soluta <svg class="sozi-ui__icon" aria-hidden="true">
</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">
<use xlink:href="/symbol-defs.svg#icon-menu"></use> <use xlink:href="/symbol-defs.svg#icon-menu"></use>
</svg> </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> <use xlink:href="/symbol-defs.svg#icon-close"></use>
</svg> </svg>
</button> </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> </div>
</div> </div>
@ -139,6 +149,8 @@
</div> </div>
</div> </div>
</footer> </footer>
<script async src="/js/menu.js"></script>
</body> </body>
</html> </html>

Write Preview
Loading…
Cancel
Save