Some design changes.

* Some design changes.
* Custom Profile Avatar logo changed.

Author: en0ndev

about.php

@@ -2,7 +2,7 @@
 
 /**
  ** about.php
- ** @version 1.0.1
+ ** @version 1.0.2
  ** @since 1.0
  ** @author en0ndev
  */
@@ -24,8 +24,8 @@
 */
 defined('ABSPATH') || exit; // Exit if accessed directly 
 
-$template = "<div class='about'><p class='big'>Custom Profile Avatar</p>";
-$template .= "<p>" . esc_html__('Version', 'custom-profile-avatar') . ": 1.0.1</p>";
+$template = "<div class='about'><img src='" . plugin_dir_url(__FILE__) . "/assets/img/icon-128x128.png' alt='Custom Profile Avatar' /><p class='big'>Custom Profile Avatar</p>";
+$template .= "<p>" . esc_html__('Version', 'custom-profile-avatar') . ": 1.0.2</p>";
 $template .= "<p>" . esc_html__('Developer', 'custom-profile-avatar') .  ": en0ndev</p>";
 $template .= "<a class='link' target='_blank' href='https://www.youtube.com/channel/UC3CSOAThanO-LvYKFwJ24RQ'>" . esc_html__('My YouTube Channel', 'custom-profile-avatar') . "</a></div>";
 

assets/css/style.css

@@ -1,6 +1,6 @@
 /**
 ** File: style.css
-** Version: 1.0.1
+** Version: 1.0.2
 ** Since: 1.0
 ** Author: en0ndev
 
@@ -20,21 +20,26 @@ You should have received a copy of the GNU General Public License
 along with Custom Profile Avatar.  If not, see <https://www.gnu.org/licenses/>.
 */
 
+@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,500;0,700;1,300&display=swap');
 body {
     background: #ddd;
     user-select: none;
-    line-height: 30px;
+    line-height: normal !important;
+}
+
+#wpbody * {
+    line-height: normal !important;
+    font-family: 'Ubuntu', sans-serif;
 }
 
 #author__by {
     background: #000;
     padding: 5px 20px;
     border-radius: 30px;
-    box-shadow: 1px 1px 5px 1px #000;
+    box-shadow: 1px 1px 5px 1px rgba(0, 0, 0, .6);
     position: absolute;
-    left: 15px;
-    bottom: 15px;
-    font-family: 'Ubuntu', sans-serif;
+    left: 11px;
+    bottom: 11px;
 }
 
 #author__by a {
@@ -46,10 +51,10 @@ body {
 #author__by .bold {
     color: #fff;
     font-weight: 700;
+    padding: 1px 0;
 }
 
 #author__by .bold:hover {
-    padding-bottom: 1px;
     border-bottom: 2px solid #fff;
 }
 
@@ -92,10 +97,10 @@ input[type="button"],
     font-size: 22pt;
     background: #000;
     color: #fff;
-    padding: 10px 30px;
+    padding: 3px 30px;
     border-radius: 15px;
-    margin-top: .7em;
-    margin-bottom: .7em;
+    margin-top: 22px;
+    margin-bottom: 22px;
 }
 
 .inner__area h2 {
@@ -127,9 +132,10 @@ input[type="button"],
     background: #000;
     transition: background-color .5s, color .5s;
     cursor: pointer;
-    margin-top: .8em;
-    margin-bottom: .8em;
+    margin-top: 22px;
+    margin-bottom: 22px;
     font-size: 15px;
+    font-weight: 500;
 }
 
 .main__area input[type="button"]:hover,
@@ -144,6 +150,10 @@ input[type="button"],
 
 .user__avatar {
     position: relative;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
 }
 
 .remove {
@@ -152,7 +162,8 @@ input[type="button"],
     width: 35px;
     height: 35px;
     position: absolute;
-    right: -5px;
+    right: 5px;
+    top: 0;
     cursor: pointer;
     justify-content: center;
     align-items: center;
@@ -176,18 +187,31 @@ input[type="button"],
 
 .about>p,
 .about>a {
-    font-size: 15px;
+    font-size: 16px;
     font-weight: 500;
     color: #000;
+    margin: 22px 0;
+}
+
+.about img {
+    border-radius: 0;
+    box-shadow: none;
 }
 
 .about>.big {
-    font-size: 20px;
-    font-weight: 600;
+    font-size: 26px;
+    font-weight: 700;
 }
 
 .about>.link {
     color: #2271b1;
+    text-decoration: none;
+    padding: 2px 0;
+    border-bottom: 2px solid #2271b1;
+}
+
+.about>.link:hover {
+    border-bottom: 4px solid #2271b1;
 }
 
 #notf {
@@ -209,4 +233,25 @@ input[type="button"],
 
 .err {
     border-left: 7px solid rgb(170, 14, 14);
+}
+
+.rate__box {
+    background: #f8f8f8;
+    display: inline-block;
+    padding: 10px 15px;
+    border-radius: 20px;
+    box-shadow: 1px 1px 5px 1px rgba(0, 0, 0, .3);
+    /*position: absolute;
+    left: 11px;*/
+    margin-top: 22px;
+}
+
+.rate__box a {
+    color: #000;
+    text-decoration: none;
+}
+
+#save {
+    margin-bottom: 0;
+    /* for .rate__box */
 }

assets/img/icon-128x128.png

@@ -1,6 +1,6 @@
 /**
 ** File: modules.js
-** Version: 1.0.1
+** Version: 1.0.2
 ** Since: 1.0
 ** Author: en0ndev
 This file is part of Custom Profile Avatar.

assets/img/icon.png

@@ -4,7 +4,7 @@
 Plugin Name: Custom Profile Avatar
 Plugin URI: https://wordpress.org/plugins/custom-profile-avatar
 Description: Change profile avatar to your custom avatar.
-Version: 1.0.1
+Version: 1.0.2
 Author: en0ndev
 Author URI: https://github.com/en0ndev
 Text Domain: custom-profile-avatar
@@ -32,8 +32,8 @@
 require_once __DIR__ . '/modules/get_avatar.php';
 require_once __DIR__ . '/modules/get_styles.php';
 
-function cpa_load_textdomain()
+/*function cpa_load_textdomain()
 {
     load_plugin_textdomain('custom-profile-avatar', false, basename(dirname(__FILE__)) . '/languages/');
 }
-add_action('plugins_loaded', 'cpa_load_textdomain');
+add_action('plugins_loaded', 'cpa_load_textdomain');*/