summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/web/app/mobile/tags/drive.tag10
-rw-r--r--src/web/app/mobile/tags/drive/file.tag195
-rw-r--r--src/web/app/mobile/tags/drive/folder.tag57
3 files changed, 139 insertions, 123 deletions
diff --git a/src/web/app/mobile/tags/drive.tag b/src/web/app/mobile/tags/drive.tag
index 8350ce07e1..a72c8d51c8 100644
--- a/src/web/app/mobile/tags/drive.tag
+++ b/src/web/app/mobile/tags/drive.tag
@@ -1,9 +1,9 @@
<mk-drive>
<nav ref="nav">
- <p onclick={ goRoot }>%fa:cloud%%i18n:mobile.tags.mk-drive.drive%</p>
+ <a onclick={ goRoot } href="/i/drive">%fa:cloud%%i18n:mobile.tags.mk-drive.drive%</a>
<virtual each={ folder in hierarchyFolders }>
<span>%fa:angle-right%</span>
- <p onclick={ move }>{ folder.name }</p>
+ <a onclick={ move } href="/i/drive/folder/{ folder.id }">{ folder.name }</a>
</virtual>
<virtual if={ folder != null }>
<span>%fa:angle-right%</span>
@@ -74,9 +74,12 @@
border-bottom solid 1px rgba(0, 0, 0, 0.13)
> p
+ > a
display inline
margin 0
padding 0
+ text-decoration none !important
+ color inherit
&:last-child
font-weight bold
@@ -246,6 +249,7 @@
this.move = ev => {
this.cd(ev.item.folder);
+ return false;
};
this.cd = (target, silent = false) => {
@@ -339,6 +343,8 @@
this.trigger('move-root');
this.fetch();
}
+
+ return false;
};
this.fetch = () => {
diff --git a/src/web/app/mobile/tags/drive/file.tag b/src/web/app/mobile/tags/drive/file.tag
index 93a8dba7e5..0b3506a430 100644
--- a/src/web/app/mobile/tags/drive/file.tag
+++ b/src/web/app/mobile/tags/drive/file.tag
@@ -1,119 +1,123 @@
-<mk-drive-file onclick={ onclick } data-is-selected={ isSelected }>
- <div class="container">
- <div class="thumbnail" style={ 'background-image: url(' + file.url + '?thumbnail&size=128)' }></div>
- <div class="body">
- <p class="name"><span>{ file.name.lastIndexOf('.') != -1 ? file.name.substr(0, file.name.lastIndexOf('.')) : file.name }</span><span class="ext" if={ file.name.lastIndexOf('.') != -1 }>{ file.name.substr(file.name.lastIndexOf('.')) }</span></p>
- <!--
- if file.tags.length > 0
- ul.tags
- each tag in file.tags
- li.tag(style={background: tag.color, color: contrast(tag.color)})= tag.name
- -->
- <footer>
- <p class="type"><mk-file-type-icon type={ file.type }/>{ file.type }</p>
- <p class="separator"></p>
- <p class="data-size">{ bytesToSize(file.datasize) }</p>
- <p class="separator"></p>
- <p class="created-at">
- %fa:R clock%<mk-time time={ file.created_at }/>
- </p>
- </footer>
+<mk-drive-file data-is-selected={ isSelected }>
+ <a onclick={ onclick } href="/i/drive/file/{ file.id }">
+ <div class="container">
+ <div class="thumbnail" style={ 'background-image: url(' + file.url + '?thumbnail&size=128)' }></div>
+ <div class="body">
+ <p class="name"><span>{ file.name.lastIndexOf('.') != -1 ? file.name.substr(0, file.name.lastIndexOf('.')) : file.name }</span><span class="ext" if={ file.name.lastIndexOf('.') != -1 }>{ file.name.substr(file.name.lastIndexOf('.')) }</span></p>
+ <!--
+ if file.tags.length > 0
+ ul.tags
+ each tag in file.tags
+ li.tag(style={background: tag.color, color: contrast(tag.color)})= tag.name
+ -->
+ <footer>
+ <p class="type"><mk-file-type-icon type={ file.type }/>{ file.type }</p>
+ <p class="separator"></p>
+ <p class="data-size">{ bytesToSize(file.datasize) }</p>
+ <p class="separator"></p>
+ <p class="created-at">
+ %fa:R clock%<mk-time time={ file.created_at }/>
+ </p>
+ </footer>
+ </div>
</div>
- </div>
+ </a>
<style>
:scope
display block
- &, *
- user-select none
+ > a
+ display block
+ text-decoration none !important
- *
- pointer-events none
+ *
+ user-select none
+ pointer-events none
- > .container
- max-width 500px
- margin 0 auto
- padding 16px
+ > .container
+ max-width 500px
+ margin 0 auto
+ padding 16px
- &:after
- content ""
- display block
- clear both
-
- > .thumbnail
- display block
- float left
- width 64px
- height 64px
- background-size cover
- background-position center center
-
- > .body
- display block
- float left
- width calc(100% - 74px)
- margin-left 10px
-
- > .name
+ &:after
+ content ""
display block
- margin 0
- padding 0
- font-size 0.9em
- font-weight bold
- color #555
- text-overflow ellipsis
- overflow-wrap break-word
-
- > .ext
- opacity 0.5
+ clear both
- > .tags
+ > .thumbnail
display block
- margin 4px 0 0 0
- padding 0
- list-style none
- font-size 0.5em
+ float left
+ width 64px
+ height 64px
+ background-size cover
+ background-position center center
- > .tag
- display inline-block
- margin 0 5px 0 0
- padding 1px 5px
- border-radius 2px
-
- > footer
+ > .body
display block
- margin 4px 0 0 0
- font-size 0.7em
-
- > .separator
- display inline
- margin 0
- padding 0 4px
- color #CDCDCD
+ float left
+ width calc(100% - 74px)
+ margin-left 10px
- > .type
- display inline
+ > .name
+ display block
margin 0
padding 0
- color #9D9D9D
+ font-size 0.9em
+ font-weight bold
+ color #555
+ text-overflow ellipsis
+ overflow-wrap break-word
- > mk-file-type-icon
- margin-right 4px
+ > .ext
+ opacity 0.5
- > .data-size
- display inline
- margin 0
+ > .tags
+ display block
+ margin 4px 0 0 0
padding 0
- color #9D9D9D
+ list-style none
+ font-size 0.5em
- > .created-at
- display inline
- margin 0
- padding 0
- color #BDBDBD
+ > .tag
+ display inline-block
+ margin 0 5px 0 0
+ padding 1px 5px
+ border-radius 2px
+
+ > footer
+ display block
+ margin 4px 0 0 0
+ font-size 0.7em
+
+ > .separator
+ display inline
+ margin 0
+ padding 0 4px
+ color #CDCDCD
+
+ > .type
+ display inline
+ margin 0
+ padding 0
+ color #9D9D9D
+
+ > mk-file-type-icon
+ margin-right 4px
+
+ > .data-size
+ display inline
+ margin 0
+ padding 0
+ color #9D9D9D
+
+ > .created-at
+ display inline
+ margin 0
+ padding 0
+ color #BDBDBD
- > [data-fa]
- margin-right 2px
+ > [data-fa]
+ margin-right 2px
&[data-is-selected]
background $theme-color
@@ -136,6 +140,7 @@
this.onclick = () => {
this.browser.chooseFile(this.file);
+ return false;
};
</script>
</mk-drive-file>
diff --git a/src/web/app/mobile/tags/drive/folder.tag b/src/web/app/mobile/tags/drive/folder.tag
index 196e7e326b..785847a9ca 100644
--- a/src/web/app/mobile/tags/drive/folder.tag
+++ b/src/web/app/mobile/tags/drive/folder.tag
@@ -1,39 +1,43 @@
<mk-drive-folder onclick={ onclick }>
- <div class="container">
- <p class="name">%fa:folder%{ folder.name }</p>%fa:angle-right%
- </div>
+ <a onclick={ onclick } href="/i/drive/folder/{ folder.id }">
+ <div class="container">
+ <p class="name">%fa:folder%{ folder.name }</p>%fa:angle-right%
+ </div>
+ </a>
<style>
:scope
display block
- color #777
- &, *
- user-select none
+ > a
+ display block
+ color #777
+ text-decoration none !important
- *
- pointer-events none
+ *
+ user-select none
+ pointer-events none
- > .container
- max-width 500px
- margin 0 auto
- padding 16px
+ > .container
+ max-width 500px
+ margin 0 auto
+ padding 16px
- > .name
- display block
- margin 0
- padding 0
+ > .name
+ display block
+ margin 0
+ padding 0
- > [data-fa]
- margin-right 6px
+ > [data-fa]
+ margin-right 6px
- > [data-fa]
- position absolute
- top 0
- bottom 0
- right 8px
- margin auto 0 auto 0
- width 1em
- height 1em
+ > [data-fa]
+ position absolute
+ top 0
+ bottom 0
+ right 8px
+ margin auto 0 auto 0
+ width 1em
+ height 1em
</style>
<script>
@@ -42,6 +46,7 @@
this.onclick = () => {
this.browser.cd(this.folder);
+ return false;
};
</script>
</mk-drive-folder>
generated by cgit v1.2.3-freya (git 2.53.0.84.g453e7b744a) at 2026-04-25 18:18:31 +0000