refs #1861 document create page styling..

This commit is contained in:
Cüneyt Şentürk 2021-02-28 12:46:53 +03:00
parent 37839e12d9
commit 286ee540ef
4 changed files with 64 additions and 43 deletions

53
public/css/custom.css vendored
View File

@ -1500,47 +1500,68 @@ table .align-items-center td span.badge {
margin-top: -50px !important; margin-top: -50px !important;
} }
.document-50 { .document-item-40-px {
width: 50%; width: 40px;
} }
.document-30 { .document-item-10 {
width: 30%; width: 10%;
} }
.document-25 { .document-item-20 {
width: 20%;
}
.document-item-25 {
width: 25%; width: 25%;
} }
.document-40-px { .document-item-30 {
width: 30%;
}
.document-total-50 {
width: 50%;
}
.document-total-30 {
width: 30%;
}
.document-total-25 {
width: 25%;
}
.document-total-40-px {
width: 40px; width: 40px;
} }
@media (max-width: 575.98px) { @media (max-width: 575.98px) {
.document-50 { table#items {
min-width: 700px !important ;
}
.document-total-50 {
width: 20%; width: 20%;
} }
.document-30 { .document-total-30 {
width: 40%; width: 40%;
} }
.document-25 { .document-total-25 {
width: 35%; width: 35%;
} }
.document-40-px { .document-total-40-px {
max-width: 1px; max-width: 1px;
width: 1px; width: 1px;
padding: 0; padding: 0;
margin: 0; margin: 0;
} }
#invoice-total-rows td.border-bottom-0.pb-0, .item-add-new button.btn.btn-link.w-100 {
#invoice-total-rows .border-top-0.pt-0.pb-0 { text-align: left;
max-width: 1px !important; padding-left: 15%;
width: 1px !important;
padding: 0 !important;
margin: 0 !important;
} }
} }

View File

@ -7,19 +7,19 @@
<div class="table-responsive overflow-x-scroll overflow-y-hidden"> <div class="table-responsive overflow-x-scroll overflow-y-hidden">
<table class="table" id="items" style="table-layout: fixed"> <table class="table" id="items" style="table-layout: fixed">
<colgroup> <colgroup>
<col style="width: 40px;"> <col class="document-item-40-px">
<col style="width: 25%;"> <col class="document-item-25">
<col style="width: 30%;"> <col class="document-item-30 description">
<col style="width: 10%;"> <col class="document-item-10">
<col style="width: 10%;"> <col class="document-item-10">
<col style="width: 20%;"> <col class="document-item-20">
<col style="width: 40px;"> <col class="document-item-40-px">
</colgroup> </colgroup>
<thead class="thead-light"> <thead class="thead-light">
<tr> <tr>
@stack('move_th_start') @stack('move_th_start')
<th class="border-top-0 border-right-0 border-bottom-0" style="max-width: 40px"> <th class="border-top-0 border-right-0 border-bottom-0" style="max-width: 40px">
<div ></div> <div></div>
</th> </th>
@stack('move_th_end') @stack('move_th_end')
@ -61,7 +61,7 @@
@stack('remove_th_start') @stack('remove_th_start')
<th class="border-top-0 border-right-0 border-bottom-0" style="max-width: 40px"> <th class="border-top-0 border-right-0 border-bottom-0" style="max-width: 40px">
<div ></div> <div></div>
</th> </th>
@stack('remove_th_end') @stack('remove_th_end')
</tr> </tr>

View File

