Optimize logo in settings page

WPDevelopers · Apr 4, 2017 · 2531e8d · 2531e8d
1 parent 2c8384e
commit 2531e8d
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 12 deletions.
diff --git a/src/EmbedPress/Ends/Back/Settings.php b/src/EmbedPress/Ends/Back/Settings.php
@@ -162,10 +162,11 @@ public static function renderForm()
         ?>
         <div id="embedpress-settings-wrapper">
             <header>
-                <a href="//wordpress.org/plugins/embedpress" target="_blank" rel="noopener noreferrer" title="EmbedPress" class="presshack-logo">
-                    <img width="35" src="//pressshack.com/wp-content/uploads/2016/05/embedpress-150x150.png">
-                </a>
-                <h1>EmbedPress</h1>
+                <h1 class="pressshack-title">
+                    <a href="//wordpress.org/plugins/embedpress" target="_blank" rel="noopener noreferrer" title="EmbedPress">
+                        EmbedPress
+                    </a>
+                </h1>
             </header>
 
             <?php settings_errors(); ?>

diff --git a/src/assets/css/admin.css b/src/assets/css/admin.css
@@ -60,23 +60,30 @@
  */
 
 #embedpress-settings-wrapper {
-    margin-top: 20px;
+    margin-top: 15px;
 }
 
-#embedpress-settings-wrapper > header > * {
+#embedpress-settings-wrapper > header .pressshack-title {
     display: inline-block;
+    padding: 10px 0 10px 55px;
+    background-image: url(../images/icon-128x128.png);
+    background-size: 45px auto;
+    background-position: left center;
+    background-repeat: no-repeat;
+    background-color: transparent;
 }
 
 #embedpress-settings-wrapper > header h1 {
     margin: .67em 0 15px .15em;
+    font-weight: 600;
+    font-size: 2em;
 }
 
-#embedpress-settings-wrapper a:hover img {
-    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
-    filter: alpha(opacity=80);
-    -moz-opacity: .80;
-    -khtml-opacity: .80;
-    opacity: .80;
+#embedpress-settings-wrapper > header h1 a,
+#embedpress-settings-wrapper > header h1 a:hover,
+#embedpress-settings-wrapper > header h1 a:focus,
+#embedpress-settings-wrapper > header h1 a:active {
+    color: #23282d;
 }
 
 #embedpress-settings-wrapper .nav-tab-wrapper .nav-tab-active {

diff --git a/src/assets/images/icon-128x128.png b/src/assets/images/icon-128x128.png