![](\"/images/$logo\")
" : '',
+ 'logo' => $logo ? "
-
-
-
-
-
Loading
${code}
${code}
').appendTo(container)[0])
+ form.$root = this
+ form.$toast = this.$toast
+ dialog = $(form.$el)
+ }
+
+ dialog.on('shown.bs.modal', () => {
+ dialog.find('input').first().focus()
+ }).modal()
+ },
userStatusClass(user) {
if (user.isDeleted) {
return 'text-muted'
}
if (user.isSuspended) {
return 'text-warning'
}
if (!user.isImapReady || !user.isLdapReady) {
return 'text-danger'
}
return 'text-success'
},
userStatusText(user) {
if (user.isDeleted) {
return 'Deleted'
}
if (user.isSuspended) {
return 'Suspended'
}
if (!user.isImapReady || !user.isLdapReady) {
return 'Not Ready'
}
return 'Active'
+ },
+ updateBodyClass(name) {
+ // Add 'class' attribute to the body, different for each page
+ // so, we can apply page-specific styles
+ let className = 'page-' + (name || this.pageName()).replace(/\/.*$/, '')
+ $(document.body).removeClass().addClass(className)
}
}
})
// Add a axios request interceptor
window.axios.interceptors.request.use(
config => {
// This is the only way I found to change configuration options
// on a running application. We need this for browser testing.
config.headers['X-Test-Payment-Provider'] = window.config.paymentProvider
return config
},
error => {
// Do something with request error
return Promise.reject(error)
}
)
// Add a axios response interceptor for general/validation error handler
window.axios.interceptors.response.use(
response => {
// Do nothing
return response
},
error => {
let error_msg
let status = error.response ? error.response.status : 200
// Do not display the error in a toast message, pass the error as-is
if (error.config.ignoreErrors) {
return Promise.reject(error)
}
if (error.response && status == 422) {
error_msg = "Form validation error"
const modal = $('div.modal.show')
$(modal.length ? modal : 'form').each((i, form) => {
form = $(form)
$.each(error.response.data.errors || {}, (idx, msg) => {
const input_name = (form.data('validation-prefix') || form.find('form').first().data('validation-prefix') || '') + idx
let input = form.find('#' + input_name)
if (!input.length) {
input = form.find('[name="' + input_name + '"]');
}
if (input.length) {
// Create an error message\
// API responses can use a string, array or object
let msg_text = ''
if ($.type(msg) !== 'string') {
$.each(msg, (index, str) => {
msg_text += str + ' '
})
}
else {
msg_text = msg
}
let feedback = $('
diff --git a/src/resources/vue/404.vue b/src/resources/vue/404.vue
deleted file mode 100644
index 04e64cc3..00000000
--- a/src/resources/vue/404.vue
+++ /dev/null
@@ -1,6 +0,0 @@
-
-
¹ applied discount: {{ discount }}% - {{ discount_description }}
diff --git a/src/resources/vue/App.vue b/src/resources/vue/App.vue
index ba55af7a..53adfeb0 100644
--- a/src/resources/vue/App.vue
+++ b/src/resources/vue/App.vue
@@ -1,50 +1,93 @@
-
').text(msg_text)
if (input.is('.list-input')) {
// List input widget
input.children(':not(:first-child)').each((index, element) => {
if (msg[index]) {
$(element).find('input').addClass('is-invalid')
}
})
input.addClass('is-invalid').next('.invalid-feedback').remove()
input.after(feedback)
}
else {
// Standard form element
input.addClass('is-invalid')
input.parent().find('.invalid-feedback').remove()
input.parent().append(feedback)
}
}
})
form.find('.is-invalid:not(.listinput-widget)').first().focus()
})
}
else if (error.response && error.response.data) {
error_msg = error.response.data.message
}
else {
error_msg = error.request ? error.request.statusText : error.message
}
app.$toast.error(error_msg || "Server Error")
// Pass the error as-is
return Promise.reject(error)
}
)
+
+// TODO: Investigate if we can use App component's childMounted() method instead
+window.router.afterEach((to, from) => {
+ // When changing a page remove old:
+ // - error page
+ // - modal backdrop
+ $('#error-page,.modal-backdrop.show').remove()
+
+ app.updateBodyClass()
+})
diff --git a/src/resources/js/bootstrap.js b/src/resources/js/bootstrap.js
index 88b4aecd..d12f5c26 100644
--- a/src/resources/js/bootstrap.js
+++ b/src/resources/js/bootstrap.js
@@ -1,101 +1,94 @@
/**
* We'll load jQuery and the Bootstrap jQuery plugin which provides support
* for JavaScript based Bootstrap features such as modals and tabs. This
* code may be modified to fit the specific needs of your application.
*/
window.Popper = require('popper.js').default
window.$ = window.jQuery = require('jquery')
require('bootstrap')
/**
* We'll load Vue, VueRouter and global components
*/
import FontAwesomeIcon from './fontawesome'
import VueRouter from 'vue-router'
import Toast from '../vue/Widgets/Toast'
import store from './store'
window.Vue = require('vue')
Vue.component('svg-icon', FontAwesomeIcon)
const vTooltip = (el, binding) => {
const t = []
if (binding.modifiers.focus) t.push('focus')
if (binding.modifiers.hover) t.push('hover')
if (binding.modifiers.click) t.push('click')
if (!t.length) t.push('hover')
$(el).tooltip({
title: binding.value,
placement: binding.arg || 'top',
trigger: t.join(' '),
html: !!binding.modifiers.html,
});
}
Vue.directive('tooltip', {
bind: vTooltip,
update: vTooltip,
unbind (el) {
$(el).tooltip('dispose')
}
})
Vue.use(Toast)
Vue.use(VueRouter)
let vueRouterBase = '/'
try {
let url = new URL(window.config['app.url'])
vueRouterBase = url.pathname
} catch(e) {
// ignore
}
window.router = new VueRouter({
base: vueRouterBase,
mode: 'history',
routes: window.routes,
scrollBehavior (to, from, savedPosition) {
// Scroll the page to top, but not on Back action
return savedPosition || { x: 0, y: 0 }
}
})
router.beforeEach((to, from, next) => {
// check if the route requires authentication and user is not logged in
if (to.matched.some(route => route.meta.requiresAuth) && !store.state.isLoggedIn) {
// remember the original request, to use after login
store.state.afterLogin = to;
// redirect to login page
next({ name: 'login' })
return
}
next()
})
-router.afterEach((to, from) => {
- // When changing a page remove old:
- // - error page
- // - modal backdrop
- $('#error-page,.modal-backdrop.show').remove()
-})
-
/**
* We'll load the axios HTTP library which allows us to easily issue requests
* to our Laravel back-end. This library automatically handles sending the
* CSRF token as a header based on the value of the "XSRF" token cookie.
*/
window.axios = require('axios')
axios.defaults.baseURL = vueRouterBase
axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest'
diff --git a/src/resources/js/fontawesome.js b/src/resources/js/fontawesome.js
index 18fc16a8..aadaba73 100644
--- a/src/resources/js/fontawesome.js
+++ b/src/resources/js/fontawesome.js
@@ -1,57 +1,59 @@
import { library } from '@fortawesome/fontawesome-svg-core'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
//import { } from '@fortawesome/free-brands-svg-icons'
import {
faCheckSquare,
faCreditCard,
faSquare,
} from '@fortawesome/free-regular-svg-icons'
import {
faCheck,
faCheckCircle,
faComments,
faDownload,
+ faEnvelope,
faGlobe,
faExclamationCircle,
faInfoCircle,
faLock,
faKey,
faPlus,
faSearch,
faSignInAlt,
faSyncAlt,
faTrashAlt,
faUser,
faUserCog,
faUsers,
faWallet
} from '@fortawesome/free-solid-svg-icons'
// Register only these icons we need
library.add(
faCheck,
faCheckCircle,
faCheckSquare,
faComments,
faCreditCard,
faDownload,
+ faEnvelope,
faExclamationCircle,
faGlobe,
faInfoCircle,
faLock,
faKey,
faPlus,
faSearch,
faSignInAlt,
faSquare,
faSyncAlt,
faTrashAlt,
faUser,
faUserCog,
faUsers,
faWallet
)
export default FontAwesomeIcon
diff --git a/src/resources/js/routes-admin.js b/src/resources/js/routes-admin.js
index 27665db2..c34aa428 100644
--- a/src/resources/js/routes-admin.js
+++ b/src/resources/js/routes-admin.js
@@ -1,48 +1,48 @@
import DashboardComponent from '../vue/Admin/Dashboard'
import DomainComponent from '../vue/Admin/Domain'
-import Error404Component from '../vue/404'
import LoginComponent from '../vue/Login'
import LogoutComponent from '../vue/Logout'
+import PageComponent from '../vue/Page'
import UserComponent from '../vue/Admin/User'
const routes = [
{
path: '/',
redirect: { name: 'dashboard' }
},
{
path: '/dashboard',
name: 'dashboard',
component: DashboardComponent,
meta: { requiresAuth: true }
},
{
path: '/domain/:domain',
name: 'domain',
component: DomainComponent,
meta: { requiresAuth: true }
},
{
path: '/login',
name: 'login',
component: LoginComponent
},
{
path: '/logout',
name: 'logout',
component: LogoutComponent
},
{
path: '/user/:user',
name: 'user',
component: UserComponent,
meta: { requiresAuth: true }
},
{
name: '404',
path: '*',
- component: Error404Component
+ component: PageComponent
}
]
export default routes
diff --git a/src/resources/js/routes-user.js b/src/resources/js/routes-user.js
index fd0c89c3..a083dbc5 100644
--- a/src/resources/js/routes-user.js
+++ b/src/resources/js/routes-user.js
@@ -1,103 +1,99 @@
import DashboardComponent from '../vue/Dashboard'
import DomainInfoComponent from '../vue/Domain/Info'
import DomainListComponent from '../vue/Domain/List'
-import Error404Component from '../vue/404'
import LoginComponent from '../vue/Login'
import LogoutComponent from '../vue/Logout'
import MeetComponent from '../vue/Rooms'
+import PageComponent from '../vue/Page'
import PasswordResetComponent from '../vue/PasswordReset'
import SignupComponent from '../vue/Signup'
import UserInfoComponent from '../vue/User/Info'
import UserListComponent from '../vue/User/List'
import UserProfileComponent from '../vue/User/Profile'
import UserProfileDeleteComponent from '../vue/User/ProfileDelete'
import WalletComponent from '../vue/Wallet'
const routes = [
- {
- path: '/',
- redirect: { name: 'dashboard' }
- },
{
path: '/dashboard',
name: 'dashboard',
component: DashboardComponent,
meta: { requiresAuth: true }
},
{
path: '/domain/:domain',
name: 'domain',
component: DomainInfoComponent,
meta: { requiresAuth: true }
},
{
path: '/domains',
name: 'domains',
component: DomainListComponent,
meta: { requiresAuth: true }
},
{
path: '/login',
name: 'login',
component: LoginComponent
},
{
path: '/logout',
name: 'logout',
component: LogoutComponent
},
{
path: '/password-reset/:code?',
name: 'password-reset',
component: PasswordResetComponent
},
{
path: '/profile',
name: 'profile',
component: UserProfileComponent,
meta: { requiresAuth: true }
},
{
path: '/profile/delete',
name: 'profile-delete',
component: UserProfileDeleteComponent,
meta: { requiresAuth: true }
},
{
path: '/rooms',
name: 'rooms',
component: MeetComponent,
meta: { requiresAuth: true }
},
{
path: '/signup/:param?',
alias: '/signup/voucher/:param',
name: 'signup',
component: SignupComponent
},
{
path: '/user/:user',
name: 'user',
component: UserInfoComponent,
meta: { requiresAuth: true }
},
{
path: '/users',
name: 'users',
component: UserListComponent,
meta: { requiresAuth: true }
},
{
path: '/wallet',
name: 'wallet',
component: WalletComponent,
meta: { requiresAuth: true }
},
{
name: '404',
path: '*',
- component: Error404Component
+ component: PageComponent
}
]
export default routes
diff --git a/src/resources/lang/en/app.php b/src/resources/lang/en/app.php
index 76974430..97790828 100644
--- a/src/resources/lang/en/app.php
+++ b/src/resources/lang/en/app.php
@@ -1,56 +1,59 @@
'The auto-payment has been removed.',
'mandate-update-success' => 'The auto-payment has been updated.',
'planbutton' => 'Choose :plan',
'process-user-new' => 'Registering a user...',
'process-user-ldap-ready' => 'Creating a user...',
'process-user-imap-ready' => 'Creating a mailbox...',
'process-domain-new' => 'Registering a custom domain...',
'process-domain-ldap-ready' => 'Creating a custom domain...',
'process-domain-verified' => 'Verifying a custom domain...',
'process-domain-confirmed' => 'Verifying an ownership of a custom domain...',
'process-success' => 'Setup process finished successfully.',
'process-error-user-ldap-ready' => 'Failed to create a user.',
'process-error-user-imap-ready' => 'Failed to verify that a mailbox exists.',
'process-error-domain-ldap-ready' => 'Failed to create a domain.',
'process-error-domain-verified' => 'Failed to verify a domain.',
'process-error-domain-confirmed' => 'Failed to verify an ownership of a domain.',
'domain-verify-success' => 'Domain verified successfully.',
'domain-verify-error' => 'Domain ownership verification failed.',
'domain-suspend-success' => 'Domain suspended successfully.',
'domain-unsuspend-success' => 'Domain unsuspended successfully.',
'user-update-success' => 'User data updated successfully.',
'user-create-success' => 'User created successfully.',
'user-delete-success' => 'User deleted successfully.',
'user-suspend-success' => 'User suspended successfully.',
'user-unsuspend-success' => 'User unsuspended successfully.',
'user-reset-2fa-success' => '2-Factor authentication reset successfully.',
'search-foundxdomains' => ':x domains have been found.',
'search-foundxusers' => ':x user accounts have been found.',
+ 'support-request-success' => 'Support request submitted successfully.',
+ 'support-request-error' => 'Failed to submit the support request.',
+
'wallet-award-success' => 'The bonus has been added to the wallet successfully.',
'wallet-penalty-success' => 'The penalty has been added to the wallet successfully.',
'wallet-update-success' => 'User wallet updated successfully.',
'wallet-notice-date' => 'With your current subscriptions your account balance will last until about :date (:days).',
'wallet-notice-nocredit' => 'You are out of credit, top up your balance now.',
'wallet-notice-today' => 'You will run out of credit today, top up your balance now.',
'wallet-notice-trial' => 'You are in your free trial period.',
'wallet-notice-trial-end' => 'Your free trial is about to end, top up to continue.',
];
diff --git a/src/resources/themes/README.md b/src/resources/themes/README.md
new file mode 100644
index 00000000..3a07c189
--- /dev/null
+++ b/src/resources/themes/README.md
@@ -0,0 +1,65 @@
+## THEMES
+
+### Creating a theme
+
+1. First create the theme directory and content by copying the default theme:
+
+```
+cp resources/themes/default resources/themes/mytheme
+```
+
+2. Compile resources. This will also make sure to copy static files (e.g. images)
+ to `public/themes/`:
+
+```
+npm run prod
+```
+
+3. Configure the app to use your new theme (in .env file):
+
+```
+APP_THEME=mytheme
+```
+
+### Styles
+
+The main theme directory should include following files:
+
+- "theme.json": Theme metadata, e.g. menu definition.
+- "app.scss": The app styles.
+- "document.scss": Documents styles.
+- "images/logo_header.png": An image that is not controlled by the theme (yet).
+- "images/logo_footer.png": An image that is not controlled by the theme (yet).
+- "images/favicon.ico": An image that is not controlled by the theme (yet).
+
+Note: Applying some styles to `` or other elements outside of the template
+content can be done using `.page-` class that is always added to the ``.
+
+### Menu definition
+
+The menu items are defined using "menu" property in `theme.json` file.
+It should be an array of object. Here are all available properties for such an object.
+
+- "title" (string): The displayed label for the menu item. Required.
+- "location" (string): The page location. Can be a full URL (for external pages)
+ or relative path starting with a slash for internal locations. Required.
+- "page" (string): The name of the page. Required for internal pages.
+ This is the first element of the page template file which should exist
+ in `resources/themes//pages/` directory. The template file name should be
+ `.blade.php`.
+- "footer" (bool): Whether the menu should appear only in the footer menu.
+
+Note that menu definition should not include special pages like "Signup", "Contact" or "Login".
+
+### Page templates
+
+Page content templates placed in `resources/themes//pages/` directory are
+Blade templates. Some notes about that:
+
+- the content will be placed inside the page layout so you should not use nor
+ nor even a wrapper
diff --git a/src/resources/themes/default/theme.json b/src/resources/themes/default/theme.json
new file mode 100644
index 00000000..83a03023
--- /dev/null
+++ b/src/resources/themes/default/theme.json
@@ -0,0 +1,41 @@
+{
+ "menu": [
+ {
+ "title": "Explore",
+ "location": "https://kolabnow.com/",
+ "admin": true
+ },
+ {
+ "title": "Blog",
+ "location": "https://blogs.kolabnow.com/",
+ "admin": true
+ },
+ {
+ "title": "Support",
+ "location": "/support",
+ "page": "support",
+ "admin": true
+ },
+ {
+ "title": "ToS",
+ "location": "https://kolabnow.com/tos",
+ "footer": true
+ }
+ ],
+ "faq": {
+ "signup": [
+ {
+ "href": "https://kolabnow.com/tos",
+ "title": "What are your terms of service?"
+ },
+ {
+ "href": "https://kb.kolabnow.com/faq/can-i-upgrade-an-individual-account-to-a-group-account",
+ "title": "Can I upgrade an individual account to a group account?"
+ },
+ {
+ "href": "https://kb.kolabnow.com/faq/how-much-storage-comes-with-my-account",
+ "title": "How much storage comes with my account?"
+ }
+ ]
+ }
+}
diff --git a/src/resources/sass/document.scss b/src/resources/themes/document.scss
similarity index 97%
rename from src/resources/sass/document.scss
rename to src/resources/themes/document.scss
index e873ff91..efc3e3dd 100644
--- a/src/resources/sass/document.scss
+++ b/src/resources/themes/document.scss
@@ -1,118 +1,115 @@
-// Variables
-@import 'variables';
-
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: normal;
src: url('../fonts/Roboto-Regular.ttf') format('truetype');
}
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 700;
src: url('../fonts/Roboto-Bold.ttf') format('truetype');
}
body {
font-family: Roboto, sans-serif;
margin: 20pt;
}
a {
text-decoration: none;
color: $main-color;
}
h1 {
text-align: center;
margin: 30pt;
font-size: 20pt;
}
table {
width: 100%;
&.content {
border-spacing: initial;
th {
padding: 5px;
background-color: #f4f4f4;
border-top: 1px solid #eee;
}
td {
padding: 5px;
border-bottom: 1px solid #eee;
}
}
&.head {
margin-bottom: 1em;
}
td.idents {
white-space: nowrap;
width: 1%;
text-align: right;
vertical-align: top;
font-size: 10pt;
}
.price {
width: 150px;
text-align: right;
white-space: nowrap;
}
td.logo {
width: 1%;
}
td.description {
width: 98%;
}
tr.total {
background-color: #f4f4f4;
}
tr.vat td,
tr.subtotal td {
border-bottom: 0;
}
}
#footer {
font-size: 10pt;
color: gray;
text-align: center;
padding-top: 5pt;
position: absolute;
margin: 20pt;
bottom: 0;
left: 0;
right: 0;
@media print {
margin-bottom: 0;
}
}
.bold {
font-weight: bold;
}
.gray {
color: gray;
}
.align-right {
text-align: right;
}
.align-left {
text-align: left;
}
diff --git a/src/resources/sass/forms.scss b/src/resources/themes/forms.scss
similarity index 100%
rename from src/resources/sass/forms.scss
rename to src/resources/themes/forms.scss
diff --git a/src/resources/sass/menu.scss b/src/resources/themes/menu.scss
similarity index 100%
rename from src/resources/sass/menu.scss
rename to src/resources/themes/menu.scss
index e02f713b..58f683b5 100644
--- a/src/resources/sass/menu.scss
+++ b/src/resources/themes/menu.scss
@@ -1,151 +1,151 @@
#header-menu {
background-color: $menu-bg-color;
padding: 0;
line-height: 85px;
.navbar-brand {
padding: 0;
outline: 0;
> img {
display: inline;
vertical-align: middle;
}
}
.nav-link {
color: #202020;
line-height: 85px;
padding: 0 0 0 25px;
background: transparent;
&:focus {
text-decoration: underline;
outline: 0;
}
&:hover {
color: $main-color;
text-decoration: underline;
}
&.active:not(.menulogin) {
font-weight: bold;
}
}
}
#footer-menu {
background-color: $main-color;
height: 100px;
overflow: hidden;
.navbar-brand {
margin: 0;
img {
width: 170px;
}
}
.footer {
text-align: right;
color: #fff;
font-size: 0.75rem;
padding: 0 0.5rem;
}
}
@include media-breakpoint-up(lg) {
#header-menu {
a.menulogin {
text-transform: uppercase;
border: 2px solid $main-color;
border-radius: 21px;
line-height: 21px;
letter-spacing: 1px;
padding: 6px 34px;
margin: 25px 0 25px 25px;
&:focus,
&:hover {
text-decoration: none;
background-color: $main-color;
color: #fff;
font-weight: normal;
}
}
}
.navbar {
.navbar {
justify-content: flex-end;
}
}
#footer-menu {
.navbar {
flex-direction: column;
align-items: flex-end;
}
}
}
@include media-breakpoint-down(md) {
#header-menu {
.navbar-nav {
padding-bottom: 1em;
}
.nav-link {
line-height: 45px;
padding: 0;
}
}
#footer-menu {
+ height: 80px;
+
.navbar-nav {
display: none;
}
.container {
flex-wrap: nowrap;
}
}
}
@include media-breakpoint-down(sm) {
#header-menu {
padding: 0 1em;
.navbar-nav {
display: block;
width: 100%;
padding: 0;
li {
border-top: 1px solid #eee;
}
}
}
#footer-menu {
- height: 80px;
-
.container {
flex-direction: column;
}
#footer-company {
display: none;
}
}
}
@media (max-width: 340px) {
#header-menu {
.navbar-brand img {
width: 160px;
}
}
}
diff --git a/src/resources/sass/toast.scss b/src/resources/themes/toast.scss
similarity index 100%
rename from src/resources/sass/toast.scss
rename to src/resources/themes/toast.scss
diff --git a/src/resources/views/documents/receipt.blade.php b/src/resources/views/documents/receipt.blade.php
index ce9e9e2c..b4829d7a 100644
--- a/src/resources/views/documents/receipt.blade.php
+++ b/src/resources/views/documents/receipt.blade.php
@@ -1,66 +1,66 @@
.
+- for internal links use `href="/"`. Such links will be handled by
+ Vue router (without page reload).
+- for images or other resource files use `@theme_asset(images/file.jpg)`.
+
+See also: https://laravel.com/docs/6.x/blade
diff --git a/src/resources/sass/app.scss b/src/resources/themes/app.scss
similarity index 98%
rename from src/resources/sass/app.scss
rename to src/resources/themes/app.scss
index 8953d957..ec3abf86 100644
--- a/src/resources/sass/app.scss
+++ b/src/resources/themes/app.scss
@@ -1,433 +1,427 @@
-@import 'variables';
-@import 'bootstrap';
-@import 'meet';
-@import 'menu';
-@import 'toast';
-@import 'forms';
-
html,
body,
body > .outer-container {
height: 100%;
}
#app {
display: flex;
flex-direction: column;
min-height: 100%;
overflow: hidden;
& > nav {
flex-shrink: 0;
z-index: 12;
}
& > div.container {
flex-grow: 1;
margin-top: 2rem;
margin-bottom: 2rem;
}
& > .filler {
flex-grow: 1;
}
& > div.container + .filler {
display: none;
}
}
-#error-page {
+.error-page {
position: absolute;
top: 0;
height: 100%;
width: 100%;
align-items: center;
display: flex;
justify-content: center;
color: #636b6f;
z-index: 10;
background: white;
.code {
text-align: right;
border-right: 2px solid;
font-size: 26px;
padding: 0 15px;
}
.message {
font-size: 18px;
padding: 0 15px;
}
}
.app-loader {
background-color: $body-bg;
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
display: flex;
align-items: center;
justify-content: center;
z-index: 8;
.spinner-border {
width: 120px;
height: 120px;
border-width: 15px;
color: #b2aa99;
}
&.small .spinner-border {
width: 25px;
height: 25px;
border-width: 3px;
}
&.fadeOut {
visibility: hidden;
opacity: 0;
transition: visibility 300ms linear, opacity 300ms linear;
}
}
pre {
margin: 1rem 0;
padding: 1rem;
background-color: $menu-bg-color;
}
.card-title {
font-size: 1.2rem;
font-weight: bold;
}
tfoot.table-fake-body {
background-color: #f8f8f8;
color: grey;
text-align: center;
td {
vertical-align: middle;
height: 8em;
border: 0;
}
tbody:not(:empty) + & {
display: none;
}
}
table {
td.buttons,
td.email,
td.price,
td.datetime,
td.selection {
width: 1%;
white-space: nowrap;
}
th.price,
td.price {
width: 1%;
text-align: right;
white-space: nowrap;
}
&.form-list {
margin: 0;
td {
border: 0;
&:first-child {
padding-left: 0;
}
&:last-child {
padding-right: 0;
}
}
button {
line-height: 1;
}
}
.btn-action {
line-height: 1;
padding: 0;
}
}
.list-details {
min-height: 1em;
& > ul {
margin: 0;
padding-left: 1.2em;
}
}
.plan-selector {
.plan-ico {
font-size: 3.8rem;
color: #f1a539;
border: 3px solid #f1a539;
width: 6rem;
height: 6rem;
margin-bottom: 1rem;
border-radius: 50%;
}
}
.plan-description {
& > ul {
padding-left: 1.2em;
&:last-child {
margin-bottom: 0;
}
}
}
.status-message {
display: flex;
align-items: center;
justify-content: center;
.app-loader {
width: auto;
position: initial;
.spinner-border {
color: $body-color;
}
}
svg {
font-size: 1.5em;
}
:first-child {
margin-right: 0.4em;
}
}
.form-separator {
position: relative;
margin: 1em 0;
display: flex;
justify-content: center;
hr {
border-color: #999;
margin: 0;
position: absolute;
top: 0.75em;
width: 100%;
}
span {
background: #fff;
padding: 0 1em;
z-index: 1;
}
}
#status-box {
background-color: lighten($green, 35);
.progress {
background-color: #fff;
height: 10px;
}
.progress-label {
font-size: 0.9em;
}
.progress-bar {
background-color: $green;
}
&.process-failed {
background-color: lighten($orange, 30);
.progress-bar {
background-color: $red;
}
}
}
@keyframes blinker {
50% {
opacity: 0;
}
}
.blinker {
animation: blinker 750ms step-start infinite;
}
#dashboard-nav {
display: flex;
flex-wrap: wrap;
justify-content: center;
& > a {
padding: 1rem;
text-align: center;
white-space: nowrap;
margin: 0.25rem;
text-decoration: none;
width: 150px;
&.disabled {
pointer-events: none;
opacity: 0.6;
}
.badge {
position: absolute;
top: 0.5rem;
right: 0.5rem;
}
}
svg {
width: 6rem;
height: 6rem;
margin: auto;
}
}
// Various improvements for mobile
@include media-breakpoint-down(sm) {
- .card {
+ .card,
+ .card-footer {
border: 0;
}
.card-body {
padding: 0.5rem 0;
}
.form-group {
margin-bottom: 0.5rem;
}
.nav-tabs {
flex-wrap: nowrap;
overflow-x: auto;
.nav-link {
white-space: nowrap;
padding: 0.5rem 0.75rem;
}
}
.tab-content {
margin-top: 0.5rem;
}
.col-form-label {
color: #666;
font-size: 95%;
}
.form-group.plaintext .col-form-label {
padding-bottom: 0;
}
form.read-only.short label {
width: 35%;
& + * {
width: 65%;
}
}
#app > div.container {
margin-bottom: 1rem;
margin-top: 1rem;
max-width: 100%;
}
#header-menu-navbar {
padding: 0;
}
#dashboard-nav > a {
width: 135px;
}
.table-sm:not(.form-list) {
tbody td {
padding: 0.75rem 0.5rem;
svg {
vertical-align: -0.175em;
}
& > svg {
font-size: 125%;
margin-right: 0.25rem;
}
}
}
.table.transactions {
thead {
display: none;
}
tbody {
tr {
position: relative;
display: flex;
flex-wrap: wrap;
}
td {
width: auto;
border: 0;
padding: 0.5rem;
&.datetime {
width: 50%;
padding-left: 0;
}
&.description {
order: 3;
width: 100%;
border-bottom: 1px solid $border-color;
color: $secondary;
padding: 0 1.5em 0.5rem 0;
margin-top: -0.25em;
}
&.selection {
position: absolute;
right: 0;
border: 0;
top: 1.7em;
padding-right: 0;
}
&.price {
width: 50%;
padding-right: 0;
}
&.email {
display: none;
}
}
}
}
}
diff --git a/src/resources/sass/bootstrap.scss b/src/resources/themes/bootstrap.scss
similarity index 100%
rename from src/resources/sass/bootstrap.scss
rename to src/resources/themes/bootstrap.scss
diff --git a/src/resources/sass/_variables.scss b/src/resources/themes/default/_variables.scss
similarity index 65%
rename from src/resources/sass/_variables.scss
rename to src/resources/themes/default/_variables.scss
index 7063ee6b..74d0ae15 100644
--- a/src/resources/sass/_variables.scss
+++ b/src/resources/themes/default/_variables.scss
@@ -1,27 +1,17 @@
// Body
$body-bg: #fff;
// Typography
$font-family-sans-serif: 'Nunito', sans-serif;
$font-size-base: 0.9rem;
$line-height-base: 1.5;
// Colors
-$blue: #3490dc;
-$indigo: #6574cd;
-$purple: #9561e2;
-$pink: #f66d9b;
-$red: #e3342f;
$orange: #f1a539;
-$yellow: #ffed4a;
-$green: #38c172;
-$teal: #4dc0b5;
-$cyan: #6cb2eb;
-
$light: #f6f5f3;
// App colors
$menu-bg-color: $light;
$menu-gray: #575656;
$main-color: $orange;
$warning: $orange;
diff --git a/src/resources/themes/default/app.scss b/src/resources/themes/default/app.scss
new file mode 100644
index 00000000..77ad4084
--- /dev/null
+++ b/src/resources/themes/default/app.scss
@@ -0,0 +1,7 @@
+@import 'variables';
+
+@import '../bootstrap';
+@import '../menu';
+@import '../toast';
+@import '../forms';
+@import '../app';
diff --git a/src/resources/themes/default/document.scss b/src/resources/themes/default/document.scss
new file mode 100644
index 00000000..2c9155ba
--- /dev/null
+++ b/src/resources/themes/default/document.scss
@@ -0,0 +1,3 @@
+// Variables
+@import 'variables';
+@import '../document';
diff --git a/src/public/images/favicon.ico b/src/resources/themes/default/images/favicon.ico
similarity index 100%
rename from src/public/images/favicon.ico
rename to src/resources/themes/default/images/favicon.ico
diff --git a/src/public/images/logo.svg b/src/resources/themes/default/images/logo.svg
similarity index 100%
rename from src/public/images/logo.svg
rename to src/resources/themes/default/images/logo.svg
diff --git a/src/public/images/logo_footer.png b/src/resources/themes/default/images/logo_footer.png
similarity index 100%
rename from src/public/images/logo_footer.png
rename to src/resources/themes/default/images/logo_footer.png
diff --git a/src/public/images/logo_header.png b/src/resources/themes/default/images/logo_header.png
similarity index 100%
rename from src/public/images/logo_header.png
rename to src/resources/themes/default/images/logo_header.png
diff --git a/src/public/images/logo_print.svg b/src/resources/themes/default/images/logo_print.svg
similarity index 100%
rename from src/public/images/logo_print.svg
rename to src/resources/themes/default/images/logo_print.svg
diff --git a/src/resources/themes/default/pages/support.blade.php b/src/resources/themes/default/pages/support.blade.php
new file mode 100644
index 00000000..85e6ae3d
--- /dev/null
+++ b/src/resources/themes/default/pages/support.blade.php
@@ -0,0 +1,21 @@
+
+
+
+
+
+
+ Contact Support
+
+ Our technical support team is here to provide help, should you run
+ into issues. You won’t have to talk to computers or navigate voice
+ menus, but have actual human beings answering you personally.
+
+
+ This support is already included in your subscription fee, so
+ there are no further costs for you. If you have issues with your
+ Kolab Now account, or questions about our product before you sign
+ up, please contact us.
+
| {!! $company['header'] !!} | {!! $company['logo'] !!} |
{{ $title }}
| {!! $customer['customer'] !!} |
{{--{{ __('documents.account-id') }} {{ $customer['wallet_id'] }} --}} {{ __('documents.customer-no') }} {{ $customer['id'] }} |
| {{ __('documents.date') }} | {{ __('documents.description') }} | {{ __('documents.amount') }} |
|---|---|---|
| {{ $item['date'] }} | {{ $item['description'] }} | {{ $item['amount'] }} |
| {{ __('documents.subtotal') }} | {{ $subTotal }} | |
| {{ __('documents.vat', ['rate' => $vatRate]) }} | {{ $totalVat }} | |
| {{ __('documents.total') }} | {{ $total }} | |
-
-
diff --git a/src/resources/vue/Admin/User.vue b/src/resources/vue/Admin/User.vue
index 72867877..aead8af1 100644
--- a/src/resources/vue/Admin/User.vue
+++ b/src/resources/vue/Admin/User.vue
@@ -1,644 +1,656 @@
404
-
- {{ user.email }}
Account balance {{ $root.price(wallet.balance) }}
Transactions
| Email address |
|---|
| {{ alias }} |
| This user has no email aliases. |
| Subscription | Price |
|---|---|
| {{ sku.name }} | {{ sku.price }} |
| This user has no subscriptions. | |
¹ applied discount: {{ discount }}% - {{ discount_description }}
| Name |
|---|
|
|
| There are no domains in this account. |
| Primary Email |
|---|
|
|
| There are no users in this account. |
Please sign in
Password Reset - Step 1/3
- Enter your email address to reset your password. You may need to check your spam folder or unblock noreply@kolabnow.com. + Enter your email address to reset your password. + You may need to check your spam folder or unblock {{ fromEmail }}.
Password Reset - Step 2/3
We sent out a confirmation code to your external email address. Enter the code we sent you, or click the link in the message.
Password Reset - Step 3/3
-
diff --git a/src/resources/vue/User/ProfileDelete.vue b/src/resources/vue/User/ProfileDelete.vue
index 6c1174dc..f6a3d99e 100644
--- a/src/resources/vue/User/ProfileDelete.vue
+++ b/src/resources/vue/User/ProfileDelete.vue
@@ -1,49 +1,57 @@
+
Sign Up - Step 1/3
Sign up to start your free month.
Sign Up - Step 2/3
We sent out a confirmation code to your email address. Enter the code we sent you, or click the link in the message.
Sign Up - Step 3/3
Create your Kolab identity (you can choose additional addresses later).
Delete this account?
This will delete the account as well as all domains, users and aliases associated with this account. This operation is irreversible.
As you will not be able to recover anything after this point, please make sure that you have migrated all data before proceeding.
-As we always strive to improve, we would like to ask for 2 minutes of your time. +
+ As we always strive to improve, we would like to ask for 2 minutes of your time. The best tool for improvement is feedback from users, and we would like to ask for a few words about your reasons for leaving our service. Please send your feedback - to support@kolabnow.com.
-Also feel free to contact Kolab Now Support at support@kolabnow.com with any questions + to {{ supportEmail }}. +
+Also feel free to contact {{ appName }} Support with any questions or concerns that you may have in this context.
Account balance {{ $root.price(wallet.balance, wallet.currency) }}
{{ wallet.notice }}
Add credit to your account or setup an automatic payment by using the button below.
Here you can download receipts (in PDF format) for payments in specified period. Select the period and press the Download button.
There are no receipts for payments in this account. Please, note that you can download receipts after the month ends.