diff --git a/src/components/Status/index.vue b/src/components/Status/index.vue index f6c63a12..50fbcfb0 100644 --- a/src/components/Status/index.vue +++ b/src/components/Status/index.vue @@ -267,9 +267,8 @@ export default { font-style: italic; } } -@media -only screen and (max-width: 760px), -(min-device-width: 768px) and (max-device-width: 1024px) { + +@media only screen and (max-width:480px) { .el-message { min-width: 80%; } diff --git a/src/views/reports/components/GroupedReport.vue b/src/views/reports/components/GroupedReport.vue index e7ce15e2..54ee5b1a 100644 --- a/src/views/reports/components/GroupedReport.vue +++ b/src/views/reports/components/GroupedReport.vue @@ -140,9 +140,8 @@ export default { .reported-status { margin-top: 15px; } - @media - only screen and (max-width: 760px), - (min-device-width: 768px) and (max-device-width: 1024px) { + + @media only screen and (max-width:480px) { .grouped-report { .header-container { display: flex; @@ -158,5 +157,13 @@ export default { margin-bottom: 7px; } } + .block { + .reports-timeline .el-timeline { + margin: 20px 10px; + .el-timeline-item__wrapper { + padding-left: 20px; + } + } + } } diff --git a/src/views/reports/components/NoteCard.vue b/src/views/reports/components/NoteCard.vue index fdc81d91..379e752b 100644 --- a/src/views/reports/components/NoteCard.vue +++ b/src/views/reports/components/NoteCard.vue @@ -97,9 +97,8 @@ export default { display: flex; justify-content: space-between; } - @media - only screen and (max-width: 760px), - (min-device-width: 768px) and (max-device-width: 1024px) { + + @media only screen and (max-width:480px) { .el-card__header { padding: 10px 17px; } diff --git a/src/views/reports/components/Report.vue b/src/views/reports/components/Report.vue index 9b963679..5911ad7d 100644 --- a/src/views/reports/components/Report.vue +++ b/src/views/reports/components/Report.vue @@ -74,7 +74,7 @@ v-model="notes[report.id]" :placeholder="$t('reports.leaveNote')" type="textarea" - rows="3"/> + rows="2"/>
{{ $t('reports.postNote') }}
@@ -279,9 +279,8 @@ export default { font-style: italic; color: gray; } - @media - only screen and (max-width: 760px), - (min-device-width: 768px) and (max-device-width: 1024px) { + + @media only screen and (max-width:480px) { .report { .header-container { display: flex; @@ -303,5 +302,11 @@ export default { margin-bottom: 7px; } } + .reports-timeline { + margin: 20px 10px; + .el-timeline-item__wrapper { + padding-left: 20px; + } + } } diff --git a/src/views/reports/components/ReportCard.vue b/src/views/reports/components/ReportCard.vue index 6121bb52..430b58bb 100644 --- a/src/views/reports/components/ReportCard.vue +++ b/src/views/reports/components/ReportCard.vue @@ -108,9 +108,8 @@ export default { display: flex; justify-content: space-between; } - @media - only screen and (max-width: 760px), - (min-device-width: 768px) and (max-device-width: 1024px) { + + @media only screen and (max-width:480px) { .el-card__header { padding: 10px 17px; } diff --git a/src/views/reports/components/ReportsFilter.vue b/src/views/reports/components/ReportsFilter.vue index da1fd782..29e15075 100644 --- a/src/views/reports/components/ReportsFilter.vue +++ b/src/views/reports/components/ReportsFilter.vue @@ -54,12 +54,17 @@ export default { .select-field { width: 350px; } -@media -only screen and (max-width: 760px), -(min-device-width: 768px) and (max-device-width: 1024px) { + +@media only screen and (max-width:480px) { .select-field { width: 100%; margin-bottom: 5px; } } + +@media only screen and (max-width:801px) and (min-width: 481px) { + .select-field { + width: 50%; + } +} diff --git a/src/views/reports/index.vue b/src/views/reports/index.vue index 3e67d90e..8c37e6a1 100644 --- a/src/views/reports/index.vue +++ b/src/views/reports/index.vue @@ -92,9 +92,8 @@ export default { font-size: 28px; } } -@media -only screen and (max-width: 760px), -(min-device-width: 768px) and (max-device-width: 1024px) { + +@media only screen and (max-width:480px) { .reports-container { h1 { margin: 7px 10px 15px 10px; @@ -103,8 +102,5 @@ only screen and (max-width: 760px), margin: 0 10px; } } - #app > div > div.main-container > section > div > div.block > ul { - margin: 45px 45px 5px 19px; - } } diff --git a/src/views/settings/styles/main.scss b/src/views/settings/styles/main.scss index a6658b55..5b68e0c6 100644 --- a/src/views/settings/styles/main.scss +++ b/src/views/settings/styles/main.scss @@ -520,8 +520,8 @@ margin-right: 8px } } - @media only screen and (max-width:801px) and (min-width: 481px) { + @media only screen and (max-width:801px) and (min-width: 481px) { .delete-setting-button { margin: 4px 0 0 10px; height: 28px; diff --git a/src/views/statuses/index.vue b/src/views/statuses/index.vue index 828526c8..5dc4834d 100644 --- a/src/views/statuses/index.vue +++ b/src/views/statuses/index.vue @@ -129,9 +129,7 @@ h1 { margin: 22px 0 0 0; } -@media -only screen and (max-width: 760px), -(min-device-width: 768px) and (max-device-width: 1024px) { +@media only screen and (max-width:480px) { .filter-container { display: flex; height: 36px; diff --git a/src/views/users/components/UsersFilter.vue b/src/views/users/components/UsersFilter.vue index edb3d75d..eba859f6 100644 --- a/src/views/users/components/UsersFilter.vue +++ b/src/views/users/components/UsersFilter.vue @@ -61,12 +61,17 @@ export default { .select-field { width: 350px; } -@media -only screen and (max-width: 760px), -(min-device-width: 768px) and (max-device-width: 1024px) { + +@media only screen and (max-width:480px) { .select-field { width: 100%; margin-bottom: 5px; } } + +@media only screen and (max-width:801px) and (min-width: 481px) { + .select-field { + width: 50%; + } +}