scottk/chatwoot
1
0
Fork 0
mirror of https://github.com/lingble/chatwoot.git synced 2025-11-03 20:48:07 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: Use button component in ReplyBox

Browse Source 
Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
This commit is contained in:
Nithin David Thomas
2021-06-09 14:01:43 +05:30
committed by GitHub
parent 8a0afb912c
commit f79e489a0a
7 changed files with 117 additions and 139 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
app/javascript/dashboard/assets/scss/widgets/_buttons.scss
View File

@@ -1,31 +1,24 @@
$default-button-height: 4.0rem;
.button {
align-items: center;
display: inline-flex;
height: 4.0rem;
height: $default-button-height;
margin-bottom: 0;
&.button--emoji {
align-items: center;
background: var(--b-50);
border: 1px solid var(--color-border-light);
border-radius: var(--border-radius-large);
display: flex;
font-size: var(--font-size-small);
height: var(--space-large);
justify-content: center;
padding: var(--space-micro);
text-align: center;
width: var(--space-large);
&:hover {
background: var(--b-200);
}
}
.spinner {
padding: 0 var(--space-small);
}
.icon--emoji+.button__content {
padding-left: var(--space-small);
}
.icon--font+.button__content {
padding-left: var(--space-small);
}
// @TODDO - Remove after moving all buttons to woot-button
.icon+.button__content {
padding-left: var(--space-small);
}
@@ -48,23 +41,23 @@
// Smooth style
&.smooth {
@include button-style(var(--w-100), var(--w-50), var(--w-700));
@include button-style(var(--w-50), var(--w-100), var(--w-700));
&.secondary {
@include button-style(var(--s-100), var(--s-50), var(--s-700));
@include button-style(var(--s-50), var(--s-100), var(--s-700));
}
&.success {
@include button-style(var(--g-100), var(--g-50), var(--g-700));
@include button-style(var(--g-50), var(--g-100), var(--g-700));
}
&.alert {
@include button-style(var(--r-100), var(--r-50), var(--r-700));
@include button-style(var(--r-50), var(--r-100), var(--r-700));
}
&.warning {
@include button-style(var(--y-200), var(--y-100), var(--y-900));
@include button-style(var(--y-100), var(--y-200), var(--y-900));
}
}
@@ -81,6 +74,25 @@
height: var(--space-larger);
}
&.button--only-icon {
justify-content: center;
padding-left: 0;
padding-right: 0;
width: $default-button-height;
&.tiny {
width: var(--space-medium);
}
&.small {
width: var(--space-large);
}
&.large {
width: var(--space-larger);
}
}
&.link {
height: auto;
margin: 0;

21
app/javascript/dashboard/assets/scss/widgets/_reply-box.scss
View File

@@ -52,25 +52,4 @@
}
}
.file-uploads>label {
cursor: pointer;
&:hover .button--emoji {
background: var(--b-200);
}
}
.bottom-box .button--emoji.button--upload {
padding: 0;
.file-uploads {
height: 100%;
line-height: var(--space-large);
width: 100%;
}
label {
padding: var(--space-small);
}
}
}