+
diff --git a/assets/src/css/base.css b/assets/src/css/base.css
index e6f4018a..54b11660 100644
--- a/assets/src/css/base.css
+++ b/assets/src/css/base.css
@@ -1,8 +1,8 @@
body {
font-family: 'Roboto', sans-serif;
padding-top: 4em;
- background-color: #f8f8f8;
- color: #212121;
+ background-color: #fafafa;
+ color: #333333;
}
* {
@@ -65,6 +65,53 @@ button:hover {
background-color: #1E88E5;
}
+input[type="submit"].block,
+button.block {
+ display: block;
+ width: 100%;
+ margin: 0 0 1em;
+}
+
+button.delete {
+ background: #F44336;
+}
+
+button.delete:hover {
+ background: #D32F2F;
+}
+
+button.cancel {
+ background-color: #ECEFF1;
+ color: #37474F;
+}
+
+button.cancel:hover {
+ background-color: #e9eaeb;
+}
+
+button.flat,
+input[type="submit"].flat {
+ color: #1E88E5;
+ background: transparent;
+ box-shadow: 0 0 0;
+ border: 0;
+ margin-left: 0;
+ text-transform: uppercase;
+}
+
+button.flat:hover,
+input[type="submit"].flat:hover {
+ background: rgba(0,0,0,0.05)
+}
+
+button.flat.delete {
+ color: #F44336;
+}
+
+button.flat.cancel {
+ color: #ccc;
+}
+
.mobile-only {
display: none !important;
}
diff --git a/assets/src/css/dashboard.css b/assets/src/css/dashboard.css
index f7e9b23f..1b93e780 100644
--- a/assets/src/css/dashboard.css
+++ b/assets/src/css/dashboard.css
@@ -1,64 +1,34 @@
.dashboard {
max-width: 600px;
- box-shadow: rgba(0, 0, 0, 0.06) 0px 1px 3px, rgba(0, 0, 0, 0.12) 0px 1px 2px;
- border-radius: .5em;
- background: #fff;
- padding: 1em;
margin: 1em 0;
}
-.dashboard a {
+a {
color: inherit
}
-.dashboard h1 button {
- font-size: 0.5em;
- float: right;
-}
-
-.dashboard table {
- width: 100%;
-}
-
-.dashboard table th {
- font-weight: 500;
- color: #757575;
- text-align: left;
-}
-
-.dashboard table th,
-.dashboard table td {
- padding: .5em 0;
-}
-
-.dashboard table td:last-child {
- width: 1em
-}
-
-.dashboard > h1:first-of-type {
- margin-top: 0;
-}
-
-.dashboard form > p:last-child,
-form.dashboard > p:last-child {
- text-align: right
-}
-
-.dashboard > *:last-child {
- margin-bottom: 0;
-}
-
-.dashboard select,
-.dashboard textarea,
-.dashboard input[type="text"],
-.dashboard input[type="password"] {
- padding: 0;
- line-height: 1.7;
+select,
+textarea,
+input[type="text"],
+input[type="password"] {
+ padding: 0.5em 0;
+ line-height: 1;
display: block;
border: 0;
border-bottom: 1px solid #dddddd;
transition: .2s ease border;
width: 100%;
+ background: transparent;
+}
+
+textarea {
+ line-height: 1.15;
+ padding: .5em;
+ border: 1px solid #ddd;
+ font-family: monospace;
+ min-height: 10em;
+ resize: none;
+ border-radius: 2px;
}
.dashboard #locale,
@@ -69,49 +39,32 @@ form.dashboard > p:last-child {
}
.dashboard #locale {
- border: 1px solid #dddddd;
margin-top: .5em;
}
-.dashboard textarea:focus,
-.dashboard textarea:hover,
-.dashboard input[type="text"]:focus,
-.dashboard input[type="password"]:focus,
-.dashboard input[type="text"]:hover,
-.dashboard input[type="password"]:hover {
+textarea:focus,
+textarea:hover,
+input[type="text"]:focus,
+input[type="password"]:focus,
+input[type="text"]:hover,
+input[type="password"]:hover {
border-color: #2979ff;
}
-.dashboard input.red {
+input.red {
border-color: red;
}
-.dashboard input.green {
+input.green {
border-color: green;
}
-.dashboard button.delete {
- background: #F44336;
-}
-
-.dashboard button.delete:hover {
- background: #D32F2F;
-}
-
-.dashboard textarea {
- line-height: 1.15;
- padding: .5em;
- border: 1px solid #ddd;
- font-family: monospace;
- min-height: 10em;
- resize: vertical;
-}
-
.dashboard p label {
margin-bottom: .2em;
display: block;
font-size: .8em;
- font-weight: bold;
+ font-weight: 500;
+ color: rgba(0, 0, 0, 0.57);
}
li code,
@@ -152,3 +105,256 @@ p code {
font-size: 1em;
vertical-align: middle;
}
+
+table {
+ border-collapse: collapse;
+ width: 100%;
+}
+
+table tr {
+ border-bottom: 1px solid #ccc;
+}
+
+table tr:last-child {
+ border: 0;
+}
+
+table th {
+ font-weight: 500;
+ color: #757575;
+ text-align: left;
+}
+
+table th,
+table td {
+ padding: .5em 0;
+}
+
+table td.small {
+ width: 1em;
+}
+
+table tr>*:first-child {
+ padding-left: 1em;
+}
+
+table tr>*:last-child {
+ padding-right: 1em;
+}
+
+.card {
+ position: relative;
+ margin: .5rem 0 1rem 0;
+ background-color: #fff;
+ border-radius: 2px;
+ box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
+}
+
+.card.floating {
+ position: fixed;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ z-index: 99999;
+ max-width: 25em;
+ width: 90%;
+ max-height: 95%;
+ z-index: 99999;
+ animation: .1s show forwards;
+}
+
+.card>*>*:first-child {
+ margin-top: 0;
+}
+
+.card>*>*:last-child {
+ margin-bottom: 0;
+}
+
+.card .card-title {
+ padding: 1.5em 1em 1em;
+ display: flex;
+}
+
+.card .card-title>*:first-child {
+ margin-right: auto;
+}
+
+.card>div {
+ padding: 1em 1em;
+}
+
+.card>div:first-child {
+ padding-top: 1.5em;
+}
+
+.card>div:last-child {
+ padding-bottom: 1.5em;
+}
+
+.card .card-title * {
+ margin: 0;
+}
+
+.card .card-action {
+ text-align: right;
+}
+
+.card .card-content.full {
+ padding-bottom: 0;
+}
+
+.card h2 {
+ font-weight: 500;
+}
+
+.card h3 {
+ color: rgba(0, 0, 0, 0.53);
+ font-size: 1em;
+ font-weight: 500;
+ margin: 2em 0 1em;
+}
+
+.card-content table {
+ margin: 0 -1em;
+ width: calc(100% + 2em);
+}
+
+.card code {
+ word-wrap: break-word;
+}
+
+.card#download {
+ max-width: 15em;
+}
+
+.card#share ul {
+ list-style: none;
+ padding: 0;
+ margin: 0;
+}
+
+.card#share ul li {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+}
+
+.card#share ul li a {
+ color: #2196F3;
+ cursor: pointer;
+ margin-right: auto;
+}
+
+.card#share ul li .action i {
+ font-size: 1em;
+}
+
+.card#share ul li input,
+.card#share ul li select {
+ padding: .2em;
+ margin-right: .5em;
+ border: 1px solid #dadada;
+}
+
+.card#share .action.copy-clipboard::after {
+ content: 'Copied!';
+ position: absolute;
+ left: -25%;
+ width: 150%;
+ font-size: .6em;
+ text-align: center;
+ background: #44a6f5;
+ color: #fff;
+ padding: .5em .2em;
+ border-radius: .4em;
+ top: -2em;
+ transition: .1s ease opacity;
+ opacity: 0;
+}
+
+.card#share .action.copy-clipboard.active::after {
+ opacity: 1;
+}
+
+.overlay {
+ background-color: rgba(0, 0, 0, 0.5);
+ position: fixed;
+ top: 0;
+ left: 0;
+ height: 100%;
+ width: 100%;
+ z-index: 9999;
+ animation: .1s show forwards;
+}
+
+
+/* * * * * * * * * * * * * * * *
+ * PROMPT - MOVE *
+ * * * * * * * * * * * * * * * */
+
+.file-list {
+ max-height: 50vh;
+ overflow: auto;
+ list-style: none;
+ margin: 0;
+ padding: 0;
+ width: 100%;
+}
+
+.file-list li {
+ width: 100%;
+ user-select: none;
+ border-radius: .2em;
+ padding: .3em;
+}
+
+.file-list li[aria-selected=true] {
+ background: #2196f3 !important;
+ color: #fff !important;
+ transition: .1s ease all;
+}
+
+.file-list li:hover {
+ background-color: #e9eaeb;
+ cursor: pointer;
+}
+
+.file-list li:before {
+ content: "folder";
+ color: #6f6f6f;
+ vertical-align: middle;
+ line-height: 1.4;
+ font-family: 'Material Icons';
+ font-size: 1.75em;
+ margin-right: .25em;
+}
+
+.file-list li[aria-selected=true]:before {
+ color: white;
+}
+
+.help {
+ max-width: 24em;
+}
+
+.help ul {
+ padding: 0;
+ margin: 1em 0;
+ list-style: none;
+}
+
+@keyframes show {
+ 0% {
+ display: none;
+ opacity: 0;
+ }
+ 1% {
+ display: block;
+ opacity: 0;
+ }
+ 100% {
+ display: block;
+ opacity: 1;
+ }
+}
diff --git a/assets/src/css/header.css b/assets/src/css/header.css
index 3172a5b0..7d559daf 100644
--- a/assets/src/css/header.css
+++ b/assets/src/css/header.css
@@ -122,8 +122,9 @@ header .search-button {
#search input {
width: 100%;
border: 0;
- outline: 0;
background-color: transparent;
+ line-height: 0;
+ padding: 0;
}
#search #result {
diff --git a/assets/src/css/prompts.css b/assets/src/css/prompts.css
deleted file mode 100644
index e85d9e0f..00000000
--- a/assets/src/css/prompts.css
+++ /dev/null
@@ -1,229 +0,0 @@
-.prompt {
- position: fixed;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- background: #fff;
- border: 1px solid rgba(0, 0, 0, 0.075);
- box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
- padding: 2em;
- max-width: 25em;
- width: 90%;
- max-height: 95%;
- z-index: 99999;
- animation: .1s show forwards;
-}
-
-.overlay {
- background-color: rgba(0, 0, 0, 0.5);
- position: fixed;
- top: 0;
- left: 0;
- height: 100%;
- width: 100%;
- z-index: 9999;
- animation: .1s show forwards;
-}
-
-.prompt h3 {
- margin: 0;
- font-weight: 500;
- font-size: 1.5em;
-}
-
-.prompt p {
- font-size: .9em;
- color: rgba(0, 0, 0, 0.8);
- margin: .5em 0 1em;
-}
-
-.prompt input:not([type="submit"]) {
- width: 100%;
- border: 1px solid #dadada;
- line-height: 1;
- padding: .3em;
- margin: .3em 0;
-}
-
-.prompt code {
- word-wrap: break-word;
-}
-
-.prompt div:last-of-type {
- margin-top: 1em;
- display: flex;
- justify-content: flex-start;
- flex-direction: row-reverse;
-}
-
-.prompt .cancel {
- background-color: #ECEFF1;
- color: #37474F;
-}
-
-.prompt .cancel:hover {
- background-color: #e9eaeb;
-}
-
-.prompt.success i,
-.prompt.error i {
- color: #F44336;
- display: block;
- margin: 0 auto .15em;
- text-align: center;
- font-size: 5em;
-}
-
-.prompt.success h3,
-.prompt.error h3 {
- text-align: center;
-}
-
-.prompt.error button:not(.cancel) {
- background-color: #F44336
-}
-
-.prompt.success i {
- color: #8BC34A;
-}
-
-.prompt.success button {
- background-color: #8BC34A;
-}
-
-
-/* * * * * * * * * * * * * * * *
- * PROMPT - MOVE *
- * * * * * * * * * * * * * * * */
-
-.file-list {
- max-height: 50vh;
- overflow: auto;
- list-style: none;
- margin: 0;
- padding: 0;
- width: 100%;
-}
-
-.file-list li {
- width: 100%;
- user-select: none;
- border-radius: .2em;
- padding: .3em;
-}
-
-.file-list li[aria-selected=true] {
- background: #2196f3 !important;
- color: #fff !important;
- transition: .1s ease all;
-}
-
-.file-list li:hover {
- background-color: #e9eaeb;
- cursor: pointer;
-}
-
-.file-list li:before {
- content: "folder";
- color: #6f6f6f;
- vertical-align: middle;
- line-height: 1.4;
- font-family: 'Material Icons';
- font-size: 1.75em;
- margin-right: .25em;
-}
-
-.file-list li[aria-selected=true]:before {
- color: white;
-}
-
-.prompt#download {
- max-width: 15em;
-}
-
-.prompt#download button {
- width: 100%;
- display: block;
- margin: 0 0 1em;
- background-color: #ECEFF1;
- color: #37474F;
-}
-
-.prompt#download button:last-of-type {
- margin-bottom: 0;
-}
-
-.help {
- max-width: 24em;
-}
-
-.help ul {
- padding: 0;
- margin: 1em 0;
- list-style: none;
-}
-
-@keyframes show {
- 0% {
- display: none;
- opacity: 0;
- }
- 1% {
- display: block;
- opacity: 0;
- }
- 100% {
- display: block;
- opacity: 1;
- }
-}
-
-.prompt#share ul {
- list-style: none;
- padding: 0;
- margin: 0;
-}
-
-.prompt#share ul li {
- display: flex;
- justify-content: space-between;
- align-items: center;
-}
-
-.prompt#share ul li a {
- color: #2196F3;
- cursor: pointer;
- margin-right: auto;
-}
-
-.prompt#share ul li .action i {
- font-size: 1em;
-}
-
-.prompt#share ul li input,
-.prompt#share ul li select {
- padding: .2em;
- margin-right: .5em;
- border: 1px solid #dadada;
-}
-
-.prompt#share .action.copy-clipboard::after {
- content: 'Copied!';
- position: absolute;
- left: -25%;
- width: 150%;
- font-size: .6em;
- text-align: center;
- background: #44a6f5;
- color: #fff;
- padding: .5em .2em;
- border-radius: .4em;
- top: -2em;
- transition: .1s ease opacity;
- opacity: 0;
-}
-
-.prompt#share .action.copy-clipboard.active::after {
- opacity: 1;
-}
-
diff --git a/assets/src/css/styles.css b/assets/src/css/styles.css
index a90d60bd..69335280 100644
--- a/assets/src/css/styles.css
+++ b/assets/src/css/styles.css
@@ -3,7 +3,6 @@
@import "./fonts.css";
@import "./base.css";
@import "./header.css";
-@import "./prompts.css";
@import "./listing.css";
@import "./editor.css";
@import "./dashboard.css";
diff --git a/assets/src/main.js b/assets/src/main.js
index 57e7b930..4d1c7c56 100644
--- a/assets/src/main.js
+++ b/assets/src/main.js
@@ -26,7 +26,6 @@ Vue.prototype.$showSuccess = function (message) {
}
Vue.prototype.$showError = function (error) {
- // TODO: add btns: close and report issue
let n = new Noty(Object.assign({}, notyDefault, {
text: error,
type: 'error',
diff --git a/assets/src/router/index.js b/assets/src/router/index.js
index d01018b3..9dde4a3b 100644
--- a/assets/src/router/index.js
+++ b/assets/src/router/index.js
@@ -3,10 +3,11 @@ import Router from 'vue-router'
import Login from '@/views/Login'
import Layout from '@/views/Layout'
import Files from '@/views/Files'
-import Users from '@/views/Users'
-import User from '@/views/User'
-import GlobalSettings from '@/views/GlobalSettings'
-import ProfileSettings from '@/views/ProfileSettings'
+import Users from '@/views/Settings/Users'
+import User from '@/views/Settings/User'
+import Settings from '@/views/Settings'
+import GlobalSettings from '@/views/settings/Global'
+import ProfileSettings from '@/views/settings/Profile'
import Error403 from '@/views/errors/403'
import Error404 from '@/views/errors/404'
import Error500 from '@/views/errors/500'
@@ -49,22 +50,45 @@ const router = new Router({
{
path: '/settings',
name: 'Settings',
- redirect: {
- path: '/settings/profile'
- }
- },
- {
- path: '/settings/profile',
- name: 'Profile Settings',
- component: ProfileSettings
- },
- {
- path: '/settings/global',
- name: 'Global Settings',
- component: GlobalSettings,
- meta: {
- requiresAdmin: true
- }
+ component: Settings,
+ children: [
+ {
+ path: '/settings',
+ name: 'Settings',
+ redirect: {
+ path: '/settings/profile'
+ }
+ },
+ {
+ path: '/settings/profile',
+ name: 'Profile Settings',
+ component: ProfileSettings
+ },
+ {
+ path: '/settings/global',
+ name: 'Global Settings',
+ component: GlobalSettings,
+ meta: {
+ requiresAdmin: true
+ }
+ },
+ {
+ path: '/settings/users',
+ name: 'Users',
+ component: Users,
+ meta: {
+ requiresAdmin: true
+ }
+ },
+ {
+ path: '/settings/users/*',
+ name: 'User',
+ component: User,
+ meta: {
+ requiresAdmin: true
+ }
+ }
+ ]
},
{
path: '/403',
@@ -81,22 +105,6 @@ const router = new Router({
name: 'Internal Server Error',
component: Error500
},
- {
- path: '/users',
- name: 'Users',
- component: Users,
- meta: {
- requiresAdmin: true
- }
- },
- {
- path: '/users/*',
- name: 'User',
- component: User,
- meta: {
- requiresAdmin: true
- }
- },
{
path: '/files',
redirect: {
diff --git a/assets/src/views/Settings.vue b/assets/src/views/Settings.vue
new file mode 100644
index 00000000..20aeaa1a
--- /dev/null
+++ b/assets/src/views/Settings.vue
@@ -0,0 +1,20 @@
+
+
+
+ - {{ $t('settings.profileSettings') }}
+ - {{ $t('settings.globalSettings') }}
+ - {{ $t('settings.userManagement') }}
+
+
+
+
+
+
diff --git a/assets/src/views/Users.vue b/assets/src/views/Users.vue
deleted file mode 100644
index 43f70442..00000000
--- a/assets/src/views/Users.vue
+++ /dev/null
@@ -1,48 +0,0 @@
-
-
-
- - {{ $t('settings.profileSettings') }}
- - {{ $t('settings.globalSettings') }}
- - {{ $t('settings.userManagement') }}
-
-
-
{{ $t('settings.users') }}
-
-
-
- | {{ $t('settings.username') }} |
- {{ $t('settings.admin') }} |
- {{ $t('settings.scope') }} |
- |
-
-
-
- | {{ user.username }} |
- doneclose |
- {{ user.filesystem }} |
- mode_edit |
-
-
-
-
-
-
diff --git a/assets/src/views/GlobalSettings.vue b/assets/src/views/settings/Global.vue
similarity index 65%
rename from assets/src/views/GlobalSettings.vue
rename to assets/src/views/settings/Global.vue
index af2d48bf..424afde8 100644
--- a/assets/src/views/GlobalSettings.vue
+++ b/assets/src/views/settings/Global.vue
@@ -1,43 +1,54 @@
-
- - {{ $t('settings.profileSettings') }}
- - {{ $t('settings.globalSettings') }}
- - {{ $t('settings.userManagement') }}
-
+
-
-
-
- - {{ $t('settings.profileSettings') }}
- - {{ $t('settings.globalSettings') }}
- - {{ $t('settings.userManagement') }}
-
+
-
-
-
-
Delete User
-
Are you sure you want to delete this user?
-
-
-
@@ -105,7 +110,7 @@ export default {
},
computed: {
passwordPlaceholder () {
- if (this.$route.path === '/users/new') return ''
+ if (this.$route.path === '/settings/users/new') return ''
return this.$t('settings.avoidChanges')
}
},
@@ -131,7 +136,7 @@ export default {
fetchData () {
let user = this.$route.params[0]
- if (this.$route.path === '/users/new') {
+ if (this.$route.path === '/settings/users/new') {
user = 'base'
}
@@ -168,7 +173,7 @@ export default {
this.rules = this.rules.trim()
}).catch(() => {
- this.$router.push({ path: '/users/new' })
+ this.$router.push({ path: '/settings/users/new' })
})
},
capitalize (name) {
@@ -205,7 +210,7 @@ export default {
event.preventDefault()
deleteUser(this.id).then(location => {
- this.$router.push({ path: '/users' })
+ this.$router.push({ path: '/settings/users' })
this.$showSuccess(this.$t('settings.userDeleted'))
}).catch(e => {
this.$showError(e)
@@ -215,7 +220,7 @@ export default {
event.preventDefault()
let user = this.parseForm()
- if (this.$route.path === '/users/new') {
+ if (this.$route.path === '/settings/users/new') {
newUser(user).then(location => {
this.$router.push({ path: location })
this.$showSuccess(this.$t('settings.userCreated'))
diff --git a/assets/src/views/settings/Users.vue b/assets/src/views/settings/Users.vue
new file mode 100644
index 00000000..355aaaed
--- /dev/null
+++ b/assets/src/views/settings/Users.vue
@@ -0,0 +1,48 @@
+
+
+
+
{{ $t('settings.users') }}
+
+
+
+
+
+
+ | {{ $t('settings.username') }} |
+ {{ $t('settings.admin') }} |
+ {{ $t('settings.scope') }} |
+ |
+
+
+
+ | {{ user.username }} |
+ doneclose |
+ {{ user.filesystem }} |
+
+ mode_edit
+ |
+
+
+
+
+
+
diff --git a/http/users.go b/http/users.go
index d40ea1b4..f8c46c4b 100644
--- a/http/users.go
+++ b/http/users.go
@@ -194,7 +194,7 @@ func usersPostHandler(c *fm.Context, w http.ResponseWriter, r *http.Request) (in
}
// Set the Location header and return.
- w.Header().Set("Location", "/users/"+strconv.Itoa(u.ID))
+ w.Header().Set("Location", "/settings/users/"+strconv.Itoa(u.ID))
w.WriteHeader(http.StatusCreated)
return 0, nil
}