mbk-lab
/
nextcloud
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Cleanup structure 

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
This commit is contained in:
John Molakvoæ (skjnldsv) 2018-06-25 09:26:43 +02:00 committed by Morris Jobke
parent 52ec71c4b0
commit 842583038b
No known key found for this signature in database
GPG Key ID: FE03C3A163FEDE68
10 changed files with 163 additions and 208 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/files_sharing/js/public.js
View File

@ -67,7 +67,7 @@ OCA.Sharing.PublicApp = {
$el, $el,
{ {
id: 'files.public', id: 'files.public',
scrollContainer: $('#content-wrapper'), scrollContainer: $('#app-content'),
dragOptions: dragOptions, dragOptions: dragOptions,
folderDropOptions: folderDropOptions, folderDropOptions: folderDropOptions,
fileActions: fileActions, fileActions: fileActions,

79
core/css/apps.scss
View File

@ -80,8 +80,9 @@ kbd {
#app-navigation { #app-navigation {
width: 250px; width: 250px;
height: 100%; /* header height */
float: left; height: calc(100vh - 50px);
position: fixed;
box-sizing: border-box; box-sizing: border-box;
background-color: var(--color-main-background); background-color: var(--color-main-background);
-webkit-user-select: none; -webkit-user-select: none;
@ -583,9 +584,11 @@ kbd {
/* APP-CONTENT ---------------------------------------------------------------*/ /* APP-CONTENT ---------------------------------------------------------------*/
/* Part where the content will be loaded into */ /* Part where the content will be loaded into */
#app-content { #app-content {
margin-left: 250px;
z-index: 1000;
background-color: var(--color-main-background);
position: relative; position: relative;
height: 100%; min-height: calc(100vh - 50px);
overflow-y: auto;
/* no top border for first settings item */ /* no top border for first settings item */
> .section:first-child { > .section:first-child {
border-top: none; border-top: none;
@ -595,11 +598,6 @@ kbd {
} }
} }
#app-content-wrapper {
min-width: 100%;
min-height: 100%;
}
/* APP-SIDEBAR ----------------------------------------------------------------*/ /* APP-SIDEBAR ----------------------------------------------------------------*/
/* /*
@ -1008,21 +1006,26 @@ $popovericon-size: 16px;
} }
/* CONTENT WRAPPER --------------------------------------------------------- */ /* CONTENT WRAPPER --------------------------------------------------------- */
#content {
/* header height */
padding-top: 50px;
box-sizing: border-box;
position: relative;
}
/* if app-content-list is present */
#app-content-wrapper { #app-content-wrapper {
display: flex; display: flex;
position: relative; position: relative;
align-items: start; align-items: start;
height: 100%;
width: 100%;
.app-content-list, .app-content-list,
.app-content-detail { .app-content-detail {
min-height: 100%; min-height: calc(100vh - 50px);
max-height: 100%; max-height: calc(100vh - 50px);
overflow-x: hidden; overflow-x: hidden;
overflow-y: auto; overflow-y: auto;
} }
} }
/* CONTENT LIST ------------------------------------------------------------- */ /* CONTENT LIST ------------------------------------------------------------- */
.app-content-list { .app-content-list {
width: 300px; width: 300px;
@ -1186,51 +1189,3 @@ $popovericon-size: 16px;
} }
} }
/* MOBILE ------------------------------------------------------------------- */
/* Mobile width < 768px */
@media only screen and (max-width: 768px) {
/* full width for message list on mobile */
.app-content-list {
width: 100%;
background: var(--color-main-background);
position: relative;
z-index: 100;
}
/* overlay message detail on top of message list */
.app-content-detail {
background: var(--color-main-background);
width: 100%;
left: 0;
height: 100%;
top: 0;
box-shadow: 0 0 100px rgba(100, 100, 100, .9);
position: absolute;
}
/* Show app details page */
#app-content.showdetails {
#app-navigation-toggle {
transform: translateX(-44px);
}
#app-navigation-toggle-back {
position: fixed;
display: inline-block !important;
top: 45px;
left: 0;
width: 44px;
height: 44px;
z-index: 149;
background-color: rgba(255, 255, 255, .7);
cursor: pointer;
opacity: .6;
transform: rotate(90deg);
}
.app-content-list {
transform: translateX(-100%);
}
}
/* end of media query */
}

243
core/css/mobile.scss
View File