@ -6,18 +6,18 @@
colspan="7"> colspan="7">
<table class="w-100"> <table class="w-100">
<colgroup> <colgroup>
<col style="width: 40px;"> <col class="document-item-40-px">
<col style="width: 25%;"> <col class="document-item-25">
<col style="width: 30%;"> <col class="document-item-30 description">
<col style="width: 10%"> <col class="document-item-10">
<col style="width: 10%"> <col class="document-item-10">
<col style="width: 20%"> <col class="document-item-20">
<col style="width: 40px;"> <col class="document-item-40-px">
</colgroup> </colgroup>
<tbody> <tbody>
<tr> <tr>
@stack('move_td_start') @stack('move_td_start')
<td class="pl-3 pb-3 align-middle border-bottom-0" style="max-width: 40px;" style="color: #8898aa;"> <td class="pl-3 pb-3 align-middle border-bottom-0 move" style="max-width: 40px;" style="color: #8898aa;">
<div> <div>
<i class="fas fa-grip-vertical"></i> <i class="fas fa-grip-vertical"></i>
</div> </div>
@ -27,7 +27,7 @@
@stack('items_td_start') @stack('items_td_start')
@if (!$hideItems || (!$hideName && !$hideDescription)) @if (!$hideItems || (!$hideName && !$hideDescription))
@stack('name_td_start') @stack('name_td_start')
<td class="pb-3 align-middle border-bottom-0"> <td class="pb-3 align-middle border-bottom-0 name">
@if (!$hideName) @if (!$hideName)
<span class="aka-text aka-text--body" tabindex="0" v-html="row.name" v-if="row.item_id"></span> <span class="aka-text aka-text--body" tabindex="0" v-html="row.name" v-if="row.item_id"></span>
<div v-else> <div v-else>
@ -53,7 +53,7 @@
@stack('name_td_end') @stack('name_td_end')
@stack('description_td_start') @stack('description_td_start')
<td class="pb-3 border-bottom-0"> <td class="pb-3 border-bottom-0 description">
@if (!$hideDescription) @if (!$hideDescription)
<textarea <textarea
class="form-control" class="form-control"
@ -72,7 +72,7 @@
@stack('items_td_end') @stack('items_td_end')
@stack('quantity_td_start') @stack('quantity_td_start')
<td class="pb-3 pl-0 pr-2 border-bottom-0"> <td class="pb-3 pl-0 pr-2 border-bottom-0 quantity">
@if (!$hideQuantity) @if (!$hideQuantity)
<div> <div>
@stack('quantity_input_start') @stack('quantity_input_start')
@ -97,7 +97,7 @@
@stack('quantity_td_end') @stack('quantity_td_end')
@stack('price_td_start') @stack('price_td_start')
<td class="pb-3 pl-0 pr-0 border-bottom-0" style="padding-right: 5px; padding-left: 5px;"> <td class="pb-3 pl-0 pr-0 border-bottom-0 price" style="padding-right: 5px; padding-left: 5px;">
@if (!$hidePrice) @if (!$hidePrice)
<div> <div>
@stack('price_input_start') @stack('price_input_start')
@ -109,7 +109,7 @@
@stack('price_td_end') @stack('price_td_end')
@stack('total_td_start') @stack('total_td_start')
<td class="text-right long-texts pb-3 border-bottom-0"> <td class="text-right long-texts pb-3 border-bottom-0 total">
@if (!$hideAmount) @if (!$hideAmount)
<div> <div>
{{ Form::moneyGroup('total', '', '', ['required' => 'required', 'disabled' => 'true' , 'row-input' => 'true', 'v-model' => 'row.total', 'data-item' => 'total', 'currency' => $currency, 'dynamic-currency' => 'currency'], 0.00, 'text-right input-price disabled-money') }} {{ Form::moneyGroup('total', '', '', ['required' => 'required', 'disabled' => 'true' , 'row-input' => 'true', 'v-model' => 'row.total', 'data-item' => 'total', 'currency' => $currency, 'dynamic-currency' => 'currency'], 0.00, 'text-right input-price disabled-money') }}
@ -119,7 +119,7 @@
@stack('total_td_end') @stack('total_td_end')
@stack('delete_td_start') @stack('delete_td_start')
<td class="pb-3 pl-2 align-middle border-bottom-0" style="max-width: 40px;" > <td class="pb-3 pl-2 align-middle border-bottom-0 delete" style="max-width: 40px;" >
<div> <div>
<button type="button" @click="onDeleteItem(index)" class="btn btn-link btn-delete p-0"> <button type="button" @click="onDeleteItem(index)" class="btn btn-link btn-delete p-0">
<i class="far fa-trash-alt"></i> <i class="far fa-trash-alt"></i>

View File

@ -3,10 +3,10 @@
<div class="table-responsive overflow-x-scroll overflow-y-hidden"> <div class="table-responsive overflow-x-scroll overflow-y-hidden">
<table class="table" id="totals"> <table class="table" id="totals">
<colgroup> <colgroup>
<col class="document-50"> <col class="document-total-50">
<col class="document-30"> <col class="document-total-30">
<col class="document-25"> <col class="document-total-25">
<col class="document-40-px"> <col class="document-total-40-px">
</colgroup> </colgroup>
<tbody id="invoice-total-rows" class="table-padding-05"> <tbody id="invoice-total-rows" class="table-padding-05">
@stack('sub_total_td_start') @stack('sub_total_td_start')