fix: Update styles to fix the image resolution on smaller devices (#2618)

This commit is contained in:
Pranav Raj S 2021-07-13 18:54:33 +05:30 committed by GitHub
parent f9b55944ad
commit b7806fc210
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 16 additions and 12 deletions

View file

@ -8,12 +8,12 @@
.channel { .channel {
@include flex; @include flex;
@include padding($space-normal $zero); @include padding($space-normal $zero);
@include margin($zero);
@include background-white; @include background-white;
@include border-light; @include border-light;
flex-direction: column;
cursor: pointer; cursor: pointer;
border-right-color: $color-white; flex-direction: column;
margin: -1px;
transition: all 0.200s ease-in; transition: all 0.200s ease-in;
&:last-child { &:last-child {
@ -32,14 +32,13 @@
img { img {
@include margin($space-normal auto); @include margin($space-normal auto);
flex: 1;
width: 50%; width: 50%;
} }
.channel__title{ .channel__title {
font-size: $font-size-large;
text-align: center;
color: $color-body; color: $color-body;
font-size: var(--font-size-default);
text-align: center;
text-transform: capitalize; text-transform: capitalize;
} }

View file

@ -1,6 +1,6 @@
<template> <template>
<div <div
class="small-3 columns channel" class="small-6 medium-4 large-3 columns channel"
:class="{ inactive: !isActive }" :class="{ inactive: !isActive }"
@click="onItemClick" @click="onItemClick"
> >

View file

@ -173,8 +173,8 @@
"FINISH_MESSAGE": "Start forwarding your emails to the following email address." "FINISH_MESSAGE": "Start forwarding your emails to the following email address."
}, },
"AUTH": { "AUTH": {
"TITLE": "Channels", "TITLE": "Choose a channel",
"DESC": "Currently, we support Website live chat widgets, Facebook Pages, Twitter profiles and Whatsapp as platforms. We have more platforms like Email, Telegram and Line in the works, which will be out soon." "DESC": "Chatwoot supports live-chat widget, Facebook page, Twitter profile, Whatsapp, Email etc., as channels. If you want to build a custom channel, you can create it using the API channel. Select one channel from the options below to proceed."
}, },
"AGENTS": { "AGENTS": {
"TITLE": "Agents", "TITLE": "Agents",

View file

@ -1,5 +1,5 @@
<template> <template>
<div class="wizard-body small-9 columns"> <div class="wizard-body small-12 medium-9 columns height-auto">
<page-header <page-header
:header-title="$t('INBOX_MGMT.ADD.AUTH.TITLE')" :header-title="$t('INBOX_MGMT.ADD.AUTH.TITLE')"
:header-content="$t('INBOX_MGMT.ADD.AUTH.DESC')" :header-content="$t('INBOX_MGMT.ADD.AUTH.DESC')"
@ -77,3 +77,8 @@ export default {
}, },
}; };
</script> </script>
<style scoped>
.height-auto {
height: auto;
}
</style>

View file

@ -1,7 +1,7 @@
<template> <template>
<div class="row content-box full-height"> <div class="row content-box full-height">
<woot-wizard <woot-wizard
class="small-3 columns" class="hide-for-small-only medium-3 columns"
:global-config="globalConfig" :global-config="globalConfig"
:items="items" :items="items"
/> />