diff --git a/app/javascript/dashboard/assets/images/agent.svg b/app/javascript/dashboard/assets/images/agent.svg
deleted file mode 100644
index b0e83fbf4..000000000
--- a/app/javascript/dashboard/assets/images/agent.svg
+++ /dev/null
@@ -1,25 +0,0 @@
-
-
\ No newline at end of file
diff --git a/app/javascript/dashboard/assets/images/canned.svg b/app/javascript/dashboard/assets/images/canned.svg
deleted file mode 100644
index 29dabd34c..000000000
--- a/app/javascript/dashboard/assets/images/canned.svg
+++ /dev/null
@@ -1,13 +0,0 @@
-
-
\ No newline at end of file
diff --git a/app/javascript/dashboard/assets/scss/_variables.scss b/app/javascript/dashboard/assets/scss/_variables.scss
index 09a639648..1798d918b 100644
--- a/app/javascript/dashboard/assets/scss/_variables.scss
+++ b/app/javascript/dashboard/assets/scss/_variables.scss
@@ -59,6 +59,9 @@ $secondary-color: #35c5ff;
$success-color: #44ce4b;
$warning-color: #ffc532;
$alert-color: #ff382d;
+
+$masked-bg: rgba(0, 0, 0, .4);
+
// Color-palettes
$color-primary-light: #c7e3ff;
@@ -70,8 +73,6 @@ $thumbnail-radius: 4rem;
// chat-header
$conv-header-height: 4rem;
-// login
-
// Inbox List
$inbox-thumb-size: 4.8rem;
diff --git a/app/javascript/dashboard/assets/scss/widgets/_buttons.scss b/app/javascript/dashboard/assets/scss/widgets/_buttons.scss
index 5d3486aec..7e141d30e 100644
--- a/app/javascript/dashboard/assets/scss/widgets/_buttons.scss
+++ b/app/javascript/dashboard/assets/scss/widgets/_buttons.scss
@@ -1,4 +1,6 @@
.button {
+ margin-bottom: 0;
+
&.icon {
padding-left: $space-normal;
padding-right: $space-normal;
diff --git a/app/javascript/dashboard/assets/scss/widgets/_modal.scss b/app/javascript/dashboard/assets/scss/widgets/_modal.scss
index 641400b1e..0ae8ecf21 100644
--- a/app/javascript/dashboard/assets/scss/widgets/_modal.scss
+++ b/app/javascript/dashboard/assets/scss/widgets/_modal.scss
@@ -1,8 +1,10 @@
-.modal-mask {
+@import '~dashboard/assets/scss/variables';
+@import '~dashboard/assets/scss/mixins';
+.modal-mask {
@include flex;
@include flex-align(center, middle);
- background-color: $color-white;
+ background-color: $masked-bg;
height: 100%;
left: 0;
position: fixed;
@@ -19,8 +21,8 @@
line-height: $space-normal;
padding: $space-normal $space-two;
position: absolute;
- right: $space-large;
- top: $space-large;
+ right: $space-micro;
+ top: $space-micro;
&:hover {
background: $color-background;
@@ -29,7 +31,7 @@
.page-top-bar {
- @include padding($zero $space-two);
+ @include padding($space-large $space-large $zero);
img {
max-height: 6rem;
@@ -37,8 +39,10 @@
}
.modal-container {
+ @include normal-shadow;
+
background-color: $color-white;
- border-radius: $space-small;
+ border-radius: $space-smaller;
max-height: 100%;
overflow: auto;
position: relative;
@@ -52,21 +56,21 @@
h2 {
+ color: $color-heading;
font-size: $font-size-medium;
- color: $color-woot;
- font-weight: $font-weight-normal;
- @include padding($space-small $zero $zero $zero);
+ font-weight: $font-weight-bold;
}
p {
- font-size: $font-size-small;
- @include padding($zero);
@include margin($zero);
+ @include padding($zero);
+ font-size: $font-size-small;
}
form {
+ @include padding($space-large);
align-self: center;
- @include padding($space-two);
+
a {
@include padding($space-normal);
}
@@ -74,15 +78,16 @@
.modal-footer {
@include flex;
- @include flex-align($x: justify, $y: middle);
- @include padding($space-small $zero $space-medium $zero);
+ @include flex-align($x: flex-start, $y: middle);
+ @include padding($space-small $zero);
+
button {
font-size: $font-size-small;
}
}
.delete-item {
- @include padding($space-normal);
+ @include padding($space-large);
button {
@include margin($zero);
}
@@ -90,12 +95,12 @@
}
-.modal-enter, .modal-leave {
- opacity: 0;
+.modal-enter,
+.modal-leave {
+ opacity: 0;
}
.modal-enter .modal-container,
.modal-leave .modal-container {
- -webkit-transform: scale(1.1);
- transform: scale(1.1);
+ transform: scale(1.1);
}
diff --git a/app/javascript/dashboard/assets/scss/widgets/_woot-tables.scss b/app/javascript/dashboard/assets/scss/widgets/_woot-tables.scss
index d229c0738..d47d6ee4c 100644
--- a/app/javascript/dashboard/assets/scss/widgets/_woot-tables.scss
+++ b/app/javascript/dashboard/assets/scss/widgets/_woot-tables.scss
@@ -1,6 +1,6 @@
table {
- font-size: $font-size-small;
border-spacing: 0;
+ font-size: $font-size-small;
thead {
th {
@@ -10,9 +10,12 @@ table {
}
tbody {
+ tr {
+ border-bottom: 1px solid $color-border-light;
+ }
+
td {
@include padding($space-one $space-small);
- border-bottom: 1px solid $color-border-light;
}
}
}
@@ -32,22 +35,22 @@ table {
}
.agent-name {
- font-weight: $font-weight-medium;
display: block;
+ font-weight: $font-weight-medium;
text-transform: capitalize;
}
.woot-thumbnail {
border-radius: 50%;
- width: 5rem;
height: 5rem;
+ width: 5rem;
}
.button-wrapper {
- min-width: 20rem;
- @include flex;
@include flex-align(left, null);
+ @include flex;
flex-direction: row;
+ min-width: 20rem;
}
.button {
diff --git a/app/javascript/dashboard/components/Modal.vue b/app/javascript/dashboard/components/Modal.vue
index b7d9489fb..6838b308c 100644
--- a/app/javascript/dashboard/components/Modal.vue
+++ b/app/javascript/dashboard/components/Modal.vue
@@ -6,8 +6,8 @@
transition="modal"
@click="onBackDropClick"
>
-
+
diff --git a/app/javascript/dashboard/components/index.js b/app/javascript/dashboard/components/index.js
index d7b40b4b9..67a678d79 100644
--- a/app/javascript/dashboard/components/index.js
+++ b/app/javascript/dashboard/components/index.js
@@ -1,14 +1,15 @@
/* eslint no-plusplus: 0 */
/* eslint-env browser */
-import Spinner from 'shared/components/Spinner';
import Bar from './widgets/chart/BarChart';
import Code from './Code';
+import DeleteModal from './widgets/modal/DeleteModal.vue';
import LoadingState from './widgets/LoadingState';
import Modal from './Modal';
import ModalHeader from './ModalHeader';
import ReportStatsCard from './widgets/ReportStatsCard';
import SidemenuIcon from './SidemenuIcon';
+import Spinner from 'shared/components/Spinner';
import SubmitButton from './buttons/FormSubmitButton';
import Tabs from './ui/Tabs/Tabs';
import TabsItem from './ui/Tabs/TabsItem';
@@ -16,6 +17,7 @@ import TabsItem from './ui/Tabs/TabsItem';
const WootUIKit = {
Bar,
Code,
+ DeleteModal,
LoadingState,
Modal,
ModalHeader,
diff --git a/app/javascript/dashboard/routes/dashboard/settings/agents/DeleteAgent.vue b/app/javascript/dashboard/components/widgets/modal/DeleteModal.vue
similarity index 77%
rename from app/javascript/dashboard/routes/dashboard/settings/agents/DeleteAgent.vue
rename to app/javascript/dashboard/components/widgets/modal/DeleteModal.vue
index 221d455ea..fda78595b 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/agents/DeleteAgent.vue
+++ b/app/javascript/dashboard/components/widgets/modal/DeleteModal.vue
@@ -2,18 +2,18 @@
diff --git a/app/javascript/dashboard/routes/dashboard/settings/canned/EditCanned.vue b/app/javascript/dashboard/routes/dashboard/settings/canned/EditCanned.vue
index dd578a56a..5645d375c 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/canned/EditCanned.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/canned/EditCanned.vue
@@ -18,8 +18,9 @@
diff --git a/app/javascript/dashboard/routes/dashboard/settings/canned/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/canned/Index.vue
index db8e77971..95065f547 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/canned/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/canned/Index.vue
@@ -87,7 +87,7 @@
-
-
-
-
-
-
-
-
-
diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/Index.vue
index 414c246ab..5b0049b89 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/inbox/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/Index.vue
@@ -94,7 +94,7 @@
:inbox="selectedInbox"
/>
-
-
-
-
-
-
-
-
diff --git a/app/javascript/dashboard/routes/dashboard/settings/integrations/New.vue b/app/javascript/dashboard/routes/dashboard/settings/integrations/New.vue
index b3a1f4c8f..cf73436f6 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/integrations/New.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/integrations/New.vue
@@ -33,9 +33,9 @@
:button-text="$t('INTEGRATION_SETTINGS.WEBHOOK.ADD.FORM.SUBMIT')"
:loading="addWebHook.showLoading"
/>
-
+
+
diff --git a/app/javascript/dashboard/routes/dashboard/settings/integrations/Webhook.vue b/app/javascript/dashboard/routes/dashboard/settings/integrations/Webhook.vue
index c16766df7..980f16b05 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/integrations/Webhook.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/integrations/Webhook.vue
@@ -70,7 +70,7 @@
-