KumiSystems/Chatwoot
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Chore: Responsive fixes for common screen widths (#1856)

Browse source
This commit is contained in:
Nithin David Thomas 2021-03-08 13:30:33 +05:30 • committed by GitHub
parent d70208a0a8
commit 759ed43745
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 16 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

4
app/javascript/dashboard/assets/scss/_foundation-settings.scss
View file

@ -89,7 +89,9 @@ $breakpoints: (small: 0,
medium: 640px, medium: 640px,
large: 1024px, large: 1024px,
xlarge: 1200px, xlarge: 1200px,
xxlarge: 1440px); xxlarge: 1400px,
xxxlarge: 1600px,
);
$print-breakpoint: large; $print-breakpoint: large;
$breakpoint-classes: (small medium large); $breakpoint-classes: (small medium large);

7
app/javascript/dashboard/components/ChatList.vue
View file

@ -232,10 +232,13 @@ export default {
width: 36rem; width: 36rem;
} }
@include breakpoint(xlarge up) { @include breakpoint(xlarge up) {
width: 33rem; width: 35rem;
} }
@include breakpoint(xxlarge up) { @include breakpoint(xxlarge up) {
width: 42rem; width: 38rem;
}
@include breakpoint(xxxlarge up) {
flex-basis: 46rem;
} }
} }
</style> </style>

13
app/javascript/dashboard/components/widgets/conversation/ConversationBox.vue
View file

@ -87,23 +87,26 @@ export default {
.conversation-sidebar-wrap { .conversation-sidebar-wrap {
height: auto; height: auto;
flex: 0 1; flex: 0 0;
overflow: hidden; overflow: hidden;
overflow: auto; overflow: auto;
background: white; background: white;
flex-shrink: 0;
flex-basis: 28rem; flex-basis: 28rem;
@include breakpoint(large up) { @include breakpoint(large up) {
flex-basis: 31em; flex-basis: 30em;
} }
@include breakpoint(xlarge up) { @include breakpoint(xlarge up) {
flex-basis: 32em; flex-basis: 31em;
} }
@include breakpoint(xxlarge up) { @include breakpoint(xxlarge up) {
flex-basis: 36rem; flex-basis: 33rem;
}
@include breakpoint(xxxlarge up) {
flex-basis: 40rem;
} }
&::v-deep .contact--panel { &::v-deep .contact--panel {