Skip to content

Commit

Permalink
Merge pull request #2665 from brkcvn/master
Browse files Browse the repository at this point in the history 
Responsive control
  • Loading branch information
@brkcvn
brkcvn committed Oct 11, 2022
2 parents 900b493 + fc24758 commit 762aad5
Show file tree
Hide file tree
Showing 6 changed files with 93 additions and 23 deletions.
51 changes: 46 additions & 5 deletions public/css/app.css
View file
Expand Up @@ -47162,6 +47162,18 @@ html[dir='rtl'] .el-scrollbar__wrap {
.el-range-editor.el-input__inner {
width: 100%;
}
/* apex-chart cash-flow */
.apex-chart-cash-flow .apexcharts-legend {
width: 24rem !important;
-ms-flex-pack: distribute !important;
justify-content: space-around !important;
padding: 0;
}

.apex-chart-cash-flow .apexcharts-toolbar {
top: 45px !important;
}
/* apex-chart cash-flow */
}
/* element-ui */

Expand Down Expand Up @@ -47241,13 +47253,25 @@ html[dir="rtl"] .lines-radius-border thead td:last-child {

@media only screen and (max-width: 480px) {
.small-table-width {
width: 450px;
width: 550px;
}

.small-col {
width: auto !important;
}

.description-col {
width: 180px !important
}

.amount-col {
width: 70px !important;
}

.name-col {
width: 6rem !important
}

.information-content {
-webkit-transform: unset !important;
transform: unset !important;
Expand Down Expand Up @@ -49918,6 +49942,14 @@ body{
position: absolute;
}

.lg\:relative{
position: relative;
}

.lg\:right-0{
right: 0px;
}

.lg\:right-24{
right: 6rem;
}
Expand Down Expand Up @@ -49948,6 +49980,10 @@ body{
margin-top: 1rem;
}

.lg\:mt-11{
margin-top: 2.75rem;
}

.lg\:mt-60{
margin-top: 15rem;
}
Expand Down Expand Up @@ -50074,6 +50110,10 @@ body{
width: 66.666667%;
}

.lg\:w-auto{
width: auto;
}

.lg\:w-1\/4{
width: 25%;
}
Expand All @@ -50094,10 +50134,6 @@ body{
width: 24rem;
}

.lg\:w-auto{
width: auto;
}

.lg\:w-2\/4{
width: 50%;
}
Expand Down Expand Up @@ -50158,6 +50194,11 @@ body{
justify-content: center;
}

.lg\:justify-around{
-ms-flex-pack: distribute;
justify-content: space-around;
}

.lg\:gap-16{
gap: 4rem;
}
Expand Down
25 changes: 24 additions & 1 deletion resources/assets/sass/app.css
View file
Expand Up @@ -459,6 +459,17 @@ html[dir='rtl'] .el-scrollbar__wrap {
.el-range-editor.el-input__inner {
width: 100%;
}
/* apex-chart cash-flow */
.apex-chart-cash-flow .apexcharts-legend {
width: 24rem !important;
justify-content: space-around !important;
padding: 0;
}

.apex-chart-cash-flow .apexcharts-toolbar {
top: 45px !important;
}
/* apex-chart cash-flow */
}
/* element-ui */

Expand Down Expand Up @@ -529,13 +540,25 @@ html[dir="rtl"] .lines-radius-border thead td:last-child {

@media only screen and (max-width: 480px) {
.small-table-width {
width: 450px;
width: 550px;
}

.small-col {
width: auto !important;
}

.description-col {
width: 180px !important
}

.amount-col {
width: 70px !important;
}

.name-col {
width: 6rem !important
}

.information-content {
transform: unset !important;
margin-top: 70px !important;
Expand Down
6 changes: 3 additions & 3 deletions resources/views/components/documents/form/items.blade.php
View file
Expand Up @@ -4,11 +4,11 @@
<table class="small-table-width" id="items">
<colgroup>
<col class="small-col" style="width: 24px;">
<col class="small-col" style="width: 20%;">
<col class="small-col" style="width: 30%;">
<col class="small-col name-col" style="width: 20%;">
<col class="small-col description-col" style="width: 30%;">
<col class="small-col" style="width: 12%;">
<col class="small-col" style="width: 15%;">
<col class="small-col" style="width: 20%;">
<col class="small-col amount-col" style="width: 20%;">
<col class="small-col" style="width: 24px;">
</colgroup>

Expand Down
8 changes: 5 additions & 3 deletions resources/views/components/documents/form/line-item.blade.php
View file
Expand Up @@ -8,10 +8,10 @@
<colgroup>
<col class="small-col" style="width: 24px;">
<col class="small-col" style="width: 20%;">
<col class="small-col" style="width: 30%;">
<col class="small-col description-col" style="width: 30%;">
<col class="small-col" style="width: 12%;">
<col class="small-col" style="width: 15%;">
<col class="small-col" style="width: 20%;">
<col class="small-col amount-col" style="width: 20%;">
<col class="small-col" style="width: 24px;">
</colgroup>

Expand All @@ -30,7 +30,9 @@

<td class="px-3 py-3 ltr:pl-2 rtl:pr-2 ltr:text-left rtl:text-right align-middle border-b-0 name">
@if (! $hideItemName)
<span class="flex items-center text-sm" tabindex="0" v-html="row.name" v-if="row.item_id"></span>
<span class="flex items-center text-sm" tabindex="0" v-if="row.item_id">
<div v-html="row.name" class="w-20 lg:w-auto truncate"></div>
</span>

<div v-else>
@stack('name_input_start')
Expand Down
22 changes: 11 additions & 11 deletions resources/views/widgets/cash_flow.blade.php
View file
@@ -1,48 +1,48 @@
<div id="widget-{{ $class->model->id }}" class="w-full my-8 px-12">
@include($class->views['header'], ['header_class' => ''])

<div class="flex flex-col lg:flex-row mt-3">
<div class="w-full lg:w-11/12">
<div class="flex flex-col-reverse lg:flex-row mt-3">
<div class="w-full lg:w-11/12 apex-chart-cash-flow">
{!! $chart->container() !!}
</div>

<div class="w-full lg:w-1/12 mt-11 space-y-2">
<div class="flex flex-col items-center justify-between text-center">
<div class="w-96 lg:w-1/12 flex flex-row lg:flex-col items-center justify-around sm:justify-start lg:mt-11 space-y-0 sm:space-y-2">
<div class="relative flex flex-col items-center sm:justify-between text-center">
<div class="flex justify-end lg:block text-lg">
<x-tooltip id="tooltip-cashflow-incoming" placement="top" message="{{ $totals['incoming_exact'] }}">
{{ $totals['incoming_for_humans'] }}
</x-tooltip>
</div>

<span class="text-green text-xs">
<span class="text-green text-xs hidden lg:block">
{{ trans('general.incoming') }}
</span>

<span class="material-icons mt-2">remove</span>
<span class="absolute lg:relative material-icons mt-2 -right-12 lg:right-0">remove</span>
</div>

<div class="flex flex-col items-center justify-between">
<div class="relative flex flex-col items-center sm:justify-between">
<div class="flex justify-end lg:block text-lg">
<x-tooltip id="tooltip-cashflow-outgoing" placement="top" message="{{ $totals['outgoing_exact'] }}">
{{ $totals['outgoing_for_humans'] }}
</x-tooltip>
</div>

<span class="text-rose text-xs">
<span class="text-rose text-xs hidden lg:block">
{{ trans('general.outgoing') }}
</span>

<span class="material-icons mt-2">drag_handle</span>
<span class="absolute lg:relative material-icons mt-2 -right-12 lg:right-0">drag_handle</span>
</div>

<div class="flex flex-col items-center justify-between">
<div class="relative flex flex-col items-center sm:justify-between">
<div class="flex justify-end lg:block text-lg">
<x-tooltip id="tooltip-cashflow-profit" placement="top" message="{{ $totals['profit_exact'] }}">
{{ $totals['profit_for_humans'] }}
</x-tooltip>
</div>

<span class="text-purple text-xs">{{ trans_choice('general.profits', 1) }}</span>
<span class="text-purple text-xs hidden lg:block">{{ trans_choice('general.profits', 1) }}</span>
</div>
</div>
</div>
Expand Down
4 changes: 4 additions & 0 deletions safelist.txt
View file
Expand Up @@ -5,5 +5,9 @@ lg:my-12
lg:mt-4
lg:pl-6
lg:w-9
lg:mt-11
lg:relative
lg:right-0
lg:justify-around
ltr:-right-1.5
rtl:-left-1.5

0 comments on commit 762aad5

Please sign in to comment.