2
0
mirror of https://github.com/frappe/books.git synced 2024-11-08 23:00:56 +00:00

change left/right->start/end to support rtl

This commit is contained in:
zaqoutabed 2023-01-07 13:55:31 +03:00
parent bf944817cd
commit 09dba75370
35 changed files with 92 additions and 78 deletions

View File

@ -17,7 +17,7 @@
/>
<!-- Buttons -->
<div class="mr-2 flex gap-2">
<div class="me-2 flex gap-2">
<!-- Upload Button -->
<button v-if="!value" class="bg-gray-300 p-0.5 rounded" @click="upload">
<FeatherIcon name="upload" class="h-4 w-4 text-gray-600" />

View File

@ -12,7 +12,7 @@
{{ df.label }}
</div>
<div
class="flex items-center justify-between pr-2 rounded"
class="flex items-center justify-between pe-2 rounded"
:class="containerClasses"
>
<input

View File

@ -4,7 +4,7 @@
class="flex items-center"
:class="spaceBetween ? 'justify-between' : ''"
>
<div class="mr-3" :class="labelClasses" v-if="showLabel && !labelRight">
<div class="me-3" :class="labelClasses" v-if="showLabel && !labelRight">
{{ df.label }}
</div>
<div
@ -66,7 +66,7 @@
@focus="(e) => $emit('focus', e)"
/>
</div>
<div class="ml-3" :class="labelClasses" v-if="showLabel && labelRight">
<div class="ms-3" :class="labelClasses" v-if="showLabel && labelRight">
{{ df.label }}
</div>
</label>

View File

@ -13,7 +13,7 @@
<div class="flex items-center">
<div
v-if="value"
class="w-3 h-3 rounded mr-1"
class="w-3 h-3 rounded me-1"
:style="{ backgroundColor: value }"
></div>
<span v-if="value">

View File

@ -23,7 +23,7 @@
<button
v-if="!isReadOnly"
class="p-0.5 rounded -mr-1 ml-1"
class="p-0.5 rounded -mr-1 ms-1"
:class="showMandatory ? 'bg-red-300' : 'bg-gray-300'"
@click="togglePopover"
>

View File

@ -171,7 +171,7 @@
<button
v-if="showClear"
class="text-xs text-gray-600 hover:text-gray-600 ml-auto"
class="text-xs text-gray-600 hover:text-gray-600 ms-auto"
@click="clearClicked"
>
{{ t`Clear` }}

View File

@ -26,7 +26,7 @@
</div>
<button
class="bg-green100 px-2 ml-1 -mr-0.5 h-full border-l"
class="bg-green100 px-2 ms-1 -mr-0.5 h-full border-l"
@click="swap"
v-if="!disabled"
>

View File

