This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Styles voor schermen smaller dan 768px: | |
@media screen and (max-width: 768px) {...} // Dit gaat fout, veel tablets hebben een CSS-breedte van 768px en krijgen hiermee de style die bedoeld is voor smartphones. | |
@media screen and (max-width: 767px) {...} // Dit gaat goed. | |
// Styles voor schermen smaller dan 768px: | |
@media screen and (min-width: 768px) {...} // Dit gaat goed. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- Huidige HTML: --> | |
<div class="filter"> | |
<form id="filters"> | |
<ul> | |
<li>...</li> | |
<li>...</li> | |
<li>...</li> | |
<li class="filter_title">...</li> | |
<li class="left_column">...</li> | |
<li class="right_column">...</li> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- Huidige situatie --> | |
<div class="sub-menu-container"> | |
<ul id="menu-submenu" class="sub-menu"> | |
(...) | |
</ul> | |
</div> | |
<!-- Nieuwe situatie --> | |
<div class="sub-menu-container"> | |
<ul id="menu-submenu" class="sub-menu"> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- Huidige code --> | |
<div class="language"> | |
<ul> | |
<li class="nl active"> | |
<span>nl</span> | |
</li> | |
(...) | |
</ul> | |
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Oude situatie (regel 147 - 168 van style.less): | |
.header { | |
padding: 14px 10px 0; | |
overflow: hidden; | |
@media screen and (min-width: 768px){ | |
height: 157px; | |
padding: 0; | |
} | |
@media screen and (max-width: 991px){z-index: 15; /* Do not change this value */} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* Oude situatie: */ | |
@media screen and (min-width: 768px){ | |
.page-bg:before { | |
content: " "; | |
position: absolute; | |
width: 100%; | |
height: 678px; | |
background: url("/templates/images/page-bg.jpg") no-repeat 100% 50%; | |
top: 0; | |
left: 0; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- Oude situatie: --> | |
<html> | |
<head>(...)</head> | |
<body> | |
<div class="container">(...)</div> | |
<div class="container page-bg"> | |
(...) | |
</div> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Huidig (regel 36 - 44): | |
$(document).on('click', function(e){ | |
if( $(e.target).closest(menu).length > 0 || $(e.target).closest(menuToggle).length > 0 ) { | |
return false; | |
} | |
else { | |
rowOffcanvas.removeClass("active"); | |
menuToggle.removeClass("active"); | |
} | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- Oude situatie --> | |
<ul class="pager"> | |
<li class="previous"><a href="#">Vorig project</a></li> | |
<li class="next"><a href="#">Volgend project</a></li> | |
</ul> | |
<!-- Nieuwe situatie --> | |
<ul class="pager"> | |
<li class="previous"><a href="#"><span>Vorig project</span></a></li> | |
<li class="next"><a href="#"><span>Volgend project</span></a></li> |