/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/*
Created on : 05.01.2018, 17:26:23
Author : saeed
*/
$textColor : #585858;
$barBtnColor : #ffffff;
$pColor : #585858;
//-------- content background color ---------//
$ionContentColor : #fcfcfc;
/*$ionContentColor : #fcfcfc !important;*/
$itemColor : black;
$ionItemBgColor : rgba(210, 212, 212, 0.858824);
$profileItemBgColor : transparent;
$itemFreeBgColor : rgba(255,255,255,1);
$avatarBgColor : #d1dde3;
$itemInnerColor : #585858;
//-------- header text color ----------//
$toolbarTitleColor : white; //#767777
$headerBgColor : #1aa8d5;
$headerBgColor : #0277bd; // material
$headerBgColor : #6967f1; // material
$toolbarBgColor : #1aa8d5;
$toolbarBgColor : #6967f1;
$toolbarBgColor : linear-gradient(to left, #6967f1 0%, #21b3f9 150%);
$scrollContentBgColor : linear-gradient(197deg, #6967f1 0%, #21b3f9, #ffffff 100%);
$scrollContentBgColor : linear-gradient(197deg, #6967f1 0%, #abe2ffd1, #ffffff 100%);
$scrollContentBgColor : linear-gradient(197deg, #6967f1 0%, #abe2ff 41%, #ffffff 96%);
/*$toolbarBgColor : #0277bd; // material*/
$navarBtnColor : white;
$iconStarColor : yellow;
$ionLabelColor : white;
// ------ message --------- //
$messageBgColor : #33c7f5;
$messageBgColor : #b2ff59; // material
$messageBgColor : #bcffed; // material
$messageBgColor : rgba(0, 11, 160, 0.18823529411764706); // material
/*$messageReceivedBgColor : #bfcfd4;*/
$messageHeaderTextColor : black;
$messageReceivedBgColor : transparent;
$inputBorderColor : yellowgreen;
$inputBgColor : #d1dde3;
$btnBorderColor : #ffc6c6;;
/*$btnBgColor : #2d5a8c;*/
$btnBgColor : #8dbac8;
$btnBgColor : #3974b2;;
$inputBorderColor : #00b7ff;
// ----- menu ---------------
$menuItemColor : #6bb5e4;
$menuItemColor : transparent;//material
//-------action sheet--------//
$actionSheetTitleColor : #585858;
$actionSheetBgColor : #cee2f8;
$actionSheetBgColor : transparent;
$actionSheetBtnColor : #6b8a9c;
//------add friend dialog-----//
/*$addFriendDialogBgColor : #4776aa;*/
$addFriendDialogBgColor : #1aa8d5;
$addFriendDialogBgColor : #fffafa;
$addFriendDialogInputBgColor : #d1dde3;
$addFriendDialogInputColor : #00b7ff;
//-----foooter-----//
/*$footerBgColor : #98daef;*/
$footerBgColor : #e3f7f7;;
$footerBgColor : #63a4ff;// material color
$footerBgColor : #84c9fb;// material color
$footerBgColor : #ffffff;// material color
$footerBgColor : #f5f5f5;// material color
$footerBgColor : #fafeff;// material color
$footerBgColor : #ffffff;// material color
/*$iconColor : #767777;*/
/*$iconColor : rgba(43, 222, 215, 0.6705882352941176);*/
/*$iconColor : rgb(72, 138, 255);*/
/*$iconColor : #9dbffb;;*/
$iconColor : #7ebad2;
$iconColor : #0078ff; //material
$iconColor : #727475; //material
$h1Color : white;
$h1Color : #05111f;
$footerTextColor :#7ebad2;
$footerTextColor :#0078ff; // material
$footerTextColor :#727475; // material
$footerSelectedTextColor :#05111f; // material
// fabButton
$fabIconColor : #585858;
/*$fabBtnBgColor : transparent;*/
$fabBtnBgColor : #1aa8d5;
$fabBtnBgColor : #3974b2;
//------send tools-----//
$sendToolsBtnBorderColor : white;
/*$sendToolsBgColor : #1aa8d5;*/
$sendToolsFabBtnBgColor : transparent;
$sendToolsBgColor : transparent;
/*$sendToolsBtnColor : rgba(102, 102, 102, 1);*/
$sendToolsBtnColor : #0292ab;
.light-theme {
h1,
h2,
h3,
h4,
h5,
h6,
p,
.toolbar-title,
body,
div {
/*transition: all 1.1s ease;*/
color: $textColor;
}
.bar-button-default {
color: $barBtnColor;
}
ion-content {
.item {
background: $menuItemColor;
}
}
ion-content {
/*transition: all 1.1s ease;*/
background-color: $ionContentColor;
.scroll-content {
/*background: url(../assets/img/bg.jpg);*/
background: url(../assets/img/bg.jpg);
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0281d1+0,80ede5+100 */
background: #0281d1; /* Old browsers */
/*background: -moz-linear-gradient(top, #0281d1 0%, #80ede5 100%); FF3.6-15 */
/*background: -webkit-linear-gradient(top, #0281d1 0%,#80ede5 100%); Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #0281d1 0%,#80ede5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
background: linear-gradient(to bottom, #3572b1 0%, #c7ffef 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
background: linear-gradient(to bottom, #3572b1 0%, #ffffff 100%);
background: $scrollContentBgColor;
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0281d1', endColorstr='#80ede5',GradientType=0 ); IE6-9 */
/*background: url(../assets/img/chatbackground2.jpg);*/
background-size: cover;
padding-bottom: 200px;
.messagesArea {
padding-bottom: 50px;
}
ion-slides {
background: url(../assets/img/chatbackground2.jpg);
background-size: cover;
}
ion-item.item {
/*background-color: $itemColor;*/
/*padding :0px;*/
/*transition: all 1.1s ease;*/
/*background-color: $ionItemBgColor;*/
ion-avatar {
margin: 0px;
margin-bottom: 0px;
margin-right: 6px;
border-radius: 100%;
/*width: 50px;*/
/*height : 50px;*/
/*height: 100%;*/
background: $avatarBgColor;
p {
background: none;
text-align: center;
/*vertical-align: middle;*/
// margin-top: 4px;
// font-size: 30px;
/*margin: 0px;*/
/*padding: 0px;*/
align-items: center;
justify-content: center;
/* vertical-align: middle; */
display: flex;
/* margin-top: 4px; */
font-size: 10vw;
}
}
.item-inner {
border-color: $itemInnerColor;
border-bottom: 0px solid;
ion-label.label {
/*color : $itemInnerColor;*/
}
}
}
word-item {
ion-item.item {
background-color: #fff;
}
.wordWrapper {
button.conjugateNow{
/*padding-top: 10%;*/
width : 25px;
height: 25px;
// border-radius: 50%;
// height: auto;
span {
height: auto;
}
}
}
}
ion-item.item.free{
background-color: $itemFreeBgColor;
}
.publicItems {
ion-item.item {
background-color : rgba(212, 214, 216, 0.43);
border: 1px solid #eff1f3;
box-shadow: 1px 1px 0px 1px rgba(108, 112, 115, 0.45);
}
}
friend {
ion-item.item{
// background-color: rgb(103, 179, 228);
}
}
}
page-chat {
.scroll-content {
/*background: url(../assets/img/bg.jpg);*/
background: url(../assets/img/chatbackground2.jpg);
}
}
page-baya-plus
{
ion-content.content {
div.scroll-content {
padding-left: 0px;
}
}
}
/* ion-list {
ion-label.label {
color : $ionLabelColor;
}
}*/
message {
background : transparent;
/*background-size: cover;*/
/*background: url(../assets/img/css/button.png);*/
border-radius: 5px;
.card:not(.chat) {
.header {
background : $messageBgColor;
border-radius: 10px 10px 0px 0px;
}
.body {
/*padding-bottom: 10px;*/
background: white;
}
border-radius: 10px;
}
.moreBtn {
color: $messageHeaderTextColor;
font-size: 2.1rem;
}
.card.chat {
color: black;
background: white;
border-radius: 17px;
width: auto;
padding-left: 20px;
padding-right: 20px;
ion-col.col {
color: #6e6580;
}
/* .moreBtn.moreEnglish {
color: #6e6580;
}
.moreBtn.morePersian {
color: #6e6580;
}*/
}
.header {
ion-col {
font-weight: bolder;
font-size: 1.2em;
color: $messageHeaderTextColor;
}
}
word-item {
ion-item {
padding : 0px;
div.item-inner {
/*background: url(../assets/img/css/paper.png);*/
background: white;
/*background-size: cover;*/
padding : 0px;
ion-icon.speechIcon {
position: absolute;
right: 2px;
}
ion-label {
/*margin : 0px;*/
}
}
ion-col {
padding-top: 0px;
padding-bottom: 0px;
/*white-space: normal;*/
}
}
ion-grid {
padding : 0px;
}
noun {
p {
color : $pColor;
}
}
verb {
button {
padding : 6px;
}
}
}
.footer {
/*background: url(../assets/img/css/paper.png);*/
background: white;
background: rgba(99, 44, 44, 0);
padding-bottom: 27px;
border-radius: 0px 0px 15px 15px;
.addWordBtn {
background-color: #6188c2;
color: white;
}
}
}
message.received {
background : $messageReceivedBgColor;
.card.chat {
/*color: black;*/
background: cyan;
}
}
friend {
// border-bottom: 1px solid;
// border-bottom-color: #faebd7;
ion-item {
padding-top: 3px;
padding-bottom: 3px;
background-color: #000;
}
}
}
page-invitation {
.textToShare{
background: rgba(255, 255, 255, 0.3);
}
}
ion-footer {
chat-input {
ion-item.item {
background-color: white;
}
.suggestionPanel {
.suggestionItem {
width: 100%;
height: 44px;
/*background: rgba(63, 107, 117, 0.360784);*/
background: rgba(230, 243, 245, 0.94);
}
.suggestionItem.local {
background: rgba(223, 235, 255, 0.94);
}
}
}
}
page-chat {
ion-content {
.scroll-content {
/*background: url(../assets/img/chatbackground.jpg);*/
background-size: cover;
padding-bottom: 200px;
}
}
}
ion-menu {
.menu-inner {
ion-header.header {
position: relative;
ion-toolbar {
height : 24vh;
.toolbar-content {
ion-thumbnail {
display: block;
line-height: 1;
width: 20vw;
margin: 0 auto 0 auto;
height: 20vw;
border-radius: 100%;
background: white;
margin-top: 1vh;
}
ion-title.title {
float: none;
.toolbar-title {
text-align: center;
font-size:1.8rem;
}
.emailAccount {
// for some reason the following codes did not work
// padding-top : 0px;
// text-align: center;
// color :#ddf2ff;
}
}
}
}
}
ion-content.content {
position: relative;
div.fixed-content {
margin-top: 0px;
}
.scroll-content {
margin-top: 0px;
}
}
ion-icon.star {
color: yellow;
font-size: x-large;
}
}
}
page-profile,page-wallet {
ion-content {
.scroll-content {
ion-icon {
color: yellow;
font-size: x-large;
}
ion-item.item {
background: transparent;
}
}
}
}
.header .toolbar-title{
/*color : white;*/
}
.header .toolbar-background {
background-color: $headerBgColor;
}
ion-header {
ion-title {
.toolbar-title{
color : $toolbarTitleColor;
}
}
.back-button.show-back-button {
display: inline-block;
color: white;
}
ion-input {
border : 1px solid $inputBorderColor;
background: $inputBgColor;
}
ion-navbar.toolbar {
// activate just for iphone
/* padding-top : 20px;
height: 60px;*/
height: 9vh;
ion-buttons {
button {
color: $navarBtnColor;
}
}
.toolbar-background {
background: $toolbarBgColor;
}
}
}
ion-action-sheet {
.action-sheet-wrapper {
.action-sheet-title {
color : $actionSheetTitleColor;
}
.action-sheet-container {
background : $actionSheetBgColor;
button {
color : $actionSheetBtnColor;
}
}
}
}
ion-slide.swiper-slide {
background: $ionContentColor;
}
comp-footer {
/*background-color: red;*/
box-shadow: 1px 0px 5px 0px #40a5b5;;
background: $footerBgColor;
.bayaTab{
p {
color : $footerTextColor;
}
}
ion-icon {
color :$iconColor;
}
.bayaTab{
.selected {
ion-icon {
color : $footerSelectedTextColor;
}
p {
color : $footerSelectedTextColor;
}
}
}
}
ion-fab {
button.fab{
background-color: $fabBtnBgColor;
border-radius: 17px;
}
}
chat-input {
ion-fab {
height: 100%;
width: 42px;
button.fab{
background : $sendToolsBgColor;
}
ion-icon {
color : $fabIconColor;
}
button {
background : $sendToolsBgColor;
border : 1px solid $sendToolsBtnColor;
margin : 1px;
border-radius: 15%;
/*height :100%;*/
}
}
.sendTools {
min-height: 45px;
background-color: $sendToolsBgColor;
ion-col.mic,ion-col.send {
background: $sendToolsBgColor;
border-radius: 15%;
border: $sendToolsBtnBorderColor solid 1px;
}
.micBtn,.sendBtn,.stopMicBtn{
background: $sendToolsBgColor;
/*border-radius: 40%;*/
height: 100%;
border-radius:15%;
color : $sendToolsBtnColor;
}
}
}
dialog-menu-option-message {
.optionMenu {
background: #ffffff;
border: 1px solid rgb(149, 168, 214);
box-shadow: 1px 1px 10px rgba(66, 66, 66, 0.4588235294117647);
}
}
add-friend-dialog {
.dialog {
ion-card.card {
border-radius: 8px;
h1 { color : $h1Color; }
ion-input {
border-radius: 10px;
border: 1px solid $addFriendDialogInputColor;
background: $addFriendDialogInputBgColor;
width: 99%;
border: 1px solid $inputBorderColor;
margin: 12px auto 12px auto;
}
button {
border-radius: 11px;
padding: 19px;
padding-left: 29px;
border: 1px solid $btnBorderColor;
background: $btnBgColor;
padding-right: 29px;
}
button.cancel{
float: right;
width: 99px;
}
background: $addFriendDialogBgColor;
}
}
}
selection-language {
ion-item.item {
background: #e5f0f700;
border-top:1px rgba(0, 0, 0, 0.21176470588235294) solid;
font-weight: bold;
text-align: center;
}
}
}