quarante-douze
/
qdouze2-wordpress-theme
1
0
Fork 0
Code Issues 2 Pull Requests Packages Projects Releases Wiki Activity

fix: responsive fixes

Browse Source
main
Kazhnuz Klappsthul 2 months ago
parent 9c0b92d0fa
commit 6b8fbca595
12 changed files with 148 additions and 38 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 4
      category.php
  2. 6
      components/footer-content.php
  3. 2
      components/navbar-category.php
  4. 4
      components/navbar-pages.php
  5. 4
      functions.php
  6. 20
      home.php
  7. 11
      scss/custom/_global.scss
  8. 2
      scss/custom/_previews.scss
  9. 34
      scss/mixins/_responsive.scss
  10. 16
      scss/utils/_display.scss
  11. 66
      style.css
  12. 17
      tag.php

4
category.php
Unescape View File

@ -11,7 +11,5 @@
</main>
<!-- Sidebar custom pour contenir la description -->
<aside class="sidebar">
<?php include(TEMPLATEPATH . '/components/sidebar-content.php'); ?>
</aside>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

6
components/footer-content.php
Unescape View File

@ -14,17 +14,17 @@
</ul>
</nav>
<div class="container columns">
<div class="col-md-4">
<div class="col-12 col-md-4">
<p>Les contenus sont diffusé sous licence Creative Common Attribution - Partage à l'Identique 4.0 - hors mention contraire.</p>
<p>Ces licences vous autorise à partager et copier mes travaux, tant que vous me citiez en source, et que vous autorisez la même chose pour les travaux qui en seraient dérivés. N'hésitez pas à partager ! <i class="text-red fa fa-heart" aria-hidden="true"></i></p>
</div>
<div class="col-md-4">
<div class="col-12 col-md-4">
<p>Ce site est propulsé par <a href="https://wordpress.org">Wordpress</a></p>
<p>Le <a href="https://git.kobold.cafe/quarante-douze/qdouze2-wordpress-theme">theme wordpress</a> de ce site est disponible sous licence CC BY-SA et GPL v3. Il utilise <a href="https://picturepan2.github.io/spectre/">Spectre</a> et <a href="https://forkawesome.github.io/Fork-Awesome/">Fork-Awesome</a>.</p>
</div>
<div class="col-md-4">
<div class="col-12 col-md-4">
<p>Toute critique, remarque, etc. est la bienvenue. Pour cela, vous pouvez me contacter à kazhnuz [at] kobold [point] cafe ou sur mes <a href="https://kazhnuz.space/links">réseaux sociaux</a></p>
</div>
</div>

2
components/navbar-category.php
Unescape View File

