KAZ/webtransfer
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add style to webcontentviewer

Browse Source
This commit is contained in:
GMrrc 2024-11-19 16:46:21 +01:00
parent 2a2c31b55f
commit 60875006fd
4 changed files with 1091 additions and 1024 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2068
js/main.js
View File

File diff suppressed because it is too large Load Diff

2
js/main.js.map
View File

File diff suppressed because one or more lines are too long

41
src/components/WebContentViewer.vue
View File

@ -1,33 +1,56 @@
<template> <template>
<div class="flex flex-col h-full w-full border"> <div class="flex flex-col h-full w-full border">
<div class="flex h-12 items-center border-b border-gray-300"> <div class="flex h-12 items-center border-b border-gray-300">
<div class="w-5/6 px-4 py-2 text-gray-500 font-semibold border-r border-gray-300">Nom</div> <div class="w-4/6 px-4 py-2 text-gray-500 font-semibold border-r border-gray-300">Nom</div>
<div class="w-1/6 px-4 py-2 text-gray-500 font-semibold">Taille</div> <div class="w-2/6 px-4 py-2 text-gray-500 font-semibold">Taille</div>
</div> </div>
<div class="overflow-y-auto"> <div class="overflow-y-auto">
<div v-for="(file, index) in sortedFiles" :key="file.fullPath" class="flex flex-col"> <div v-for="(file, index) in sortedFiles" :key="file.fullPath" class="flex flex-col">
<div <div
class="flex items-center pl-4 cursor-pointer" class="flex h-16 hover:bg-NcGray items-center pl-4 cursor-pointer rounded-lg border-b last:border-b-0 border-gray-300"
@click="toggleFolder(file)" @click="toggleFolder(file)"
v-if="file.isDirectory" v-if="file.isDirectory"
> >
<div class="w-5/6 flex items-center px-4 py-2 truncate"> <div class="w-4/6 flex items-center py-2 border-r border-gray-300 cursor-pointer">
<span class="mr-2">{{ folderMap[file.fullPath] ? '-' : '+' }}</span> <div class="w-12 h-12 flex items-center justify-center cursor-pointer">
<template>
<svg fill="currentColor" viewBox="0 0 24 24" class="text-NcBlue w-10 h-10 ">
<path
d="M10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6H12L10,4Z">
</path>
</svg>
</template>
</div>
<span class="mr-2 truncate cursor-pointer">{{ folderMap[file.fullPath] ? '-' : '+' }}</span>
{{ file.fullPath }} {{ file.fullPath }}
</div> </div>
<div class="w-1/6 px-4 py-2">-</div> <div class="w-1/6 px-4 py-2 cursor-pointer">-</div>
</div> </div>
<div <div
class="flex items-center pl-4" class="flex h-16 hover:bg-NcGray items-center pl-4 cursor-pointer rounded-lg border-b last:border-b-0 border-gray-300"
v-else v-else
> >
<div class="w-5/6 flex items-center px-4 py-2 truncate"> <template>
<div class="flex items-center justify-center cursor-pointer">
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" xml:space="preserve"
class="w-10 h-10"
style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2">
<path
d="M6 22c-.55 0-1.021-.196-1.412-.587A1.927 1.927 0 0 1 4 20V4c0-.55.196-1.021.588-1.413A1.926 1.926 0 0 1 6 2h8l6 6v12a1.93 1.93 0 0 1-.587 1.413A1.93 1.93 0 0 1 18 22H6Z"
style="fill:#969696;fill-rule:nonzero" transform="matrix(.7 0 0 .7 -.43 -.388)" />
</svg>
</div>
</template>
<div class="w-4/6 flex items-center px-4 py-2 truncate cursor-pointer">
{{ file.fullPath }} {{ file.fullPath }}
</div> </div>
<div class="w-1/6 px-4 py-2"> <div class="w-2/6 py-2 cursor-pointer">
{{ formatFileSize(file.size) }} {{ formatFileSize(file.size) }}
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>

4
src/output.css
View File

@ -687,6 +687,10 @@ video {
width: 83.333333%; width: 83.333333%;
} }
.w-2\/6 {
width: 33.333333%;
}
.flex-grow { .flex-grow {
flex-grow: 1; flex-grow: 1;
} }