From 4a77602574cce0e187e352a2b0d30cfa35bbfe71 Mon Sep 17 00:00:00 2001 From: Christian Moser Date: Fri, 13 Dec 2024 02:40:06 +0100 Subject: [PATCH] 2024.12.13 02:40:05 --- assets/icons/delete.svg | 41 ++++- assets/icons/directory-new.svg | 39 +++++ assets/icons/upload.svg | 40 +++++ assets/styles/app.css | 148 +++++++++++------- src/Component/Sorter/FileSortType.php | 12 -- src/Component/Sorter/FileSorter.php | 1 - src/Controller/WebrootController.php | 13 +- templates/base.html.twig | 2 + templates/webroot/controller.html.twig | 4 +- templates/webroot/directory.html.twig | 112 ++++++++++--- .../mydevel.webroot.app+intl-icu.de.yaml | 6 + .../mydevel.webroot.app+intl-icu.en.yaml | 10 +- 12 files changed, 328 insertions(+), 100 deletions(-) create mode 100644 assets/icons/directory-new.svg create mode 100644 assets/icons/upload.svg diff --git a/assets/icons/delete.svg b/assets/icons/delete.svg index 4131277..fbeb326 100644 --- a/assets/icons/delete.svg +++ b/assets/icons/delete.svg @@ -1,4 +1,39 @@ - - - + + + + + diff --git a/assets/icons/directory-new.svg b/assets/icons/directory-new.svg new file mode 100644 index 0000000..bdb3e6b --- /dev/null +++ b/assets/icons/directory-new.svg @@ -0,0 +1,39 @@ + + + + + + diff --git a/assets/icons/upload.svg b/assets/icons/upload.svg new file mode 100644 index 0000000..e5cf29f --- /dev/null +++ b/assets/icons/upload.svg @@ -0,0 +1,40 @@ + + + + + + diff --git a/assets/styles/app.css b/assets/styles/app.css index e93ede0..62a5cb8 100644 --- a/assets/styles/app.css +++ b/assets/styles/app.css @@ -191,6 +191,8 @@ th { padding-bottom: 5px; font-size: var(--font-size-th); font-weight: var(--font-weight-th); + border-color:var(--color-th-background); + border-width:0px; } @@ -199,6 +201,8 @@ td { padding-right: 10px; padding-top: 5px; padding-bottom: 5px; + margin:0px; + border-width:0px; color: var(--color-text); font-size: var(--font-size-td); } @@ -222,54 +226,6 @@ a:visited { } -.left { - text-align: left; -} - - -.center { - text-align: center; - align-self: center; - align-items:center; -} - -.right { - text-align: right; -} - -.error { - color: var(--error-color); -} - -.frame { - border-width: 2px; - border-radius: 5px; - border-style: solid; - border-color: var(--color-text); -} - -.frame-table th, -.frame-table td { - padding: 5px; - border-width: 0px; -} -.center-box { - align-content:center; - text-align: center; - width: 100%; -} - -.login-box { - min-width: 400px; - max-width: 600px; - position: relative; - display: inline-block; - padding: 20px; -} - -.full-width { - width: 100%; -} label { font-size: 16px; @@ -321,15 +277,30 @@ select { border-width: 0px; } -.optional-input { - background-color: var(--color-optional-input); -} - code { background-color: var(--color-code-background); color: var(--color-code); } +fieldset { + border: 3px solid var(--color-text); + border-radius: 8px; + margin-top: 5px; + margin-bottom: 5px; +} + +dialog { + background-color: var(--color-background); + color: var(--color-text); + border: 2px, solid, white; + border-radius: 10px; +} + +.optional-input { + background-color: var(--color-optional-input); +} + + .td-color { background-color: var(--color-background); color: var(--color-text); @@ -340,16 +311,59 @@ code { white-space:nowrap; } +.left { + text-align: left; +} + + +.center { + text-align: center; + align-self: center; + align-items:center; +} + +.right { + text-align: right; +} + +.error { + color: var(--error-color); +} + +.frame { + border-width: 2px; + border-radius: 5px; + border-style: solid; + border-color: var(--color-text); +} + +.frame-table th, +.frame-table td { + padding: 5px; + border-width: 0px; +} +.center-box { + align-content:center; + text-align: center; + width: 100%; +} + +.login-box { + min-width: 400px; + max-width: 600px; + position: relative; + display: inline-block; + padding: 20px; +} + +.full-width { + width: 100%; +} + .standard-background { background-color: var(--color-background); } -fieldset { - border: 3px solid var(--color-text); - border-radius: 8px; - margin-top: 5px; - margin-bottom: 5px; -} .margin-5 { margin: 5px; @@ -388,6 +402,14 @@ fieldset { content: url('../icons/file.svg'); } +.icon-upload { + content: url('../icons/upload.svg'); +} + +.icon-directory-new { + content: url('../icons/directory-new.svg'); +} + .list-icon { width: 24; height: 24; @@ -395,9 +417,17 @@ fieldset { .toolbar-button { background-color: var(--background-color); - border: 1px solid var(--color-text); + border: 0px hidden var(--color-text); + cursor: pointer; } .toolbar-item { margin-right: 5px; } + +.border-collapse { + border-collapse: collapse; +} +.tr-border-bottom { + border-bottom: 1px solid var(--color-text); +} diff --git a/src/Component/Sorter/FileSortType.php b/src/Component/Sorter/FileSortType.php index 42e1393..3c4d8e7 100644 --- a/src/Component/Sorter/FileSortType.php +++ b/src/Component/Sorter/FileSortType.php @@ -1,10 +1,4 @@ $this->trans("directory.mtime",domain:'mydevel.webroot.app'), 'filesize' => $this->trans("directory.filesize",domain:'mydevel.webroot.app'), 'title' => $this->trans("directory.title",["url"=>$url],domain:'mydevel.webroot.app'), + 'deletedialog' => [ + 'title' => $this->trans("directory.delete-dialog.title",domain:'mydevel.webroot.app'), + 'message' => $this->trans("directory.delete-dialog.message",domain:'mydevel.webroot.app'), + 'button_delete' => $this->trans("button.delete",domain:'mydevel.webroot.app'), + 'button_close' => $this->trans("button.cancel",domain:'mydevel.webroot.app'), + ], + 'mkdirdialog' => [ + 'title' => $this->trans('directory.mkdir.title',domain:'mydevel.webroot.app'), + 'message' => $this->trans('directory.mkdir.message',domain:'mydevel.webroot.app'), + 'button_create' => $this->trans('button.cancel',domain:'mydevel.webroot.app'), + 'button_close' => $this->trans('button.create',domain:'mydevel.webroot.app'), + ], ], "parent_url"=>$routeconf['parent_url'], "url"=>$url, diff --git a/templates/base.html.twig b/templates/base.html.twig index e7acb20..89b30e4 100644 --- a/templates/base.html.twig +++ b/templates/base.html.twig @@ -10,6 +10,8 @@ {% block javascripts %} {% block importmap %}{{ importmap('app') }}{% endblock %} {% endblock %} + + {% block headscript %}{%endblock%} {% block body %} diff --git a/templates/webroot/controller.html.twig b/templates/webroot/controller.html.twig index c04ef6e..88f703e 100644 --- a/templates/webroot/controller.html.twig +++ b/templates/webroot/controller.html.twig @@ -13,8 +13,8 @@ This friendly message is coming from: {% endblock %} diff --git a/templates/webroot/directory.html.twig b/templates/webroot/directory.html.twig index e4a8764..b778bc1 100644 --- a/templates/webroot/directory.html.twig +++ b/templates/webroot/directory.html.twig @@ -1,49 +1,50 @@ {% extends 'base.html.twig' %} +{% block headscript %} + + {% endblock %} + {% block main %}

{{ msg.title }}

{% if write %} - - {% endif %}
- - - - - - - +
[icon]{{ msg.filename }}{{ msg.filesize }}{{ msg.mtime }}
+ + + + + + - {% if parent_url %} - - + + - - {% endif %} {% for entry in dir_entries %} - - + + {% endfor %} -
[icon]{{ msg.filename }}{{ msg.filesize }}{{ msg.mtime }}
[icon]
[icon] Back [icon] - --
[icon]
[icon] {{ entry.name }} {% if entry.delete %} - + {% else %} [icon] {% endif %} @@ -52,7 +53,78 @@ {{ entry.display_mtime }}
+ + +

{{ msg.mkdirdialog.title }}

+

{{ msg.mkdirdialog.message }}

+
+

+ +

+

+ + +

+
+ + + +

{{ msg.deletedialog.title }}

+

{{ msg.deletedialog.message|raw }}

+
+

+ +

+

+ + +

+
+ + + + {% endblock %} diff --git a/translations/mydevel.webroot.app+intl-icu.de.yaml b/translations/mydevel.webroot.app+intl-icu.de.yaml index 2eadbe4..b678db8 100644 --- a/translations/mydevel.webroot.app+intl-icu.de.yaml +++ b/translations/mydevel.webroot.app+intl-icu.de.yaml @@ -4,3 +4,9 @@ directory: mtime: 'Zuletzt geändert' filesize: Größe title: 'Index für {url}' + delete-dialog: + title: "Datei löschen" + message: 'Wenn du wirklich die asugewählte Datei löschen willst, gib in das untere Feld ein.' +button: + delete: Löschen + close: Abbrechen diff --git a/translations/mydevel.webroot.app+intl-icu.en.yaml b/translations/mydevel.webroot.app+intl-icu.en.yaml index c8e9851..aa10c31 100644 --- a/translations/mydevel.webroot.app+intl-icu.en.yaml +++ b/translations/mydevel.webroot.app+intl-icu.en.yaml @@ -1,6 +1,12 @@ directory: timefmt: 'Y.d.m H.i.s' - filename: 'Filename' + filename: Filename mtime: 'Last changed' - filesize: 'Size' + filesize: Size title: 'Index for {url}' + delete-dialog: + title: 'Delete file' + message: 'If you really want to delete the file or directory, type into the field below!' +button: + delete: Delete + close: Close