use svg logo and icon in header, favicon Xubuntu#3

svg images from xubuntu-website-assets are cropped and optimized with svgomg.
PeterTheOne · May 21, 2020 · ea92d97 · ea92d97
1 parent 57a9a4e
commit ea92d97
Show file tree

Hide file tree

Showing 5 changed files with 22 additions and 3 deletions.
diff --git a/xubuntu-eighteen/header.php b/xubuntu-eighteen/header.php
@@ -9,6 +9,7 @@
 	<meta name="author" content="The Xubuntu community" />
 	<meta name="viewport" content="width=device-width, maximum-scale=1.0, minimum-scale=1.0, initial-scale=1" />
 
+  <link rel="icon" type="image/svg+xml" href="<?php echo get_stylesheet_directory_uri( ); ?>/images/xubuntu-icon.svg">
 	<link rel="shortcut icon" href="<?php echo get_stylesheet_directory_uri( ); ?>/images/xubuntu-icon-16.png">
 
 	<?php wp_head( ); ?>
@@ -19,7 +20,7 @@
 <header>
 	<div id="logo">
 		<a href="<?php echo home_url( '/' ); ?>">
-			<img class="light" src="<?php echo get_stylesheet_directory_uri( ); ?>/images/xubuntu-logo-45.png" alt="Xubuntu" />
+			<img class="light" src="<?php echo get_stylesheet_directory_uri( ); ?>/images/xubuntu-logo.svg" alt="Xubuntu" />
 		</a>
 	</div>
 

diff --git a/xubuntu-eighteen/images/xubuntu-icon.svg b/xubuntu-eighteen/images/xubuntu-icon.svg
diff --git a/xubuntu-eighteen/images/xubuntu-logo.svg b/xubuntu-eighteen/images/xubuntu-logo.svg
diff --git a/xubuntu-eighteen/style-600.css b/xubuntu-eighteen/style-600.css
@@ -27,6 +27,7 @@ header {
 	}
 		#logo a img.light {
 			display: block;
+			width: 13.5rem;
 		}
 		#logo a::after {
 			display: none;

diff --git a/xubuntu-eighteen/style.css b/xubuntu-eighteen/style.css
@@ -70,7 +70,7 @@ header {
 
 			padding-right: 30px;
 
-			background: transparent url(images/xubuntu-icon-20.png) 100% 50% no-repeat;
+			background: transparent url(images/xubuntu-icon.svg) 100% 50% / 1.25rem 1.25rem no-repeat;
 			content: "Xubuntu";
 
 			color: #fff;
@@ -104,7 +104,7 @@ header {
 
 /*
  *  Main content area
- * 
+ *
  */
 
 section#middle {