Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Enhance: dokan plugin header logo banner icon enhancement #2513

Merged
merged 8 commits into from
Jan 28, 2025
Merged

Enhance: dokan plugin header logo banner icon enhancement #2513

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
2578f56
update: remove upgrade banner & version tag badge design
osmansufy Jan 6, 2025
a170b6b
update: icon css update
osmansufy Jan 7, 2025
b3c800e
update: box-shadow change in menu icon dropdown
osmansufy Jan 8, 2025
a1185a4
update: shadow of dropdown
osmansufy Jan 13, 2025
c49795e
update: bg coulor
osmansufy Jan 13, 2025
a32bc6a
update: base 64 encoded string for dokan icon
osmansufy Jan 20, 2025
d93c676
update: remove list-style-type
osmansufy Jan 22, 2025
7eefdbf
update: pro version tag css
osmansufy Jan 24, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
31 changes: 16 additions & 15 deletions assets/src/less/admin.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,37 +36,38 @@
margin-right: 24px;
flex: 1;
.version-tag {

border-radius: 20px;
font-size: 1rem;
line-height: 20px;
font-weight: 400;
padding: 0.5rem 1rem;
max-height: 2rem;
font-size: 12px;
line-height: 16px;
font-weight: 500;
height: 30px;
box-sizing: border-box;
&.lite {
background: #FF9B5366;
color: #7B4E2E;
display: flex;
align-items: center;
padding: 0 12px;
}

&.pro {
background: #D8D8FE;
color: @dokan-color;
color: #7047EB;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Use LESS variable for color value

The color value is hardcoded, which reduces maintainability. Consider using the existing @dokan-color variable or defining a new semantic variable for consistent theming.

-                color: #7047EB;
+                color: @dokan-pro-color; // Define this variable in variables.less

Also applies to: 59-61

display: flex;
align-items: center;
gap: 8px;
text-transform: capitalize;
font-weight: 450;
padding: 6px;
padding-right: 12px;
gap: 6px;
& .version-tag-pro-badge{
background: @dokan-color;
background: #7047EB;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Maintain color consistency with variables

The background color is hardcoded, which should use the same variable as the text color for consistency. The spacing and size adjustments look good.

-                    background: #7047EB;
+                    background: @dokan-pro-color; // Use the same variable as text color

Also applies to: 68-70

color: white;
border-radius: 28px;
display: inline-flex;
align-items: center;
padding: 3px 9px;
font-size: 16px;
margin: -10px 0 -10px -10px;
padding: 3px 8px;
font-size: 12px;
gap: 3px;
}
}
}
Expand Down Expand Up @@ -148,7 +149,7 @@
.dropdown {
opacity: 1;
visibility: visible;
top: 42px;
top: 50px;
}
}

Expand All @@ -162,7 +163,7 @@
padding: 20px;
border-radius: 3px;
border: 1px solid #e2e2e2;
box-shadow: 0 6px 12px rgb(129 129 129 / 6%);
box-shadow: 0 8px 10px #ccc;
min-width: 255px;
max-width: 255px;
opacity: 0;
Expand Down
8 changes: 8 additions & 0 deletions assets/src/less/global-admin.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -364,3 +364,11 @@
}
}
}



// wp dokan logo styles

#adminmenu #toplevel_page_dokan .wp-menu-image.svg {
background-size: 17px;
}
6 changes: 5 additions & 1 deletion includes/Admin/Menu.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,11 @@ public function add_admin_menu() {
$withdraw_text = sprintf( __( 'Withdraw %s', 'dokan-lite' ), '<span class="awaiting-mod count-1"><span class="pending-count">' . $withdraw['pending'] . '</span></span>' );
}