@ -1,4 +1,4 @@
<nav class="container menu toolbar bg-light fg-dark categories">
<nav class="container menu toolbar bg-light fg-dark categories d-none d-flex-sm">
<ul class="f-around">
<?php
$categories = get_categories( array(

4
components/navbar-pages.php
Unescape View File

@ -1,5 +1,5 @@
<div class="osd">
<nav class="container menu toolbar fg-light">
<nav class="container menu toolbar fg-light d-block d-flex-sm">
<ul>
<li>
<a href="<?php echo site_url(); ?>" class="menu-item">
@ -15,7 +15,7 @@
?>
</ul>
<ul class="f-end">
<ul class="f-end d-none d-flex-sm">
<?php
$listmenu = get_nav_menu_locations();
$menu = wp_get_nav_menu_items($listmenu['top-navbar-2']);

4
functions.php
Unescape View File

@ -150,7 +150,7 @@ function kspace_cat_breadcrumb_nav($categoryName, $icon) {
function kspace_cat_breadcrumb($categoryName, $icon) {
?>
<div class="flex-that">
<div class="flex-that d-none d-flex-sm">
<?php kspace_cat_breadcrumb_nav($categoryName, $icon); ?>
</div>
<?php
@ -158,7 +158,7 @@ function kspace_cat_breadcrumb($categoryName, $icon) {
function kspace_cat_breadcrumb_with_rss($categoryName, $icon, $categoryType, $rssLink) {
?>
<div class="flex-that">
<div class="flex-that d-none d-flex-sm">
<?php kspace_cat_breadcrumb_nav($categoryName, $icon); ?>
<div class="rss">
<a href="<?php echo $rssLink; ?>" class="btn btn-orange d-block m-0" /><i class="fa fa-rss" aria-hidden="true"></i><span class="sr-only">Flux RSS de <?php echo $categoryType; ?></span></a>

20
home.php
Unescape View File

@ -18,12 +18,30 @@
<?php if ( !is_paged() ) {
?>
<div class="toast mb-1 bg-blue" style="width:800px;margin:auto;"><strong class="m-0"><i class="fa fa-fw fa-info"></i> Note :</strong> Si vous êtes intéressé pour découvrir plus
<div class="toast mb-1 bg-blue home-toast"><strong class="m-0"><i class="fa fa-fw fa-info"></i> Note :</strong> Si vous êtes intéressé pour découvrir plus
de contenus trouvé sur internet, vous pouvez aussi regarder mon <a href="http://shaarli.kazhnuz.space/">Shaarli</a>, qui sert plus à
partager des petites découverte rigolote ou intéressantes.</div>
<?php
}
?>
<nav class="container menu bg-light fg-dark categories d-block d-none-sm">
<ul class="f-around">
<?php
$categories = get_categories( array(
'orderby' => 'name',
'order' => 'ASC'
) );
foreach( $categories as $category ) {?>
<li>
<a class="menu-item" href="<?php echo get_category_link($category->term_id) ?>"><span><i class="fa fa-fw fa-folder"></i> <?php echo $category->name ?></span></a>
</li>
<?php }
?>
</ul>
</nav>
</main>
<?php get_footer(); ?>

11
scss/custom/_global.scss
Unescape View File

@ -51,9 +51,10 @@ header h1 {
text-align:center;
img {
width: 800px;
max-width: 800px;
height: auto;
margin-top:0rem;
width: 100%;
}
a, a:visited, a:hover {
@ -102,7 +103,7 @@ header h1 {
"main"
"side";
@include xl() {
@include lg() {
grid-template-columns: auto 360px;
grid-template-areas: "main side";
}
@ -220,3 +221,9 @@ footer {
}
}
}
.home-toast {
max-width:800px;
width:100%;
margin:auto;
}

2
scss/custom/_previews.scss
Unescape View File

@ -31,7 +31,7 @@
margin-bottom: $lineheight;
}
}
@include lg() {
@include xl() {
.preview-thumbnail a {
width: 320px;
}

34
scss/mixins/_responsive.scss
Unescape View File

@ -48,3 +48,37 @@
max-width: $size;
margin:auto;
}
@mixin responsive() {
@content;
&-sm {
@include sm() {
@content;
}
}
&-md {
@include md() {
@content;
}
}
&-lg {
@include lg() {
@content;
}
}
&-xl {
@include xl() {
@content;
}
}
&-xxl {
@include xxl() {
@content;
}
}
}

16
scss/utils/_display.scss
Unescape View File

@ -1,3 +1,17 @@
.d-block {
display:block;
@include responsive() {
display: block!important;
}
}
.d-none {
@include responsive() {
display: none!important;
}
}
.d-flex {
@include responsive() {
display: flex!important;
}
}

66
style.css
Unescape View File

@ -2550,8 +2550,56 @@ textarea {
justify-content: space-between; }
.d-block {
display: block; }
display: block !important; }
@media (min-width: 576px) {
.d-block-sm {
display: block !important; } }
@media (min-width: 768px) {
.d-block-md {
display: block !important; } }
@media (min-width: 992px) {
.d-block-lg {
display: block !important; } }
@media (min-width: 1200px) {
.d-block-xl {
display: block !important; } }
@media (min-width: 1600px) {
.d-block-xxl {
display: block !important; } }
.d-none {
display: none !important; }
@media (min-width: 576px) {
.d-none-sm {
display: none !important; } }
@media (min-width: 768px) {
.d-none-md {
display: none !important; } }
@media (min-width: 992px) {
.d-none-lg {
display: none !important; } }
@media (min-width: 1200px) {
.d-none-xl {
display: none !important; } }
@media (min-width: 1600px) {
.d-none-xxl {
display: none !important; } }
.d-flex {
display: flex !important; }
@media (min-width: 576px) {
.d-flex-sm {
display: flex !important; } }
@media (min-width: 768px) {
.d-flex-md {
display: flex !important; } }
@media (min-width: 992px) {
.d-flex-lg {
display: flex !important; } }
@media (min-width: 1200px) {
.d-flex-xl {
display: flex !important; } }
@media (min-width: 1600px) {
.d-flex-xxl {
display: flex !important; } }
/* 4 - Custom styling
* Styles that are custom to this particular theme
**/
@ -2591,9 +2639,10 @@ header h1 {
margin: auto;
text-align: center; }
header h1 img {
width: 800px;
max-width: 800px;
height: auto;
margin-top: 0rem; }
margin-top: 0rem;
width: 100%; }
header h1 a, header h1 a:visited, header h1 a:hover {
background-color: transparent; }
@ -2635,7 +2684,7 @@ header h1 {
row-gap: 1.6rem;
column-gap: 3rem;
grid-template-areas: "main" "side"; }
@media (min-width: 1200px) {
@media (min-width: 992px) {
.container-blog {
grid-template-columns: auto 360px;
grid-template-areas: "main side"; } }
@ -2734,6 +2783,11 @@ footer {
footer .columns a:visited:visited {
color: #fefefe; }
.home-toast {
max-width: 800px;
width: 100%;
margin: auto; }
.preview-grid {
display: grid;
grid-template-columns: 1fr;
@ -2758,7 +2812,7 @@ footer {
align-items: center;
margin-bottom: 1.6rem; } }
@media (min-width: 992px) {
@media (min-width: 1200px) {
.preview-list .preview-thumbnail a {
width: 320px; } }

17
tag.php
Unescape View File

@ -5,20 +5,5 @@
?>
<?php include(TEMPLATEPATH . '/components/preview-list.php'); ?>
</main>
<!-- Sidebar custom pour contenir la description -->
<aside class="sidebar">
<div class="card head-info">
<div class="card-header"><i class="fa fa-fw fa-tag"></i> <?php echo single_cat_title(); ?></div>
<div class="card-body">
<?php echo tag_description();?>
<?php $infourl = get_term_meta(get_queried_object_id(), 'plus-dinfo', true);
if ($infourl != null) {
echo '<p class="align-center"><a href="' . $infourl . '" class="btn btn-readmore">Plus d\'info</a></p>';
}
?>
</div>
</div>
<?php include(TEMPLATEPATH . '/components/sidebar-content.php'); ?>
</aside>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Write Preview
Loading…
Cancel
Save