@ -1,124 +1,147 @@
@media only screen and (max-width: 768px) { @media only screen and (max-width: 768px) {
/* do not show update notification on mobile */ /* position share dropdown */
#update-notification { #dropdown {
display: none !important; margin-right: 10% !important;
width: 80% !important;
}
/* fix name autocomplete not showing on mobile */
.ui-autocomplete {
z-index: 1000 !important;
}
/* fix error display on smaller screens */
.error-wide {
width: 100%;
margin-left: 0 !important;
box-sizing: border-box;
}
/* APP SIDEBAR TOGGLE and SWIPE ----------------------------------------------*/
#app-navigation {
transform: translateX(-250px);
}
.snapjs-left {
#app-navigation {
transform: translateX(0);
}
}
#app-content {
margin-left: 0;
}
/* full width for message list on mobile */
.app-content-list {
width: 100%;
background: var(--color-main-background);
position: relative;
z-index: 100;
}
/* since list and content are only displayed full window size
* we don't ant inner scrolling
*/
#app-content-wrapper {
.app-content-list,
.app-content-detail {
max-height: unset;
}
}
/* Show app details page */
#app-content.showdetails {
#app-navigation-toggle {
transform: translateX(-44px);
}
#app-navigation-toggle-back {
position: fixed;
display: inline-block !important;
top: 45px;
left: 0;
width: 44px;
height: 44px;
z-index: 149;
background-color: rgba(255, 255, 255, .7);
cursor: pointer;
opacity: .6;
transform: rotate(90deg);
}
.app-content-list {
transform: translateX(-100%);
}
/* end of media query */
} }
/* allow horizontal scrollbar in settings
/* position share dropdown */
#dropdown {
margin-right: 10% !important;
width: 80% !important;
}
/* fix name autocomplete not showing on mobile */
.ui-autocomplete {
z-index: 1000 !important;
}
/* fix error display on smaller screens */
.error-wide {
width: 100%;
margin-left: 0 !important;
box-sizing: border-box;
}
/* APP SIDEBAR TOGGLE and SWIPE ----------------------------------------------*/
#app-navigation,
#app-content {
position: absolute !important;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
#app-navigation {
width: 250px !important;
}
#app-content {
width: 100% !important;
left: 0 !important;
background-color: var(--color-main-background);
overflow-x: hidden !important;
z-index: 1000;
}
/* allow horizontal scrollbar in settings
otherwise user management is not usable on mobile */ otherwise user management is not usable on mobile */
#body-settings #app-content { #body-settings #app-content {
overflow-x: auto !important; overflow-x: auto !important;
} }
#app-navigation-toggle { #app-navigation-toggle {
position: fixed; position: fixed;
display: inline-block !important; display: inline-block !important;
top: 50px; top: 50px;
left: 0; left: 0;
width: 44px; width: 44px;
height: 44px; height: 44px;
z-index: 149; z-index: 149;
background-color: var(--color-main-background-darker); background-color: var(--color-main-background-darker);
cursor: pointer; cursor: pointer;
opacity: .6; opacity: 0.6;
} }
#app-navigation-toggle:hover, #app-navigation-toggle:hover,
#app-navigation-toggle:focus { #app-navigation-toggle:focus {
opacity: 1; opacity: 1;
} }
/* position controls for apps with app-navigation */ /* position controls for apps with app-navigation */
#app-navigation+#app-content #controls { #app-navigation + #app-content #controls {
padding-left: 44px; padding-left: 44px;
} }
/* .viewer-mode is when text editor, PDF viewer, etc is open */ /* .viewer-mode is when text editor, PDF viewer, etc is open */
#body-user .app-files.viewer-mode #controls { #body-user .app-files.viewer-mode #controls {
padding-left: 0 !important; padding-left: 0 !important;
} }
.app-files.viewer-mode #app-navigation-toggle { .app-files.viewer-mode #app-navigation-toggle {
display: none !important; display: none !important;
} }
table.multiselect thead { table.multiselect thead {
left: 0 !important; left: 0 !important;
} }
/* prevent overflow in user management controls bar */
#usersearchform {
display: none;
}
#body-settings #controls {
min-width: 768px !important;
}
/* prevent overflow in user management controls bar */ /* do not show dates in filepicker */
#usersearchform { #oc-dialog-filepicker-content .filelist .filesize,
display: none; #oc-dialog-filepicker-content .filelist .date {
} display: none;
#body-settings #controls { }
min-width: 768px !important; #oc-dialog-filepicker-content .filelist .filename {
} max-width: 80%;
}
/* fix controls bar jumping when navigation is slid out */
.snapjs-left #app-navigation-toggle,
.snapjs-left #controls {
top: 0;
}
.snapjs-left table.multiselect thead {
top: 44px;
}
/* do not show dates in filepicker */ /* end of media query */
#oc-dialog-filepicker-content .filelist .filesize,
#oc-dialog-filepicker-content .filelist .date {
display: none;
}
#oc-dialog-filepicker-content .filelist .filename {
max-width: 80%;
}
/* fix controls bar jumping when navigation is slid out */
.snapjs-left #app-navigation-toggle,
.snapjs-left #controls {
top: 0;
}
.snapjs-left table.multiselect thead {
top: 44px;
}
/* end of media query */
} }
@media only screen and (max-width: 480px) { @media only screen and (max-width: 480px) {
@ -131,7 +154,7 @@ table.multiselect thead {
} }
/* Arrow directly child of menutoggle */ /* Arrow directly child of menutoggle */
#header .header-right > div { #header .header-right > div {
&.openedMenu{ &.openedMenu {
&::after { &::after {
display: block; display: block;
} }

19
core/css/styles.scss
View File

@ -207,25 +207,6 @@ body {
} }
} }
#content {
position: relative;
height: 100%;
width: 100%;
.hascontrols {
margin-top: 45px;
}
}
#content-wrapper {
position: absolute;
height: 100%;
width: 100%;
overflow-x: hidden;
/* prevent horizontal scrollbar */
padding-top: 50px;
box-sizing: border-box;
}
/* allow horizontal scrollbar for personal and admin settings */ /* allow horizontal scrollbar for personal and admin settings */
#body-settings:not(.snapjs-left) .app-settings { #body-settings:not(.snapjs-left) .app-settings {

