LeadMagnet/leadchat
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

Merge branch 'master' into codeclimate-76-issue-sidemenu-scss

Browse Source
This commit is contained in:
Nithin David Thomas
2019-10-07 20:34:17 +05:30
committed by GitHub
parent 426ac33acf d9b97bc92e
commit 3a01a40c26
11 changed files with 1169 additions and 1340 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/javascript/src/assets/scss/_variables.scss
View File

@@ -55,6 +55,8 @@ $color-white: #FFF;
$color-body: #3C4858;
$color-heading: #1F2D3D;
$color-modal-header: #f1f1f1;
$color-extra-light-blue: #F5F7F9;
// Thumbnail
$thumbnail-radius: 4rem;

49
app/javascript/src/assets/scss/widgets/_billing.scss
View File

@@ -1,35 +1,42 @@
.billing {
@include full-height;
.row {
@include full-height;
}
.billing__stats {
@include flex;
}
.billing__form {
@include thin-border($color-border-light);
@include margin($zero -$space-micro);
@include margin($zero - $space-micro);
@include full-height;
background: $color-white;
iframe {
border: 0;
@include full-height;
border: 0;
width: 100%;
}
}
.account-row {
@include flex-grid-column(3, $space-medium);
@include padding($space-normal);
background: $color-white;
@include flex;
@include flex-direction(column);
// @include thin-border($color-border-light);
// @include margin(-$space-micro $zero);
background: $color-white;
font-size: $font-size-small;
.title {
font-weight: $font-weight-medium;
color: $color-heading;
font-weight: $font-weight-medium;
}
.value {
font-size: $font-size-mega;
font-weight: $font-weight-light;
@@ -41,25 +48,29 @@
.account-locked {
@include background-gray;
@include margin(0);
.lock-message{
}
.lock-message {
@include flex;
@include full-height;
@include flex-direction(column);
@include flex-align(center, middle);
div {
@include flex;
@include full-height;
@include flex-direction(column);
@include flex-align(center, middle);
div {
@include flex;
@include full-height;
@include flex-direction(column);
@include flex-align(center, middle);
img {
width: 10rem;
@include margin($space-normal);
}
span {
text-align: center;
font-size: $font-size-small;
font-weight: $font-weight-medium;
}
img {
@include margin($space-normal);
width: 10rem;
}
span {
font-size: $font-size-small;
font-weight: $font-weight-medium;
text-align: center;
}
}
}

138
app/javascript/src/assets/scss/widgets/_emojiinput.scss
View File

@@ -1,20 +1,20 @@
.emoji-dialog {
width: 28.6rem;
height: 20rem;
background: $color-white;
box-sizing: content-box;
border-radius: 2px;
position: absolute;
top: -22rem;
right: 0;
padding-bottom: $space-two;
@include elegant-card;
background: $color-white;
border-radius: 2px;
box-sizing: content-box;
height: 20rem;
padding-bottom: $space-two;
position: absolute;
right: 0;
top: -22rem;
width: 28.6rem;
&:before {
position: absolute;
bottom: -$space-slab;
right: $space-two;
&::before {
@include arrow(bottom, $color-white, $space-slab);
bottom: -$space-slab;
position: absolute;
right: $space-two;
}
.emojione {
@@ -23,84 +23,84 @@
}
.emoji-row {
box-sizing: border-box;
overflow-y: scroll;
height: 180px;
@include padding($space-small);
box-sizing: border-box;
height: 180px;
overflow-y: scroll;
padding-bottom: 0;
.emoji {
border-radius: 4px;
display: inline-block;
padding: 5px;
border-radius: 4px;
}
.emojione{
margin: 0.6rem;
float:left;
.emojione {
cursor: pointer;
}
}
.emoji-dialog-header {
@include padding($zero $space-smaller);
background-color: $light-gray;
border-top-left-radius: $space-small;
border-top-right-radius: $space-small;
ul {
padding: 0;
margin: 0;
list-style: none;
padding-top: $space-smaller;
li {
display: inline-block;
box-sizing: border-box;
height: 3.4rem;
text-align: center;
@include padding($space-small $space-small);
cursor: pointer;
img, svg {
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
}
&.active {
background: #fff;
border-top-left-radius: $space-small;
border-top-right-radius: $space-small;
img,
svg {
-webkit-filter: grayscale(0);
filter: grayscale(0);
}
}
}
float: left;
margin: .6rem;
}
}
.emoji-category-title {
color: $color-heading;
font-size: $font-size-small;
font-weight: $font-weight-medium;
color: $color-heading;
text-transform: capitalize;
margin: 0;
text-transform: capitalize;
}
.emoji-category-heading-decoration {
text-align: right;
}
}
.emoji-dialog .emoji-category-header > * {
display: table-cell;
vertical-align: middle;
.emoji-dialog-header {
@include padding($zero $space-smaller);
background-color: $light-gray;
border-top-left-radius: $space-small;
border-top-right-radius: $space-small;
ul {
list-style: none;
margin: 0;
padding: $space-smaller 0 0;
> li {
@include padding($space-small $space-small);
box-sizing: border-box;
cursor: pointer;
display: inline-block;
height: 3.4rem;
text-align: center;
}
> .active {
background: $white;
border-top-left-radius: $space-small;
border-top-right-radius: $space-small;
}
img,
svg {
filter: grayscale(100%);
}
}
.active {
img,
svg {
filter: grayscale(0);
}
}
> * {
display: table-cell;
vertical-align: middle;
}
}
.emoji-dialog .emoji-row
.emoji-dialog .emoji-row,
.emoji-dialog .emoji-row .emoji:hover {
background: #F5F7F9;
background: $color-extra-light-blue;
}

10
app/javascript/src/assets/scss/widgets/_thumbnail.scss
View File

@@ -1,14 +1,16 @@
.user-thumbnail-box {
position: relative;
@include flex-shrink;
position: relative;
.user-thumbnail {
border-radius: 50%;
}
.source-badge {
position: absolute;
bottom: -$space-micro / 2;
height: $space-slab;
width: $space-slab;
position: absolute;
right: $zero;
bottom: -$space-micro/2;
width: $space-slab;
}
}