diff --git a/web/satellite/src/components/common/VHeader.vue b/web/satellite/src/components/common/VHeader.vue index 94fe6394a..68bc60fb1 100644 --- a/web/satellite/src/components/common/VHeader.vue +++ b/web/satellite/src/components/common/VHeader.vue @@ -6,7 +6,7 @@
-
+
diff --git a/web/satellite/src/components/common/VSearch.vue b/web/satellite/src/components/common/VSearch.vue index 6bd0a92eb..2158693d5 100644 --- a/web/satellite/src/components/common/VSearch.vue +++ b/web/satellite/src/components/common/VSearch.vue @@ -86,7 +86,8 @@ export default class VSearch extends Vue { .common-search-input { position: absolute; right: 0; - bottom: 0; + bottom: 50%; + transform: translateY(50%); padding: 0 38px 0 18px; border: 1px solid #f2f2f2; box-sizing: border-box; @@ -102,4 +103,11 @@ export default class VSearch extends Vue { background-size: 22px 22px; background-position: top 16px right 16px; } - \ No newline at end of file + + @media screen and (max-width: 1150px) { + + .common-search-input { + width: 100% !important; + } + } + diff --git a/web/satellite/src/components/common/VTable.vue b/web/satellite/src/components/common/VTable.vue index 239551e18..37862e667 100644 --- a/web/satellite/src/components/common/VTable.vue +++ b/web/satellite/src/components/common/VTable.vue @@ -31,10 +31,6 @@ import { Component, Prop, Vue } from 'vue-property-decorator'; import TablePagination from "@/components/common/TablePagination.vue"; import { OnPageClickCallback } from "@/types/pagination"; -export type SelectableItem = T & { - isSelected: boolean; -} - // @vue/component @Component({ components: { @@ -152,10 +148,59 @@ export default class VTable extends Vue { } } +@media screen and (max-width: 970px) { + + tbody tr > .data p { + max-width: 25rem; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + } +} + +@media screen and (max-width: 870px) { + + tbody tr > .data p { + max-width: 20rem; + } +} + @media screen and (max-width: 768px) { .select { display: none; } + + tbody tr > .data p { + max-width: 25rem; + } +} + +@media screen and (max-width: 660px) { + + tbody tr > .data p { + max-width: 15rem; + } +} + +@media screen and (max-width: 550px) { + + tbody tr > .data p { + max-width: 15rem; + } +} + +@media screen and (max-width: 440px) { + + tbody tr > .data p { + max-width: 10rem; + } +} + +@media screen and (max-width: 350px) { + + tbody tr > .data p { + max-width: 8rem; + } } diff --git a/web/satellite/tests/unit/common/__snapshots__/VHeader.spec.ts.snap b/web/satellite/tests/unit/common/__snapshots__/VHeader.spec.ts.snap index 0466de97b..e19509193 100644 --- a/web/satellite/tests/unit/common/__snapshots__/VHeader.spec.ts.snap +++ b/web/satellite/tests/unit/common/__snapshots__/VHeader.spec.ts.snap @@ -3,7 +3,7 @@ exports[`HeaderComponent.vue renders correctly 1`] = `
-
+