8
core/templates/layout.public.php
View File

@ -27,8 +27,7 @@
</head> </head>
<body id="<?php p($_['bodyid']);?>"> <body id="<?php p($_['bodyid']);?>">
<?php include('layout.noscript.warning.php'); ?> <?php include('layout.noscript.warning.php'); ?>
<header> <header id="header" class="<?php p($_['header-classes']); ?>">
<div id="header" class="<?php p($_['header-classes']); ?>">
<div class="header-left"> <div class="header-left">
<span id="nextcloud"> <span id="nextcloud">
<div class="logo logo-icon svg"></div> <div class="logo logo-icon svg"></div>
@ -70,9 +69,7 @@
<?php } ?> <?php } ?>
</div> </div>
<?php } ?> <?php } ?>
</div> </header>
</header>
<div id="content-wrapper">
<div id="content" class="app-<?php p($_['appid']) ?>" role="main"> <div id="content" class="app-<?php p($_['appid']) ?>" role="main">
<?php print_unescaped($_['content']); ?> <?php print_unescaped($_['content']); ?>
</div> </div>
@ -81,7 +78,6 @@
<p class="info"><?php print_unescaped($theme->getLongFooter()); ?></p> <p class="info"><?php print_unescaped($theme->getLongFooter()); ?></p>
</footer> </footer>
<?php } ?> <?php } ?>
</div>
</body> </body>
</html> </html>

12
core/templates/layout.user.php
View File

@ -28,13 +28,13 @@
<body id="<?php p($_['bodyid']);?>"> <body id="<?php p($_['bodyid']);?>">
<?php include 'layout.noscript.warning.php'; ?> <?php include 'layout.noscript.warning.php'; ?>
<a href="#app-content" class="button primary skip-navigation skip-content"><?php p($l->t('Skip to main content')); ?></a> <a href="#app-content" class="button primary skip-navigation skip-content"><?php p($l->t('Skip to main content')); ?></a>
<a href="#app-navigation" class="button primary skip-navigation"><?php p($l->t('Skip to navigation of app')); ?></a> <a href="#app-navigation" class="button primary skip-navigation"><?php p($l->t('Skip to navigation of app')); ?></a>
<div id="notification-container"> <div id="notification-container">
<div id="notification"></div> <div id="notification"></div>
</div> </div>
<header role="banner"><div id="header"> <header role="banner" id="header">
<div class="header-left"> <div class="header-left">
<a href="<?php print_unescaped(link_to('', 'index.php')); ?>" <a href="<?php print_unescaped(link_to('', 'index.php')); ?>"
id="nextcloud"> id="nextcloud">

2
settings/js/settings-vue.js
View File

File diff suppressed because one or more lines are too long

2
settings/js/settings-vue.js.map
View File

File diff suppressed because one or more lines are too long

2
settings/src/views/Apps.vue
View File

@ -21,7 +21,7 @@
--> -->
<template> <template>
<div id="app"> <div id="content" class="app-settings">
<app-navigation :menu="menu" /> <app-navigation :menu="menu" />
<div id="app-content" class="app-settings-content" :class="{ 'with-app-sidebar': currentApp, 'icon-loading': loadingList }"> <div id="app-content" class="app-settings-content" :class="{ 'with-app-sidebar': currentApp, 'icon-loading': loadingList }">
<app-list :category="category" :app="currentApp" :search="searchQuery"></app-list> <app-list :category="category" :app="currentApp" :search="searchQuery"></app-list>

2
settings/src/views/Users.vue
View File

@ -21,7 +21,7 @@
--> -->
<template> <template>
<div id="app"> <div id="content" class="app-settings">
<app-navigation :menu="menu"> <app-navigation :menu="menu">
<template slot="settings-content"> <template slot="settings-content">
<div> <div>