$dashboard = add_menu_page( __( 'Dokan', 'dokan-lite' ), __( 'Dokan', 'dokan-lite' ), $capability, $slug, [ $this, 'dashboard' ], 'data:image/svg+xml;base64,' . base64_encode( '<svg xmlns="http://www.w3.org/2000/svg" width="52" height="62" fill="#fff"><path opacity=".5" d="M36.265 29.552c-.043 10.6-4.597 21.543-14.007 26.521C15.64 59.592 0 62.295 0 50.837V8.181C0 1.83 5.371-.273 10.742.028c7.992.429 15.64 4.163 20.281 11.029 2.965 4.377 4.597 9.656 5.113 14.977.043 1.201.129 2.36.129 3.519z"/><path d="M51.088 25.819c-.902-8.754-6.273-16.093-13.707-20.513-4.287-2.569-9.511-3.458-12.924.218-1.104 1.189-1.818 2.742-2.593 4.168L1.332 47.404c-1.89 3.478-1.46 6.352.258 8.712 2.578 3.519 7.691 5.107 11.859 5.536 3.867.429 7.777 0 11.515-.858 11.3-2.575 21.312-10.256 24.706-21.414 1.332-4.377 1.891-8.969 1.418-13.561z"/></svg>' ), $menu_position );
$dashboard = add_menu_page( __( 'Dokan', 'dokan-lite' ), __( 'Dokan', 'dokan-lite' ), $capability, $slug, [ $this, 'dashboard' ], 'data:image/svg+xml;base64,' . base64_encode( '<svg width="15" height="18" viewBox="0 0 15 18" fill="none" xmlns="http://www.w3.org/2000/svg">
osmansufy marked this conversation as resolved.
Show resolved Hide resolved
<path d="M10.5458 8.60465C10.5333 11.6909 9.20883 14.8772 6.47242 16.3266C4.54819 17.3512 0 18.1384 0 14.8022C0 14.8022 0 2.39462 0 2.38213C0 0.532865 1.56188 -0.079392 3.12376 0.0080732C5.44783 0.133024 7.67195 1.22009 9.02141 3.2193C9.88357 4.49379 10.3584 6.03068 10.5083 7.58006C10.5208 7.92992 10.5458 8.26729 10.5458 8.60465Z" fill="#9EA3A8" fill-opacity="0.5"/>
<path d="M14.8562 7.51766C14.5938 4.96867 13.032 2.83202 10.8703 1.54503C9.43339 0.682875 7.63411 0.470461 6.69698 2.19478C6.69698 2.20727 0.38699 13.8027 0.38699 13.8027C-0.162791 14.8148 -0.0378402 15.6519 0.461961 16.3392C1.21166 17.3637 2.69857 17.8261 3.91059 17.951C5.03514 18.076 6.17219 17.951 7.25926 17.7011C10.5455 16.9514 13.4568 14.7148 14.4439 11.4661C14.8312 10.1916 14.9937 8.85463 14.8562 7.51766Z" fill="#9EA3A8"/>
<path d="M6.47237 16.3393C9.20878 14.8774 10.5333 11.6912 10.5457 8.61741C10.5457 8.28005 10.5333 7.94268 10.4958 7.60532C10.3583 6.05593 9.87102 4.51904 9.00886 3.24455C8.53405 2.53233 7.94678 1.94507 7.28454 1.45776C7.07213 1.64519 6.87221 1.89509 6.70977 2.20747C6.70977 2.21996 0.399784 13.8153 0.399784 13.8153C-0.0125525 14.565 -0.0375448 15.2273 0.174871 15.8021C0.174871 15.8146 0.187366 15.827 0.187366 15.8395C0.199862 15.8645 0.212355 15.902 0.22485 15.927C0.237345 15.952 0.237347 15.9645 0.249842 15.9895C0.249842 16.002 0.262337 16.0145 0.262337 16.0145C1.24944 17.9137 4.82302 17.214 6.47237 16.3393Z" fill="#9EA3A8"/>
</svg>' ), $menu_position );

if ( current_user_can( $capability ) ) {
$submenu[ $slug ][] = [ __( 'Dashboard', 'dokan-lite' ), $capability, 'admin.php?page=' . $slug . '#/' ];
Expand Down
6 changes: 3 additions & 3 deletions src/admin/pages/ChangeLog.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<div class="dokan-notice">
<h2></h2>
<AdminNotice></AdminNotice>
<UpgradeBanner v-if="! hasPro"></UpgradeBanner>
<!-- <UpgradeBanner v-if="! hasPro"></UpgradeBanner>-->
</div>
<div class="change-log" :class="hasPro ? 'pro-change-log' : 'lite-change-log'" id="change-log">
<h3>{{ __( 'Dokan Changelog', 'dokan-lite' ) }}</h3>
Expand Down Expand Up @@ -98,14 +98,14 @@ let Loading = dokan_get_lib('Loading');
let AdminNotice = dokan_get_lib('AdminNotice');

import $ from 'jquery';
import UpgradeBanner from "admin/components/UpgradeBanner.vue";
// import UpgradeBanner from "admin/components/UpgradeBanner.vue";

export default {
name: 'ChangeLog',

components: {
Loading,
UpgradeBanner,
// UpgradeBanner,
AdminNotice,
},

Expand Down
6 changes: 3 additions & 3 deletions src/admin/pages/Dashboard.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<div class="dokan-dashboard">
<h1>{{ __( 'Dashboard', 'dokan-lite' ) }}</h1>
<AdminNotice></AdminNotice>
<UpgradeBanner v-if="! hasPro"></UpgradeBanner>
<!-- <UpgradeBanner v-if="! hasPro"></UpgradeBanner>-->

<div class="widgets-wrapper">

Expand Down Expand Up @@ -125,7 +125,7 @@ let Currency = dokan_get_lib('Currency');
let AdminNotice = dokan_get_lib('AdminNotice');

import Chart from "admin/components/Chart.vue"
import UpgradeBanner from "admin/components/UpgradeBanner.vue"
// import UpgradeBanner from "admin/components/UpgradeBanner.vue"

export default {

Expand All @@ -136,7 +136,7 @@ export default {
Loading,
Chart,
Currency,
UpgradeBanner,
// UpgradeBanner,
AdminNotice,
},

Expand Down
6 changes: 3 additions & 3 deletions src/admin/pages/Help.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<div class="dokan-help-page">
<h1>{{ __( 'Help', 'dokan-lite' ) }}</h1>
<AdminNotice></AdminNotice>
<UpgradeBanner v-if="! hasPro"></UpgradeBanner>
<!-- <UpgradeBanner v-if="! hasPro"></UpgradeBanner>-->

<div class="section-wrapper" v-if="docs !== null">
<postbox v-for="(section, index) in docs" :title="section.title" :key="index">
Expand All @@ -25,7 +25,7 @@ let Postbox = dokan_get_lib('Postbox');
let Loading = dokan_get_lib('Loading');
let AdminNotice = dokan_get_lib('AdminNotice');

import UpgradeBanner from "admin/components/UpgradeBanner.vue";
// import UpgradeBanner from "admin/components/UpgradeBanner.vue";

export default {

Expand All @@ -34,7 +34,7 @@ export default {
components: {
Postbox,
Loading,
UpgradeBanner,
// UpgradeBanner,
AdminNotice
},

Expand Down
6 changes: 3 additions & 3 deletions src/admin/pages/Settings.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<div class="dokan-settings">
<h1 style="margin-bottom: 15px;">{{ __( 'Settings', 'dokan-lite' ) }}</h1>
<AdminNotice></AdminNotice>
<UpgradeBanner v-if="! hasPro"></UpgradeBanner>
<!-- <UpgradeBanner v-if="! hasPro"></UpgradeBanner>-->

<div id="setting-message_updated" class="settings-error notice is-dismissible" :class="{ 'updated' : isUpdated, 'error' : !isUpdated }" v-if="isSaved">
<p><strong v-html="message"></strong></p>
Expand Down Expand Up @@ -209,7 +209,7 @@

import Fields from "admin/components/Fields.vue"
import SettingsBanner from "admin/components/SettingsBanner.vue";
import UpgradeBanner from "admin/components/UpgradeBanner.vue";
// import UpgradeBanner from "admin/components/UpgradeBanner.vue";
import MobileSettingsDrawer from "admin/components/Settings/MobileSettingsList.vue";

export default {
Expand All @@ -222,7 +222,7 @@
Fields,
Loading,
SettingsBanner,
UpgradeBanner,
// UpgradeBanner,
AdminNotice,
},

Expand Down
6 changes: 3 additions & 3 deletions src/admin/pages/Vendors.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@

<AdminNotice></AdminNotice>

<UpgradeBanner v-if="! hasPro"></UpgradeBanner>
<!-- <UpgradeBanner v-if="! hasPro"></UpgradeBanner>-->

<hr class="wp-header-end">

Expand Down Expand Up @@ -100,7 +100,7 @@

<script>
import AddVendor from './AddVendor.vue'
import UpgradeBanner from "admin/components/UpgradeBanner.vue";
// import UpgradeBanner from "admin/components/UpgradeBanner.vue";

let ListTable = dokan_get_lib('ListTable');
let Switches = dokan_get_lib('Switches');
Expand All @@ -116,7 +116,7 @@ export default {
Switches,
Search,
AddVendor,
UpgradeBanner,
// UpgradeBanner,
AdminNotice,
},

Expand Down
6 changes: 3 additions & 3 deletions src/admin/pages/Withdraw.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<div class="withdraw-requests">
<h1>{{ __( 'Withdraw Requests', 'dokan-lite' ) }}</h1>
<AdminNotice></AdminNotice>
<UpgradeBanner v-if="! hasPro"></UpgradeBanner>
<!-- <UpgradeBanner v-if="! hasPro"></UpgradeBanner>-->

<modal
:title="__( 'Update Note', 'dokan-lite' )"
Expand Down Expand Up @@ -161,7 +161,7 @@ let AdminNotice = dokan_get_lib('AdminNotice');
const DateRangePicker = dokan_get_lib('DateRangePicker');

import $ from 'jquery';
import UpgradeBanner from "admin/components/UpgradeBanner.vue";
// import UpgradeBanner from "admin/components/UpgradeBanner.vue";

export default {

Expand All @@ -171,7 +171,7 @@ export default {
ListTable,
Modal,
Currency,
UpgradeBanner,
// UpgradeBanner,
AdminNotice,
DateRangePicker,
},
Expand Down
4 changes: 2 additions & 2 deletions templates/admin-header.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,8 +29,8 @@
dokan_get_template_part(
'svg-icons/pro-award', null,
[
'width' => 20,
'height' => 20,
'width' => 16,
'height' => 16,
]
);
?>
Expand Down
Loading