diff options
Diffstat (limited to 'core')
| -rw-r--r-- | core/css/styles.scss | 48 | ||||
| -rw-r--r-- | core/js/oc-dialogs.js | 2 |
2 files changed, 48 insertions, 2 deletions
diff --git a/core/css/styles.scss b/core/css/styles.scss index 612fd779fcc..b5968015d6f 100644 --- a/core/css/styles.scss +++ b/core/css/styles.scss @@ -697,7 +697,6 @@ code { } /* ---- DIALOGS ---- */ - #oc-dialog-filepicker-content { .dirtree { width: 96%; @@ -771,9 +770,54 @@ code { .filesize { text-align: right; } + &.view-grid { + $grid-size: 120px; + $grid-pad: 10px; + $name-height: 20px; + display: flex; + flex-direction: column; + + tbody { + display: grid; + grid-template-columns: repeat(auto-fill, $grid-size); + justify-content: space-around; + row-gap: 15px; + margin: 15px 0; + + tr { + display: block; + position: relative; + border-radius: var(--border-radius); + padding: $grid-pad; + display: flex; + flex-direction: column; + width: $grid-size - 2 * $grid-pad; + + td { + border: none; + padding: 0; + + &.filename { + padding: #{$grid-size - 2 * $grid-pad} 0 0 0; + background-position: center top; + background-size: contain; + line-height: $name-height; + height: $name-height; + } + &.filesize { + line-height: $name-height; + text-align: left; + } + &.date { + display: none; + } + } + } + } + } } .filepicker_element_selected { - background-color: lightblue; + background-color: var(--color-background-darker); } } diff --git a/core/js/oc-dialogs.js b/core/js/oc-dialogs.js index 7369298b8d5..c42b35ddcff 100644 --- a/core/js/oc-dialogs.js +++ b/core/js/oc-dialogs.js @@ -899,6 +899,8 @@ var OCdialogs = { if (entry.type === 'file') { var urlSpec = { file: dir + '/' + entry.name, + x: 100, + y: 100 }; var img = new Image(); var previewUrl = OC.generateUrl('/core/preview.png?') + $.param(urlSpec); |