VENOM-10: Clean Up Code
This commit is contained in:
parent
7d540d809a
commit
85549fbd43
10 changed files with 28 additions and 35 deletions
|
@ -1 +1 @@
|
|||
main{display:flex;height:100vh;overflow:hidden}main h1{margin-top:30px;margin-bottom:20px}main h2{margin-top:35px;margin-bottom:25px}main h3{margin-top:20px;margin-bottom:15px}main h4{margin-top:15px;margin-bottom:10px}main.nav-open .menu{transform:translateX(0)}main.nav-open .app{transform:translateX(220px)}.app{transform:translateX(0);transition:transform .4s;flex-grow:1;overflow-y:auto;margin:.6rem .8rem;width:100%;max-height:100%;background:rgba(27,27,27,.5);position:relative}.app .nav-toggle{position:absolute;top:1rem;left:1rem}.menu{width:220px;background-color:#1b1b1b;box-shadow:0 3px 6px rgba(0,0,0,.16),0 3px 6px rgba(0,0,0,.23);height:100%;position:fixed;z-index:1;top:0;left:0;overflow-x:hidden;transition:.4s;transform:translateX(-220px);display:flex;flex-direction:column}.menu .logo{text-align:center;font-family:monospace}.menu div[data-link]{padding:.75rem .5rem;position:relative}.menu div[data-link]:after{background-color:#3949ab;content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;transform:scaleX(0);transition:transform .4s;transform-origin:left}.menu div[data-link]:hover:after{transform:scaleX(1)}.menu div[data-link]:last-child{margin-top:auto}.menu div[data-link].active{font-weight:700}.content-area{width:calc(100% - 20px);padding-top:30px;margin:0 auto;display:block}.content-area header{display:block;text-align:center}.content-area header h2{margin:25px 0}.content-area .back-arrow{width:36px;height:36px}.content-area textarea{background:rgba(27,27,27,.5);color:#fff;margin:15px 0 0 0;font-family:sans-serif;font-size:1.1rem;min-width:100%}.content-area .modules div{padding:6px 20px 6px 0}.content-area .add-new,.content-area .overview{width:100%}.content-area .overview div{margin:10px 0}.content-area .overview .icon{display:inline-block}.content-area .add-new{padding-top:25px}@media only screen and (min-width:768px){.content-area{width:calc(100% - 40px)}.content-area .flexbox{display:flex}.content-area .overview{flex-grow:1;width:60%}.content-area .add-new{padding-top:0;flex-grow:1;width:40%}}@media only screen and (min-width:1024px){.content-area{max-width:860px;padding-top:0;margin:0 0 0 20px}}@media only screen and (min-width:1024px){main,main.nav-open{display:flex}main .app,main.nav-open .app{transform:translateX(0)}main .menu,main.nav-open .menu{position:relative;transform:translateX(0)}main .nav-toggle,main.nav-open .nav-toggle{display:none}}.role-edit .privileges .name{font-size:1.15rem}.role-edit .privileges .description{padding-top:2px}
|
||||
main{display:flex;height:100vh;overflow:hidden}main h1{margin-top:30px;margin-bottom:20px}main h2{margin-top:35px;margin-bottom:25px}main h3{margin-top:20px;margin-bottom:15px}main h4{margin-top:15px;margin-bottom:10px}main.nav-open .menu{transform:translateX(0)}main.nav-open .app{transform:translateX(220px)}.app{transform:translateX(0);transition:transform .4s;flex-grow:1;overflow-y:auto;margin:.6rem .8rem;width:100%;max-height:100%;background:rgba(27,27,27,.5);position:relative}.app .nav-toggle{position:absolute;top:1rem;left:1rem}.menu{width:220px;background-color:#1b1b1b;box-shadow:0 3px 6px rgba(0,0,0,.16),0 3px 6px rgba(0,0,0,.23);height:100%;position:fixed;z-index:1;top:0;left:0;overflow-x:hidden;transition:.4s;transform:translateX(-220px);display:flex;flex-direction:column}.menu .logo{text-align:center;font-family:monospace}.menu div[data-link]{padding:.75rem .5rem;position:relative}.menu div[data-link]:after{background-color:#3949ab;content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;transform:scaleX(0);transition:transform .4s;transform-origin:left}.menu div[data-link]:hover:after{transform:scaleX(1)}.menu div[data-link]:last-child{margin-top:auto}.menu div[data-link].active{font-weight:700}.content-area{width:calc(100% - 20px);padding-top:30px;margin:0 auto;display:block}.content-area header{display:block;text-align:center}.content-area header h2{margin:25px 0}.content-area .back-arrow{width:36px;height:36px}.content-area textarea{background:rgba(27,27,27,.5);color:#fff;margin:15px 0 0 0;font-family:sans-serif;font-size:1.1rem;min-width:100%}.content-area .modules div{padding:6px 20px 6px 0}.content-area .add-new,.content-area .overview{width:100%}.content-area .overview div[data-link]{margin-right:10px;padding:10px;background-color:rgba(0,0,0,.3)}.content-area .overview div[data-link]:hover{background-color:rgba(0,0,0,.5)}.content-area .overview .icon{display:inline-block}.content-area .add-new{padding-top:25px}@media only screen and (min-width:768px){.content-area{width:calc(100% - 40px)}.content-area .flexbox{display:flex}.content-area .overview{flex-grow:1;width:60%}.content-area .add-new{padding-top:0;flex-grow:1;width:40%}}@media only screen and (min-width:1024px){.content-area{max-width:860px;padding-top:0;margin:0 0 0 20px}}@media only screen and (min-width:1024px){main,main.nav-open{display:flex}main .app,main.nav-open .app{transform:translateX(0)}main .menu,main.nav-open .menu{position:relative;transform:translateX(0)}main .nav-toggle,main.nav-open .nav-toggle{display:none}}.role-edit .privileges .name{font-size:1.15rem}
|
File diff suppressed because one or more lines are too long
|
@ -310,6 +310,12 @@ const rippler = new VRipple();
|
|||
window._openVSelect = this;
|
||||
this.isOpen = true;
|
||||
}
|
||||
let l = $('v-label', this).classList;
|
||||
if (this.isOpen) {
|
||||
l.add('open');
|
||||
} else {
|
||||
l.remove('open');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
2
public/theme/admin/js/scripts.min.js
vendored
2
public/theme/admin/js/scripts.min.js
vendored
File diff suppressed because one or more lines are too long
|
@ -1,4 +1,4 @@
|
|||
<button class="btn btn--${type}">
|
||||
<button class="btn btn--${type} ${classes}">
|
||||
<span class="btn-ripple"></span>
|
||||
<span class="btn__content">${content}</span>
|
||||
</button>
|
|
@ -1,4 +1,5 @@
|
|||
<v-input
|
||||
class="${classes}"
|
||||
data-label="${label}"
|
||||
required
|
||||
name="${name}"
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<v-select ${required} name="${name}">
|
||||
<v-select ${required} name="${name}" class="${classes}">
|
||||
<v-label empty="${label}"></v-label>
|
||||
<v-options>
|
||||
{foreach(object as item)}
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<v-switch data-id="${id}">
|
||||
<v-switch data-id="${id}" class="${classes}">
|
||||
<input type="checkbox" required name="${name}">
|
||||
<label></label>
|
||||
<span>${desc}</span>
|
||||
|
|
|
@ -2,27 +2,21 @@
|
|||
<header>
|
||||
<h2>Role: ${roles.name}</h2>
|
||||
</header>
|
||||
<div>
|
||||
<span data-link="/roles" class="icon-text">
|
||||
{include(includes/svg;class=back-arrow;icon=vt-arrow-back)}
|
||||
</span>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Role Status</h3>
|
||||
{include(includes/switch;id=${switch.id};name=permissionEditMetaData;desc=If enabled role is active.)}
|
||||
</div>
|
||||
<div>
|
||||
<h3>Role Name</h3>
|
||||
{include(includes/input;class=input-group;label=Change Name;name=roleName;error=Role Name is required;default=Admin)}
|
||||
<span data-link="/roles" class="icon-back">
|
||||
{include(includes/svg;class=back-arrow;icon=vt-arrow-back)}
|
||||
</span>
|
||||
<div class="spacer">
|
||||
{include(includes/switch;id=${switch.id};name=permissionEditMetaData;desc=Active)}
|
||||
{include(includes/input;class=input-group;label=Name;name=roleName;error=Name is required;default=$roles.name;classes=spacer)}
|
||||
</div>
|
||||
<v-table class="privileges">
|
||||
<h3>Privileges</h3>
|
||||
<v-table-body>
|
||||
<v-table-row>
|
||||
<v-table-header>
|
||||
<v-cell class="name">Module</v-cell>
|
||||
<v-cell class="name">Edit</v-cell>
|
||||
<v-cell class="name">View</v-cell>
|
||||
</v-table-row>
|
||||
</v-table-header>
|
||||
<v-table-row>
|
||||
<v-cell class="description">Meta-Data</v-cell>
|
||||
<v-cell>{include(includes/switch;id=${switch.id};name=permissionEditMetaData)}</v-cell>
|
||||
|
|
|
@ -8,29 +8,21 @@
|
|||
</span>
|
||||
</div>
|
||||
<h3>User Data</h3>
|
||||
<div>
|
||||
<div class="spacer">
|
||||
{include(includes/input;class=input-group;label=Username;name=newUserName;error=New User Name is required;default=EngineerTrooper)}
|
||||
</div>
|
||||
<div>
|
||||
{include(includes/input;class=input-group;label=Author Name;name=newAuthorName;error=New Author Name is required;default=Dominic Seela)}
|
||||
</div>
|
||||
<div>
|
||||
{include(includes/input;class=input-group;label=E-Mail;name=newEMailAddress;error=E-Mail Address is required;default=kontakt@engineertrooper.com)}
|
||||
</div>
|
||||
<div>
|
||||
{include(includes/input;class=input-group;label=Password;name=newPassword;type=password;error=Password is required)}
|
||||
</div>
|
||||
<div>
|
||||
{include(includes/input;class=input-group;label=Password (Repeat);name=newPasswordRepeat;type=password;error=Password (Repeat) is required)}
|
||||
{include(includes/input;class=input-group;label=Author Name;name=newAuthorName;error=New Author Name is required;default=Dominic Seela;classes=spacer)}
|
||||
{include(includes/input;class=input-group;label=E-Mail;name=newEMailAddress;error=E-Mail Address is required;default=kontakt@engineertrooper.com;classes=spacer)}
|
||||
{include(includes/input;class=input-group;label=Password;name=newPassword;type=password;error=Password is required;classes=spacer)}
|
||||
{include(includes/input;class=input-group;label=Password (Repeat);name=newPasswordRepeat;type=password;error=Password (Repeat) is required;classes=spacer)}
|
||||
</div>
|
||||
<v-table class="privileges">
|
||||
<h3>Privileges</h3>
|
||||
<v-table-body>
|
||||
<v-table-row>
|
||||
<v-table-header>
|
||||
<v-cell class="name">Module</v-cell>
|
||||
<v-cell class="name">Edit</v-cell>
|
||||
<v-cell class="name">View</v-cell>
|
||||
</v-table-row>
|
||||
</v-table-header>
|
||||
<v-table-row>
|
||||
<v-cell class="description">Meta-Data</v-cell>
|
||||
<v-cell>{include(includes/switch;id=${switch.id};name=permissionEditMetaData)}</v-cell>
|
||||
|
|
Loading…
Reference in a new issue