@ -101,7 +101,7 @@ export default {
component: markRaw({
template:
'<div class="flex items-center font-semibold">{{ t`Create` }}' +
'<Badge color="blue" class="ml-2" v-if="isNewValue">{{ linkValue }}</Badge>' +
'<Badge color="blue" class="ms-2" v-if="isNewValue">{{ linkValue }}</Badge>' +
'</div>',
computed: {
linkValue: () => this.linkValue,

View File

@ -9,7 +9,7 @@
:ratio="ratio"
class="border-b px-2 text-gray-600 w-full flex items-center"
>
<div class="flex items-center pl-2">#</div>
<div class="flex items-center ps-2">#</div>
<div
class="items-center flex px-2 h-row-mid"
:class="{
@ -58,7 +58,7 @@
v-if="!isReadOnly"
@click="addRow"
>
<div class="flex items-center pl-1">
<div class="flex items-center ps-1">
<feather-icon name="plus" class="w-4 h-4 text-gray-500" />
</div>
<div class="flex justify-between px-2" :style="`grid-column: 2 / ${ratio.length + 1}`">

View File

@ -14,7 +14,7 @@
"
>
<!-- Index or Remove button -->
<div class="flex items-center pl-2 text-gray-600">
<div class="flex items-center ps-2 text-gray-600">
<span class="hidden" :class="{ 'group-hover:inline-block': !readOnly }">
<feather-icon
name="x"
@ -50,7 +50,7 @@
<!-- Error Display -->
<div
class="text-xs text-red-600 pl-2 col-span-full relative"
class="text-xs text-red-600 ps-2 col-span-full relative"
style="bottom: 0.75rem; height: 0px"
v-if="hasErrors"
>

View File

@ -8,7 +8,7 @@
<Button :icon="true" @click="togglePopover()">
<span class="flex items-center">
<Icon name="filter" size="12" class="stroke-current text-gray-700" />
<span class="ml-1">
<span class="ms-1">
<template v-if="activeFilterCount > 0">
{{ filterAppliedMessage }}
</template>
@ -116,7 +116,7 @@
@click="addNewFilter"
>
<feather-icon name="plus" class="w-4 h-4" />
<span class="ml-2">{{ t`Add a filter` }}</span>
<span class="ms-2">{{ t`Add a filter` }}</span>
</div>
</div>
</template>

View File

@ -1,8 +1,8 @@
<template>
<button @click="openHelpLink" class="flex items-center z-10">
<p class="mr-1"><slot></slot></p>
<p class="me-1"><slot></slot></p>
<FeatherIcon
class="h-5 w-5 ml-3 text-blue-400"
class="h-5 w-5 ms-3 text-blue-400"
name="help-circle"
v-if="icon"
/>

View File

@ -1,6 +1,6 @@
<template>
<div
class="absolute bottom-0 flex justify-end pb-6 pr-6"
class="absolute bottom-0 flex justify-end pb-6 pe-6"
:style="{ width: fullWidth ? '100%' : 'calc(100% - 12rem)' }"
v-if="open && !close"
>
@ -27,7 +27,7 @@
<div class="w-full flex flex-row items-center">
<!-- Loading Bar BG -->
<div
class="w-full h-3 mr-2 rounded"
class="w-full h-3 me-2 rounded"
:class="percent >= 0 ? 'bg-gray-200' : 'bg-gray-300'"
>
<!-- Loading Bar -->
@ -45,7 +45,7 @@
class="
w-4
h-4
ml-auto
ms-auto
text-gray-600
cursor-pointer
hover:text-gray-800

View File

@ -1,6 +1,6 @@
<template>
<div class="p-3 d-flex align-items-center">
<indicator :color="indicatorColor" class="mr-2 ml-1" />
<indicator :color="indicatorColor" class="me-2 ms-1" />
{{ message }}
</div>
</template>

View File

@ -10,16 +10,16 @@
<div
v-if="!sidebar && platform === 'Mac'"
class="h-full"
:class="sidebar ? '' : 'w-tl mr-4 border-r'"
:class="sidebar ? '' : 'w-tl me-4 border-r'"
/>
</Transition>
<h1 class="text-xl font-semibold select-none" v-if="title">
{{ title }}
</h1>
<div class="flex items-stretch window-no-drag gap-2 ml-auto">
<div class="flex items-stretch window-no-drag gap-2 ms-auto">
<slot />
<div class="border-r" v-if="showBorder" />
<BackLink v-if="backLink" class="window-no-drag" />
<BackLink v-if="backLink" class="window-no-drag rtl-rotate-180" />
<SearchBar v-if="!hideSearch" />
</div>
</div>

View File

@ -104,19 +104,19 @@
</div>
</div>
<div class="w-1/2">
<div class="flex pl-2 justify-between py-3 border-b">
<div class="flex ps-2 justify-between py-3 border-b">
<div>{{ t`Subtotal` }}</div>
<div>{{ printObject.netTotal }}</div>
</div>
<div
class="flex pl-2 justify-between py-3 border-b"
class="flex ps-2 justify-between py-3 border-b"
v-if="printObject.totalDiscount && !printObject.discountAfterTax"
>
<div>{{ t`Discount` }}</div>
<div>{{ printObject.totalDiscount }}</div>
</div>
<div
class="flex pl-2 justify-between py-3"
class="flex ps-2 justify-between py-3"
v-for="tax in printObject.taxes"
:key="tax.name"
>
@ -124,7 +124,7 @@
<div>{{ tax.amount }}</div>
</div>
<div
class="flex pl-2 justify-between py-3 border-t"
class="flex ps-2 justify-between py-3 border-t"
v-if="printObject.totalDiscount && printObject.discountAfterTax"
>
<div>{{ t`Discount` }}</div>
@ -133,7 +133,7 @@
<div
class="
flex
pl-2
ps-2
justify-between
py-3
border-t

View File

@ -12,7 +12,7 @@
</h2>
<div class="flex items-center">
<div class="flex items-center rounded h-16">
<div class="mr-4" v-if="printObject.displayLogo">
<div class="me-4" v-if="printObject.displayLogo">
<img class="h-12 max-w-32 object-contain" :src="printObject.logo" />
</div>
</div>
@ -86,7 +86,7 @@
</div>
<div class="mt-12">
<div class="flex -mx-3">
<div class="flex justify-end flex-1 py-3 bg-gray-100 gap-8 pr-6">
<div class="flex justify-end flex-1 py-3 bg-gray-100 gap-8 pe-6">
<div class="text-right">
<div class="text-gray-800">{{ t`Subtotal` }}</div>
<div class="text-xl mt-2">

View File

@ -19,7 +19,7 @@
<div class="flex items-center justify-between w-full">
<div class="flex items-center">
<div class="flex items-center rounded h-16">
<div class="mr-4" v-if="printObject.displayLogo">
<div class="me-4" v-if="printObject.displayLogo">
<img
class="h-12 max-w-32 object-contain"
:src="printObject.logo"
@ -81,16 +81,16 @@
font-semibold
tracking-widest
text-gray-800
ml-8
ms-8
"
>
{{ printObject.isSalesInvoice ? 'From' : 'To' }}
</div>
<div class="mt-4 ml-8 text-black leading-relaxed text-lg">
<div class="mt-4 ms-8 text-black leading-relaxed text-lg">
{{ printObject.address }}
</div>
<div
class="mt-4 ml-8 text-black leading-relaxed text-lg"
class="mt-4 ms-8 text-black leading-relaxed text-lg"
v-if="printObject.gstin"
>
GSTIN: {{ printObject.gstin }}
@ -141,19 +141,19 @@
</div>
</div>
<div class="w-1/2 text-lg">
<div class="flex pl-2 justify-between py-1">
<div class="flex ps-2 justify-between py-1">
<div>{{ t`Subtotal` }}</div>
<div>{{ printObject.netTotal }}</div>
</div>
<div
class="flex pl-2 justify-between py-1"
class="flex ps-2 justify-between py-1"
v-if="printObject.totalDiscount && !printObject.discountAfterTax"
>
<div>{{ t`Discount` }}</div>
<div>{{ printObject.totalDiscount }}</div>
</div>
<div
class="flex pl-2 justify-between py-1"
class="flex ps-2 justify-between py-1"
v-for="tax in printObject.taxes"
:key="tax.name"
>
@ -161,14 +161,14 @@
<div>{{ tax.amount }}</div>
</div>
<div
class="flex pl-2 justify-between py-1"
class="flex ps-2 justify-between py-1"
v-if="printObject.totalDiscount && printObject.discountAfterTax"
>
<div>{{ t`Discount` }}</div>
<div>{{ printObject.totalDiscount }}</div>
</div>
<div
class="flex pl-2 justify-between py-1 font-semibold"
class="flex ps-2 justify-between py-1 font-semibold"
:style="{ color: printObject.color }"
>
<div>{{ t`Grand Total` }}</div>

View File

@ -2,9 +2,9 @@
<div>
<!-- Search Bar Button -->
<Button @click="open" class="px-2" :padding="false">
<feather-icon name="search" class="w-4 h-4 mr-1 text-gray-800" />
<feather-icon name="search" class="w-4 h-4 me-1 text-gray-800" />
<p>{{ t`Search` }}</p>
<div class="text-gray-500 px-1 ml-4 text-sm">
<div class="text-gray-500 px-1 ms-4 text-sm">
{{ modKey('k') }}
</div>
</Button>
@ -67,7 +67,7 @@
>
{{ si.label }}
</p>
<p class="text-gray-600 text-sm ml-3" v-if="si.group === 'Docs'">
<p class="text-gray-600 text-sm ms-3" v-if="si.group === 'Docs'">
{{ si.more.filter(Boolean).join(', ') }}
</p>
</div>
@ -157,17 +157,17 @@
class="flex items-center hover:text-gray-800"
@click="openDocs"
>
<feather-icon name="help-circle" class="w-4 h-4 mr-1" />
<feather-icon name="help-circle" class="w-4 h-4 me-1" />
{{ t`Help` }}
</button>
</div>
<p v-if="searcher?.numSearches" class="ml-auto">
<p v-if="searcher?.numSearches" class="ms-auto">
{{ t`${suggestions.length} out of ${searcher.numSearches}` }}
</p>
<div
class="border border-gray-100 rounded flex justify-self-end ml-2"
class="border border-gray-100 rounded flex justify-self-end ms-2"
v-if="(searcher?.numSearches ?? 0) > 50"
>
<template

View File

@ -44,7 +44,7 @@
:class="isGroupActive(group) && !group.items ? '-ml-1' : ''"
/>
<div
class="ml-2 text-lg text-gray-900"
class="ms-2 text-lg text-gray-900"
:class="isGroupActive(group) && !group.items && 'text-blue-600'"
>
{{ group.label }}
@ -59,7 +59,7 @@
class="
text-base text-gray-800
h-10
pl-10
ps-10
cursor-pointer
flex
items-center
@ -141,12 +141,13 @@
class="
absolute
bottom-0
right-0
end-0
text-gray-600
hover:bg-gray-100
rounded
p-1
m-4
rtl-rotate-180
"
@click="$emit('toggle-sidebar')"
>

View File

@ -17,7 +17,7 @@
:style="{ opacity }"
v-if="show"
>
<feather-icon :name="iconName" class="w-6 h-6 mr-3" :class="iconColor" />
<feather-icon :name="iconName" class="w-6 h-6 me-3" :class="iconColor" />
<div @click="actionClicked" :class="actionText ? 'cursor-pointer' : ''">
<p class="text-base">{{ message }}</p>
<button
@ -29,7 +29,7 @@
</div>
<feather-icon
name="x"
class="w-4 h-4 ml-auto text-gray-600 cursor-pointer hover:text-gray-800"
class="w-4 h-4 ms-auto text-gray-600 cursor-pointer hover:text-gray-800"
@click="closeToast"
/>
</div>

View File

@ -63,12 +63,12 @@
height: getFieldHeight(df),
}"
>
<div class="pl-4 flex text-gray-600">
<div class="ps-4 flex text-gray-600">
{{ df.label }}
</div>
<div
class="py-2 pr-4"
class="py-2 pe-4"
@click="activateInlineEditing(df)"
:class="{
'pl-2': df.fieldtype === 'AttachImage',
@ -87,7 +87,7 @@
@new-doc="async (newdoc) => await onChange(df, newdoc.name)"
/>
<div
class="text-sm text-red-600 mt-2 pl-2"
class="text-sm text-red-600 mt-2 ps-2"
v-if="errors[df.fieldname]"
>
{{ errors[df.fieldname] }}

View File

@ -3,7 +3,7 @@
class="window-drag flex items-center border-b text-gray-900 border-gray-100"
style="height: 28px"
>
<Fb class="ml-2" />
<Fb class="ms-2" />
<p class="mx-auto text-sm" v-if="companyName && dbPath">
{{ companyName }} - {{ dbPath }}
</p>

View File

@ -25,7 +25,7 @@
items-center
border-b
flex-shrink-0
pr-4
pe-4
"
:class="[
account.level !== 0 ? 'text-base' : 'text-lg',
@ -37,14 +37,14 @@
<component :is="getIconComponent(account)" />
<div class="flex items-baseline">
<div
class="ml-4"
class="ms-4"
:class="[!account.parentAccount && 'font-semibold']"
>
{{ account.name }}
</div>
<!-- Add Account Buttons on Group Hover -->
<div v-if="account.isGroup" class="ml-6 hidden group-hover:block">
<div v-if="account.isGroup" class="ms-6 hidden group-hover:block">
<button
class="
text-xs text-gray-800
@ -57,7 +57,7 @@
</button>
<button
class="
ml-3
ms-3
text-xs text-gray-800
hover:text-gray-900
focus:outline-none
@ -70,7 +70,7 @@
</div>
<!-- Account Balance String -->
<p class="ml-auto text-base text-gray-800" v-if="!account.isGroup">
<p class="ms-auto text-base text-gray-800" v-if="!account.isGroup">
{{ getBalanceString(account) }}
</p>
</div>
@ -96,7 +96,7 @@
<component
:is="getIconComponent({ isGroup: account.addingGroupAccount })"
/>
<div class="flex ml-4 h-row-mid items-center">
<div class="flex ms-4 h-row-mid items-center">
<input
class="focus:outline-none bg-transparent"
:class="{ 'text-gray-600': insertingAccount }"
@ -113,7 +113,7 @@
<button
v-if="!insertingAccount"
class="
ml-4
ms-4
text-xs text-gray-800
hover:text-gray-900
focus:outline-none
@ -127,7 +127,7 @@
<button
v-if="!insertingAccount"
class="
ml-4
ms-4
text-xs text-gray-800
hover:text-gray-900
focus:outline-none

View File

@ -19,10 +19,10 @@
@mouseleave="active = null"
>
<div class="w-3 h-3 rounded-sm flex-shrink-0" :class="d.class" />
<p class="ml-2 overflow-x-auto whitespace-nowrap no-scrollbar w-28">
<p class="ms-2 overflow-x-auto whitespace-nowrap no-scrollbar w-28">
{{ d.account }}
</p>
<p class="whitespace-nowrap flex-shrink-0 ml-auto">
<p class="whitespace-nowrap flex-shrink-0 ms-auto">
{{ fyo.format(d?.total ?? 0, 'Currency') }}
</p>
</div>

View File

@ -29,7 +29,7 @@
@keydown.enter="selectHighlightedItem"
>
{{ periodSelectorMap?.[value] ?? value }}
<feather-icon name="chevron-down" class="ml-1 w-3 h-3" />
<feather-icon name="chevron-down" class="ms-1 w-3 h-3" />
</div>
</template>
</Dropdown>

View File

@ -38,7 +38,7 @@
/>
<p
class="text-base ml-2"
class="text-base ms-2"
:class="fileName ? 'text-gray-900 font-semibold' : 'text-gray-700'"
>
<span v-if="fileName" class="font-normal"
@ -88,7 +88,7 @@
items-center
gap-2
bg-gray-100
pl-2
ps-2
rounded
text-gray-900
w-40
@ -277,7 +277,7 @@
"
>
<FeatherIcon name="plus" class="w-4 h-4" />
<p class="pl-4">
<p class="ps-4">
{{ t`Add Row` }}
</p>
</button>
@ -306,7 +306,7 @@
<div
v-for="(n, i) in names"
:key="'name-' + i"
class="grid grid-cols-2 gap-2 border-b pb-2 mb-2 pr-4 text-lg w-60"
class="grid grid-cols-2 gap-2 border-b pb-2 mb-2 pe-4 text-lg w-60"
style="grid-template-columns: 2rem auto"
>
<p class="text-right">{{ i + 1 }}.</p>

View File

@ -107,7 +107,7 @@
</div>
<button
class="
ml-auto
ms-auto
p-2
hover:bg-red-200
rounded-full

View File

@ -53,7 +53,7 @@
<Button
v-if="item.documentation"
class="leading-tight"
:class="{ 'ml-4': item.action }"
:class="{ 'ms-4': item.action }"
@click="handleDocumentation(item)"
>
<span class="text-base">

View File

@ -145,7 +145,7 @@
</div>
<!-- Totals -->
<div class="w-1/2 gap-2 flex flex-col self-end ml-auto">
<div class="w-1/2 gap-2 flex flex-col self-end ms-auto">
<!-- Subtotal -->
<div class="flex justify-between">
<div>{{ t`Subtotal` }}</div>

View File

@ -119,7 +119,7 @@
/>
<!-- Debit and Credit -->
<div class="w-1/2 gap-2 flex flex-col self-end font-semibold ml-auto">
<div class="w-1/2 gap-2 flex flex-col self-end font-semibold ms-auto">
<div class="flex justify-between text-green-600">
<div>{{ t`Total Debit` }}</div>
<div>{{ totalDebit }}</div>

View File

@ -25,7 +25,7 @@
flex
"
:class="{
'ml-auto': isNumeric(column.fieldtype),
'ms-auto': isNumeric(column.fieldtype),
'pr-4': i === columns.length - 1,
}"
>

View File

@ -13,7 +13,7 @@
<Button :icon="true" @click="routeToPrevious">
<feather-icon name="x" class="w-4 h-4" />
</Button>
<span v-if="statusText" class="ml-2 text-base text-gray-600">{{
<span v-if="statusText" class="ms-2 text-base text-gray-600">{{
statusText
}}</span>
</div>
@ -55,7 +55,7 @@
>
<FormControl
v-if="imageField"
class="ml-4"
class="ms-4"
:df="imageField"
:value="doc[imageField.fieldname]"
@change="(value) => valueChange(imageField, value)"
@ -63,7 +63,7 @@
/>
<FormControl
v-if="titleField"
:class="!!imageField ? 'mr-4' : 'w-full mx-4'"
:class="!!imageField ? 'me-4' : 'w-full mx-4'"
:input-class="[
'font-semibold text-xl',
!!imageField ? '' : 'text-center',

View File

@ -168,3 +168,11 @@ input[type='number']::-webkit-inner-spin-button {
.quickedit-leave-active {
transition: all 150ms ease-out;
}
/*
RTL
*/
[dir="rtl"] .rtl-rotate-180{
transform: rotate(180deg);
}

View File

@ -11754,6 +11754,11 @@ table@^6.0.9:
string-width "^4.2.3"
strip-ansi "^6.0.1"
tailwindcss-rtl@^0.9.0:
version "0.9.0"
resolved "https://registry.yarnpkg.com/tailwindcss-rtl/-/tailwindcss-rtl-0.9.0.tgz#270da04492081620478ebf73819fc285fe724a54"
integrity sha512-y7yC8QXjluDBEFMSX33tV6xMYrf0B3sa+tOB5JSQb6/G6laBU313a+Z+qxu55M1Qyn8tDMttjomsA8IsJD+k+w==
"tailwindcss@npm:@tailwindcss/postcss7-compat":
version "2.2.17"
resolved "https://registry.yarnpkg.com/@tailwindcss/postcss7-compat/-/postcss7-compat-2.2.17.tgz#dc78f3880a2af84163150ff426a39e42b9ae8922"