dan/windycoys
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix layout issues in Webkit browsers

Browse Source
This commit is contained in:
Dan Head
2018-12-15 17:38:37 +00:00
parent 662507a84a
commit 7632b4058e
7 changed files with 34 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
css/content.css
View File

@@ -1,6 +1,5 @@
.content { .content {
border-bottom: 1px solid var(--color-light-grey); border-bottom: 1px solid var(--color-light-grey);
margin-bottom: var(--space-md);
padding-bottom: var(--space-md); padding-bottom: var(--space-md);
} }

12
css/page.css
View File

@@ -27,7 +27,8 @@
@media (--viewport-lg) { @media (--viewport-lg) {
.page { .page {
grid-template-columns: 224px 1fr; grid-template-columns: 224px 1fr;
grid-template-rows: 60px 134px; grid-template-rows: 60px 134px 1fr;
grid-auto-rows: auto;
grid-gap: var(--space-md); grid-gap: var(--space-md);
padding: 0 var(--space-md); padding: 0 var(--space-md);
} }
@@ -45,16 +46,15 @@
.page__content, .page__content,
.page__article { .page__article {
grid-column-start: 2; grid-column-start: 2;
}
.page__content,
.page__article.is-first {
grid-row: span 2; grid-row: span 2;
} }
.page__metadata { .page__metadata {
grid-column-start: 1; grid-column-start: 1;
grid-row: span 2;
}
.page__metadata.is-first {
grid-row: span 1;
} }
.page__pagination, .page__pagination,

4
theme/index.php
View File

@@ -4,7 +4,7 @@
<?php get_template_part('partials/logo') ?> <?php get_template_part('partials/logo') ?>
</section> </section>
<?php while ( have_posts() ) : the_post(); $index++; ?> <?php while ( have_posts() ) : the_post(); $index++; ?>
<section class="page__article"> <section class="page__article<?php echo ($index === 1 ? ' is-first' : '') ?>">
<article class="article"> <article class="article">
<div class="article__date"> <div class="article__date">
<svg class="icon"> <svg class="icon">
@@ -24,7 +24,7 @@
</div> </div>
</article> </article>
</section> </section>
<section class="page__metadata<?php echo ($index === 1 ? ' is-first' : '') ?>"> <section class="page__metadata">
<?php get_template_part('partials/metadata') ?> <?php get_template_part('partials/metadata') ?>
</section> </section>
<?php endwhile; ?> <?php endwhile; ?>

19
theme/page.php
View File

@@ -4,27 +4,22 @@
<?php get_template_part('partials/logo') ?> <?php get_template_part('partials/logo') ?>
</section> </section>
<?php if (have_posts()): while (have_posts()) : the_post(); ?> <?php if (have_posts()): while (have_posts()) : the_post(); ?>
<section class="page__article"> <section class="page__content">
<article class="article"> <div class="content">
<div class="article__content">
<h1 class="title"> <h1 class="title">
<a href="<?php the_permalink(); ?>">
<?php the_title(); ?> <?php the_title(); ?>
</a>
</h1> </h1>
<?php the_content(__('Continue reading <span class="meta-nav">&raquo;</span>', 'windycoys')); ?> <?php the_content(); ?>
</div>
</div> </div>
</article>
</section> </section>
<?php endwhile; ?> <?php endwhile; ?>
<?php else: ?> <?php else: ?>
<section class="page__article"> <section class="page__content">
<article class="article"> <div class="content">
<h1 class="article__title">Sorry, there is no article to display</h1> <h1 class="title">Sorry, there is no article to display</h1>
<div class="article__content">
<a class="link" href="<?php echo get_site_url() ?>/">Go back home</a> <a class="link" href="<?php echo get_site_url() ?>/">Go back home</a>
</div> </div>
</article>
</section> </section>
<?php endif; ?> <?php endif; ?>
<section class="page__banner"> <section class="page__banner">

8
theme/search.php
View File

@@ -56,13 +56,11 @@ get_header();
<?php get_template_part('partials/pagination') ?> <?php get_template_part('partials/pagination') ?>
</section> </section>
<?php else: ?> <?php else: ?>
<section class="page__article"> <section class="page__content">
<article class="article"> <div class="content">
<h1 class="article__title">Sorry, no results found.</h1> <h1 class="title">Sorry, no results found.</h1>
<div class="article__content">
<a class="link" href="<?php echo get_site_url() ?>/">Go back home</a> <a class="link" href="<?php echo get_site_url() ?>/">Go back home</a>
</div> </div>
</article>
</section> </section>
<?php endif; ?> <?php endif; ?>
<section class="page__banner"> <section class="page__banner">

8
theme/single.php
View File

@@ -4,7 +4,7 @@
<?php get_template_part('partials/logo') ?> <?php get_template_part('partials/logo') ?>
</section> </section>
<?php if (have_posts()): while (have_posts()) : the_post(); ?> <?php if (have_posts()): while (have_posts()) : the_post(); ?>
<section class="page__article"> <section class="page__article is-first">
<article class="article"> <article class="article">
<div class="article__date"> <div class="article__date">
<svg class="icon"> <svg class="icon">
@@ -25,14 +25,14 @@
</div> </div>
</article> </article>
</section> </section>
<section class="page__metadata is-first"> <section class="page__metadata">
<?php get_template_part('partials/metadata') ?> <?php get_template_part('partials/metadata') ?>
</section> </section>
<?php endwhile; ?> <?php endwhile; ?>
<?php else: ?> <?php else: ?>
<section class="page__article"> <section class="page__article is-first">
<article class="article"> <article class="article">
<h1 class="article__title">Sorry, there is no article to display</h1> <h1 class="title">Sorry, there is no article to display</h1>
<div class="article__content"> <div class="article__content">
<a class="link" href="<?php get_site_url() ?>/">Go back home</a> <a class="link" href="<?php get_site_url() ?>/">Go back home</a>
</div> </div>

8
theme/tag.php
View File

@@ -57,13 +57,11 @@
<?php get_template_part('partials/pagination') ?> <?php get_template_part('partials/pagination') ?>
</section> </section>
<?php else: ?> <?php else: ?>
<section class="page__article"> <section class="page__content">
<article class="article"> <div class="content">
<h1 class="article__title">Sorry, no results found.</h1> <h1 class="title">Sorry, no results found.</h1>
<div class="article__content">
<a class="link" href="<?php echo get_site_url() ?>/">Go back home</a> <a class="link" href="<?php echo get_site_url() ?>/">Go back home</a>
</div> </div>
</article>
</section> </section>
<?php endif; ?> <?php endif; ?>
<section class="page__banner"> <section class="page__banner">