heymlz/hossein-por-shop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

admin rtl styles and bullshit

Browse Source
This commit is contained in:
Parsa Nazer
2025-02-23 04:06:44 +03:30
parent 1cb9741f0d
commit f9daff02d5
7 changed files with 318 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
backend/core/settings/base.py
+2 -2
View File
@@ -139,12 +139,12 @@ AUTH_PASSWORD_VALIDATORS = [
},
]
LANGUAGE_CODE = 'en-us'
LANGUAGE_CODE = 'fa'
TIME_ZONE = 'UTC'
USE_I18N = True
USE_L10N = True
USE_TZ = True
backend/core/settings/unfold_conf.py
+4 -2
View File
@@ -28,7 +28,9 @@ UNFOLD = {
"LOGIN": {
"image": lambda request: static("favicon.png"),
},
"STYLES": [
lambda request: static("rtl.css"),
],
"BORDER_RADIUS": "20px",
"SHOW_HISTORY": True,
@@ -80,7 +82,7 @@ UNFOLD = {
},
"SIDEBAR": {
"show_search": True,
"show_search": False,
"show_all_applications": True,
"navigation": [
{
backend/core/static/rtl.css
+287
View File
@@ -0,0 +1,287 @@
/* Base RTL adjustments */
[dir="rtl"] body {
direction: rtl;
text-align: right;
}
/* Headers and titles */
[dir="rtl"] .header,
[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] .branding h1 {
text-align: right;
}
/* Float adjustments */
[dir="rtl"] .float-left {
float: right !important;
}
[dir="rtl"] .float-right {
float: left !important;
}
/* Margins and paddings */
[dir="rtl"] .margin-left-10 {
margin-right: 10px !important;
margin-left: 0 !important;
}
[dir="rtl"] .margin-right-10 {
margin-left: 10px !important;
margin-right: 0 !important;
}
[dir="rtl"] .padding-left-15 {
padding-right: 15px !important;
padding-left: 0 !important;
}
[dir="rtl"] .padding-right-15 {
padding-left: 15px !important;
padding-right: 0 !important;
}
/* Form elements */
[dir="rtl"] .aligned label {
padding: 0 0 3px 1em;
float: right !important;
text-align: right;
}
[dir="rtl"] .form-row {
direction: rtl;
}
[dir="rtl"] .form-row .field-box {
float: right;
margin-right: 0;
margin-left: 10px;
}
[dir="rtl"] input,
[dir="rtl"] select,
[dir="rtl"] textarea {
direction: rtl;
}
/* Buttons and submit row */
[dir="rtl"] .submit-row {
text-align: left;
}
[dir="rtl"] .submit-row input,
[dir="rtl"] .button {
margin-left: 0;
margin-right: 10px;
}
/* Inline groups (e.g., tabular or stacked inlines) */
[dir="rtl"] .inline-group {
direction: rtl;
}
[dir="rtl"] .inline-related h3 {
text-align: right;
}
[dir="rtl"] .inline-related .inline_label {
float: right;
padding-right: 0;
padding-left: 10px;
}
/* Tables */
[dir="rtl"] table {
direction: rtl;
}
[dir="rtl"] th,
[dir="rtl"] td {
text-align: right;
}
[dir="rtl"] .sortoptions {
float: left;
}
/* Navigation and sidebar (Unfold-specific) */
[dir="rtl"] .unfold-sidebar {
right: unset;
left: 0;
}
[dir="rtl"] .unfold-main {
margin-left: 0;
margin-right: 260px; /* Adjust based on sidebar width */
}
[dir="rtl"] .unfold-nav {
direction: rtl;
text-align: right;
}
[dir="rtl"] .unfold-nav li {
text-align: right;
}
[dir="rtl"] .unfold-nav .dropdown-menu {
right: unset;
left: 0;
}
/* Breadcrumbs */
[dir="rtl"] .breadcrumbs {
direction: rtl;
text-align: right;
}
[dir="rtl"] .breadcrumbs a {
margin-right: 0;
margin-left: 5px;
}
/* Filters (right sidebar) */
[dir="rtl"] #changelist-filter {
float: left;
text-align: right;
}
[dir="rtl"] #changelist-filter h3 {
text-align: right;
}
[dir="rtl"] #changelist-filter li {
padding-right: 0;
padding-left: 10px;
}
/* Miscellaneous */
[dir="rtl"] .object-tools {
float: left;
}
[dir="rtl"] .paginator {
direction: rtl;
text-align: left;
}
/* Enhanced RTL adjustments for Unfold navigation links (specific to navbar) */
[dir="rtl"] .unfold-nav a {
direction: rtl;
justify-content: flex-end; /* Align flex items to the right */
}
[dir="rtl"] .unfold-nav .flex {
flex-direction: row-reverse !important; /* Reverse the order of flex items (icon, text, badge) for RTL */
}
[dir="rtl"] .unfold-nav .material-symbols-outlined {
margin-right: 0 !important; /* Remove default right margin */
margin-left: 0.75rem !important; /* Equivalent to Tailwind’s mr-3 in RTL (12px or 0.75rem) */
order: 2 !important; /* Place icon after text in flex direction */
}
[dir="rtl"] .unfold-nav .text-sm {
margin-right: 0.5rem !important; /* Space between text and badge (equivalent to Tailwind ml-2 in RTL) */
text-align: right;
direction: rtl;
order: 1 !important; /* Place text before badge in flex direction */
}
[dir="rtl"] .unfold-nav .bg-red-600 {
margin-left: 0 !important; /* Remove default left margin */
margin-right: 0 !important; /* No margin needed on right unless spacing is required */
order: 0 !important; /* Place badge first in flex direction (on the right in RTL) */
}
/* Ensure text alignment and direction for Persian */
[dir="rtl"] .unfold-nav .text-sm {
text-align: right;
direction: rtl;
}
/* RTL adjustments for navbar headers and expandable sections (including arrow icon) */
[dir="rtl"] .unfold-nav h2 {
direction: rtl;
text-align: right;
}
[dir="rtl"] .unfold-nav .flex-row {
flex-direction: row-reverse !important; /* Reverse flex direction for headers */
}
[dir="rtl"] .unfold-nav .material-symbols-outlined.ml-auto {
margin-left: 0 !important; /* Remove default left margin (Tailwind ml-auto) */
margin-right: auto !important; /* Push to the right in RTL */
transform: rotate(180deg) !important; /* Flip chevron_right for RTL (pointing left) */
order: 999 !important; /* Ensure it’s the last item in the flex order, on the right */
}
/* RTL adjustments for search bar and other navbar elements */
[dir="rtl"] #nav-filter {
direction: rtl;
text-align: right;
}
[dir="rtl"] .unfold-nav input[type="search"] {
padding-right: 0.75rem !important; /* Adjust padding for RTL */
padding-left: 2rem !important; /* Space for the search icon on the left */
}
[dir="rtl"] .unfold-nav .material-symbols-outlined.pl-3 {
padding-left: 0 !important; /* Remove padding-left */
padding-right: 0.75rem !important; /* Add padding-right for RTL */
}
[dir="rtl"] .mr-3 {
margin-left: .75rem !important;
margin-right: 0 !important;
}
/* badge fix */
[dir="rtl"] .bg-red-600 {
margin-left: 0rem !important;
margin-right: .5rem !important;
}
/* colapse fix */
[dir="rtl"] .ml-auto {
margin-left: 0rem !important;
margin-right: 8rem !important;
}
[dir="rtl"] .absolute.bottom-0.left-0.rounded.top-0 {
left: auto;
right: 0;
}
/* log out fix */
[dir="rtl"] nav.absolute.bg-white.border.flex.flex-col.leading-none.py-1.-right-2.rounded.shadow-lg.top-7.w-52.z-50.dark\:bg-base-800.dark\:border-base-700 {
right: auto; /* Remove -right-2 effect */
left: 0; /* Anchor to right edge (left in RTL) */
}
/* filter sprator fix */
[dir="rtl"] ul.dark\:bg-base-900.border.border-base-200.flex.min-w-20.rounded.shadow-sm.text-font-default-light.dark\:border-base-700.dark\:text-font-default-dark.w-full li {
border-right: none;
border-left: 1px solid #404040; /* Matches border-base-200 */
}
[dir="rtl"] ul.dark\:bg-base-900.border.border-base-200.flex.min-w-20.rounded.shadow-sm.text-font-default-light.dark\:border-base-700.dark\:text-font-default-dark.w-full li:last-child {
border-left: 0;
}
/* Dark mode override */
[dir="rtl"] .dark ul.dark\:bg-base-900.border.border-base-200.flex.min-w-20.rounded.shadow-sm.text-font-default-light.dark\:border-base-700.dark\:text-font-default-dark.w-full li {
border-left: 1px solid #374151; /* Matches dark:border-base-700 */
}
/* import export sprator fix */
/* Desktop RTL: Swap right borders to left borders */
[dir="rtl"] ul.border.flex.flex-col.font-medium.mb-4.mt-2.rounded.shadow-sm.md\:flex-row.md\:mb-2.md\:mt-0.dark\:border-base-700.max-md\:w-full li.md\:border-r {
border-right: none; /* Remove md:border-r */
border-left: 1px solid #404040; /* Add left border, matching border-base-200 default */
}
[dir="rtl"] ul.border.flex.flex-col.font-medium.mb-4.mt-2.rounded.shadow-sm.md\:flex-row.md\:mb-2.md\:mt-0.dark\:border-base-700.max-md\:w-full li:last-child {
border-left: 0; /* No left border on last item */
}
/* Dark mode for desktop RTL */
[dir="rtl"] .dark ul.border.flex.flex-col.font-medium.mb-4.mt-2.rounded.shadow-sm.md\:flex-row.md\:mb-2.md\:mt-0.dark\:border-base-700.max-md\:w-full li.md\:border-r {
border-left: 1px solid #374151; /* Matches dark:border-base-700 */
}
backend/core/views.py
+11 -11
View File
@@ -51,10 +51,10 @@ def random_data():
],
"kpi": [
{
"title": "IPhone 16 Pro Max",
"title": "گوشی Iphone 16 pro",
"metric": f"${intcomma(f"{random.uniform(1000, 9999):.02f}")}",
"footer": mark_safe(
f'<strong class="text-green-700 font-semibold dark:text-green-400">+{intcomma(f"{random.uniform(1, 9):.02f}")}%</strong>&nbsp;progress from last week'
f'<strong class="text-green-700 font-semibold dark:text-green-400">+{intcomma(f"{random.uniform(1, 9):.02f}")}%</strong>&nbsp;درصد فروش کل'
),
"chart": json.dumps(
{
@@ -64,23 +64,23 @@ def random_data():
),
},
{
"title": "Macbook Pro M3",
"title": "لپ تاپ Macbook Pro M3",
"metric": f"${intcomma(f"{random.uniform(1000, 9999):.02f}")}",
"footer": mark_safe(
f'<strong class="text-green-700 font-semibold dark:text-green-400">+{intcomma(f"{random.uniform(1, 9):.02f}")}%</strong>&nbsp;progress from last week'
f'<strong class="text-green-700 font-semibold dark:text-green-400">+{intcomma(f"{random.uniform(1, 9):.02f}")}%</strong>&nbsp;درصد فروش کل'
),
},
{
"title": "Apple Watch 8",
"title": "ساعت هوشمند Apple Watch 8",
"metric": f"${intcomma(f"{random.uniform(1000, 9999):.02f}")}",
"footer": mark_safe(
f'<strong class="text-green-700 font-semibold dark:text-green-400">+{intcomma(f"{random.uniform(1, 9):.02f}")}%</strong>&nbsp;progress from last week'
f'<strong class="text-green-700 font-semibold dark:text-green-400">+{intcomma(f"{random.uniform(1, 9):.02f}")}%</strong>&nbsp;درصد فروش کل'
),
},
],
"progress": [
{
"title": "📱 Phone and Mobile",
"title": "📱 موبایل و گوشی",
"description": "$2,499.99",
"value": 20,
},
@@ -155,10 +155,10 @@ def random_data():
),
"performance": [
{
"title": _("Last week revenue"),
"title": 'فروش ماه اخیر',
"metric": "$1,234.56",
"footer": mark_safe(
'<strong class="text-green-600 font-medium">+3.14%</strong>&nbsp;progress from last week'
'<strong class="text-green-600 font-medium">+3.14%</strong>&nbsp;درصد فروش کل'
),
"chart": json.dumps(
{
@@ -173,10 +173,10 @@ def random_data():
),
},
{
"title": _("Last week expenses"),
"title": 'مخارج ماه اخیر',
"metric": "$1,234.56",
"footer": mark_safe(
'<strong class="text-green-600 font-medium">+3.14%</strong>&nbsp;progress from last week'
'<strong class="text-green-600 font-medium">+3.14%</strong>&nbsp;درصد فروش کل'
),
"chart": json.dumps(
{