diff --git a/src/components/pages/Swap/Widget/Transactions.vue b/src/components/pages/Swap/Widget/Transactions.vue index ddbe06ffc..8e0f33896 100644 --- a/src/components/pages/Swap/Widget/Transactions.vue +++ b/src/components/pages/Swap/Widget/Transactions.vue @@ -27,7 +27,7 @@ </div> </template> </s-table-column> - <s-table-column width="94"> + <s-table-column> <template #header> <span>{{ tc('accountText', 1) }}</span> </template> @@ -35,7 +35,7 @@ <formatted-address :value="row.address" :symbols="8" /> </template> </s-table-column> - <s-table-column width="112" header-align="left" align="left"> + <s-table-column header-align="left" align="left"> <template #header> <span>{{ t('transfers.from') }}</span> </template> @@ -50,7 +50,7 @@ </div> </template> </s-table-column> - <s-table-column width="112" header-align="left" align="left"> + <s-table-column header-align="left" align="left"> <template #header> <span>{{ t('transfers.to') }}</span> </template> diff --git a/src/components/shared/Widget/Grid/Grid.vue b/src/components/shared/Widget/Grid/Grid.vue index 318686fa3..93f70a739 100644 --- a/src/components/shared/Widget/Grid/Grid.vue +++ b/src/components/shared/Widget/Grid/Grid.vue @@ -1,50 +1,37 @@ <template> - <div class="grid-wrapper"> - <grid-layout - :layout.sync="layout" - :responsive-layouts="responsiveLayouts" - :cols="cols" - :breakpoints="breakpoints" - :row-height="rowHeight" - :is-draggable="draggable" - :is-resizable="resizable" - :margin="[margin, margin]" - :responsive="true" - :prevent-collision="true" - :vertical-compact="compact" - :use-css-transforms="false" - @layout-ready="onReady" - @breakpoint-changed="onBreakpointChanged" - > - <grid-item - v-for="item in layout" - :key="item.i" - :i="item.i" - :x="item.x" - :y="item.y" - :w="item.w" - :h="item.h" - :min-h="item.minH" - :min-w="item.minW" - class="grid-item" - > - <slot - v-if="ready" - :name="item.i" - v-bind="{ - onResize: ($event) => onWidgetResize($event, item.i), - }" - /> - </grid-item> - </grid-layout> - </div> + <grid-layout + :layout.sync="layout" + :responsive-layouts="responsiveLayouts" + :cols="cols" + :breakpoints="breakpoints" + :row-height="rowHeight" + :is-draggable="draggable" + :is-resizable="resizable" + :margin="[margin, margin]" + :responsive="true" + :prevent-collision="true" + :vertical-compact="compact" + :use-css-transforms="false" + @layout-ready="onReady" + @breakpoint-changed="onBreakpointChanged" + > + <grid-item v-for="widget in layout" :key="widget.i" v-bind="widget"> + <slot + v-if="ready" + :name="widget.i" + v-bind="{ + onResize: ($event) => onWidgetResize($event, widget.i), + }" + /> + </grid-item> + </grid-layout> </template> <script lang="ts"> import cloneDeep from 'lodash/fp/cloneDeep'; import debounce from 'lodash.debounce'; import { GridLayout, GridItem } from 'vue-grid-layout'; -import { Component, Prop, Ref, Vue, Watch } from 'vue-property-decorator'; +import { Component, Prop, Vue, Watch } from 'vue-property-decorator'; import { Breakpoint, BreakpointKey } from '@/consts/layout'; import type { Layout, LayoutConfig, LayoutWidget, LayoutWidgetConfig, ResponsiveLayouts } from '@/types/layout'; @@ -133,12 +120,3 @@ export default class WidgetsGrid extends Vue { } } </script> - -<style lang="scss"> -.grid-wrapper { - .grid-item { - display: flex; - flex-flow: column nowrap; - } -} -</style> diff --git a/src/views/Swap.vue b/src/views/Swap.vue index 5e3632fa6..22209f1ce 100644 --- a/src/views/Swap.vue +++ b/src/views/Swap.vue @@ -80,7 +80,7 @@ const LayoutsConfigDefault: ResponsiveLayouts<LayoutWidgetConfig> = { { x: 0, y: 0, w: 4, h: 20, i: SwapWidgets.Form }, { x: 4, y: 0, w: 8, h: 20, i: SwapWidgets.Chart }, { x: 0, y: 20, w: 4, h: 12, i: SwapWidgets.Distribution }, - { x: 4, y: 20, w: 6, h: 24, i: SwapWidgets.Transactions }, + { x: 4, y: 20, w: 8, h: 24, i: SwapWidgets.Transactions }, ], xs: [ { x: 0, y: 0, w: 4, h: 20, i: SwapWidgets.Form },