responsive

This commit is contained in:
Peter Maquiran
2023-07-06 12:18:15 +01:00
parent 89e11c6fe4
commit 3df11142f6
53 changed files with 695 additions and 893 deletions
+47 -29
View File
@@ -1,4 +1,22 @@
@import '~src/function.scss';
@media only screen and (min-width: 100px) {
:host{
font-size: 14px;
}
}
@media only screen and (min-width: 500px) {
:host{
font-size: 16px;
}
}
.header-toolbar{
--background:transparent;
--opacity: 1;
@@ -29,7 +47,7 @@
.header-top-btn{
background: transparent;
font-size: 25px !important;
font-size: rem(25) !important;
font-weight: 100 !important;
/* color: #0782c9; */
color: #42b9fe;
@@ -58,13 +76,13 @@
.middle-container-options-icons{
color: #0782c9;
font-size: 23px;
font-size: rem(23);
}
}
.right{
padding: 0!important;
float: right;
font-size: 25px;
font-size: rem(25 );
color: #0782c9;
margin: 5px 0 0 0;
}
@@ -76,14 +94,14 @@
.header-bottom-icon{
width: 30px;
font-size: 25px;
font-size: rem(25);
float: left;
padding: 2px;
}
.header-bottom-contacts{
width: 275px;
font-size: 15px;
font-size: rem(15) ;
color: #797979;
white-space: nowrap;
overflow: hidden;
@@ -95,7 +113,7 @@
}
.title{
font-size: 25px;
font-size: rem(25);
white-space: nowrap;
overflow: hidden !important;
text-overflow: ellipsis !important;
@@ -104,7 +122,7 @@
.div-icon{
width: 40px;
float: right;
font-size: 35px;
font-size: rem(35);
overflow: auto;
padding: 1px;
}
@@ -118,19 +136,19 @@
ion-content{
.welcome-text{
/* width: 322px; */
width: em(422px);
width: rem(422);
background: #ebebeb;
text-align: center;
font-size: 13px;
font-size: rem(13) ;
color: #797979;
padding: 10px;
margin: 0 auto;
line-height: 1.2rem;
line-height: 1.2rrem;
margin: 20px 39px 25px;
border-radius: 8px;
}
.messages{
font-size: 13px;
font-size: rem(13) ;
font-family: Roboto;
overflow: auto;
@@ -145,10 +163,10 @@
word-wrap: break-word;
-webkit-overflow-scrolling: touch;
.messages-list-item-wrapper{
.messages-list-itrem-wrapper{
overflow: hidden;
}
.messages-list-item-wrapper-active{
.messages-list-itrem-wrapper-active{
background: #e6f6ff75 !important;
}
@@ -190,23 +208,23 @@
.info-meeting{
/* width: 322px; */
width: em(422px);
width: rem(422);
background: var(--chat-alert-msg-color);
text-align: center;
font-size: 13px;
font-size: rem(13) ;
color: #262420;
padding: 10px;
margin: 10px auto;
line-height: 1.2rem;
line-height: 1.2rrem;
/* margin: 15px 0px 15px 0px; */
border-radius: 8px;
.info-meeting-small{
font-size: 10px;
font-size: rem(10) ;
font-style: italic;
}
.info-meeting-medium{
font-size: 12px;
font-size: rem(12);
}
.info-meeting-normal{
color: #0782c9;
@@ -225,18 +243,18 @@
.container{
justify-content: center;
justify-content: space-evenly;
align-items: center;
align-itrems: center;
}
.chat-icon-options{
display:block !important;
font-size: 35px;
font-size: rem(35);
float: right !important;
margin-top: 5px;
}
.chat-icon-send{
font-size: 45px;
font-size: rem(45);
margin: 0 auto;
margin-top: 4px;
}
@@ -246,7 +264,7 @@
border: 1px solid #ebebeb;
border-radius: 25px;
padding-left: 15px;
align-items: center;
align-itrems: center;
overflow: auto;
ion-textarea{
@@ -259,7 +277,7 @@
}
.text-color-blue{
font-size: 15px;
font-size: rem(15);
color: #0782c9;
font-weight: 500;
letter-spacing: normal;
@@ -309,8 +327,8 @@ display: block;
left: 0px;
margin-left: 22px;
display: flex;
font-size: 12px;
align-items: center;
font-size: rem(12);
align-itrems: center;
}
@@ -334,14 +352,14 @@ button::-moz-focus-inner {
position: relative !important;
float: right;
display: flex;
align-items: self-end;
align-itrems: self-end;
}
.float-status-image{
position: relative !important;
float: right;
display: flex;
align-items: self-end;
align-itrems: self-end;
top: -15px;
}
@@ -350,11 +368,11 @@ button::-moz-focus-inner {
top: 0px !important;
float: right;
display: flex;
align-items: self-end;
align-itrems: self-end;
}
.float-status-all {
font-size: 10pt !important;
font-size: rem(13) !important;
}
.try {