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

Reduce base64 encoded svg to single instance in compiled CSS

Browse Source
This commit is contained in:
Dan Head
2019-01-18 23:02:39 +00:00
parent 571ae4c195
commit 75775bd085
7 changed files with 23 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
css/avatar.css
View File

@@ -1,4 +1,6 @@
.avatar { .avatar {
position: absolute;
top: 0;
border-radius: var(--space-xxs); border-radius: var(--space-xxs);
transition: filter var(--transition-md) ease-out; transition: filter var(--transition-md) ease-out;
} }

6
css/comment.css
View File

@@ -8,12 +8,8 @@
} }
.comment__avatar { .comment__avatar {
background-image: var(--windy-svg);
background-position: center;
background-repeat: no-repeat;
background-size: 100%;
margin-right: var(--space-sm); margin-right: var(--space-sm);
height: var(--icon-size-xl); padding-bottom: 100%;
width: var(--icon-size-xl); width: var(--icon-size-xl);
} }

2
css/index.css
View File

File diff suppressed because one or more lines are too long

13
css/logo.css
View File

@@ -18,11 +18,12 @@
.logo__link { .logo__link {
display: block; display: block;
position: relative;
margin: 0 auto; margin: 0 auto;
max-width: 16rem; max-width: 16rem;
position: relative;
border-radius: 50%; border-radius: 50%;
transition: box-shadow var(--transition-fs) ease-out; transition: box-shadow var(--transition-fs) ease-out;
padding-bottom: 100%;
} }
.logo__link:focus { .logo__link:focus {
@@ -30,25 +31,15 @@
} }
.logo__link:before { .logo__link:before {
background-image: var(--windy-svg);
background-position: center;
background-repeat: no-repeat;
background-size: 100%;
content: "";
display: block;
filter: drop-shadow(0.2rem 0.2rem 0.2rem rgba(0, 0, 0, 0.5)); filter: drop-shadow(0.2rem 0.2rem 0.2rem rgba(0, 0, 0, 0.5));
padding-bottom: 100%;
width: 100%;
} }
.logo__image { .logo__image {
bottom: 0; bottom: 0;
display: block; display: block;
height: 100%;
left: 0; left: 0;
position: absolute; position: absolute;
right: 0; right: 0;
top: 0; top: 0;
transition: opacity var(--transition-sl) ease-out; transition: opacity var(--transition-sl) ease-out;
width: 100%;
} }

15
css/silhouette.css Normal file
View File

File diff suppressed because one or more lines are too long

2
theme/classes/walker.comments.php
View File

@@ -21,7 +21,7 @@ class Windycoys_Walker_Comments extends Walker_Comment {
$output .= '<li class="comments__item">'; $output .= '<li class="comments__item">';
$output .= '<div class="comment">'; $output .= '<div class="comment">';
$output .= '<div class="comment__head">'; $output .= '<div class="comment__head">';
$output .= sprintf('<div class="comment__avatar">%s</div>', $avatar); $output .= sprintf('<div class="comment__avatar has-silhouette">%s</div>', $avatar);
$output .= '<div class="comment__metadata">'; $output .= '<div class="comment__metadata">';
$output .= sprintf('<span class="comment__author">%s</span>', $author); $output .= sprintf('<span class="comment__author">%s</span>', $author);
$output .= sprintf('<span class="comment__date">%s</span>', $date); $output .= sprintf('<span class="comment__date">%s</span>', $date);

2
theme/partials/logo.php
View File

@@ -1,5 +1,5 @@
<div class="logo"> <div class="logo">
<a class="logo__link" href="<?php echo home_url(); ?>"> <a class="logo__link has-silhouette" href="<?php echo home_url(); ?>">
<img src="<?php echo get_template_directory_uri(); ?>/images/icon.png" alt="WindyCOYS logo" class="logo__image"> <img src="<?php echo get_template_directory_uri(); ?>/images/icon.png" alt="WindyCOYS logo" class="logo__image">
</a> </a>
</div> </div>