mirror of
https://github.com/VueFileManager/vuefilemanager.git
synced 2026-04-05 18:23:48 +00:00
tailwind 3 upgrade part 3
This commit is contained in:
3
public/css/tailwind.css
vendored
3
public/css/tailwind.css
vendored
File diff suppressed because one or more lines are too long
18
resources/css/tailwind.css
vendored
18
resources/css/tailwind.css
vendored
@@ -1,3 +1,19 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
@tailwind utilities;
|
||||
|
||||
.card {
|
||||
@apply dark:bg-dark-foreground bg-white sm:p-6 p-4 rounded-xl lg:mb-6 mb-5
|
||||
}
|
||||
|
||||
.widget-card {
|
||||
@apply dark:bg-dark-foreground bg-white lg:p-5 p-4 rounded-xl
|
||||
}
|
||||
|
||||
.input-dark {
|
||||
@apply w-full dark:bg-2x-dark-foreground bg-light-background py-3 px-5 rounded-lg appearance-none border-transparent text-base font-bold border
|
||||
}
|
||||
|
||||
.text-limit {
|
||||
@apply whitespace-nowrap text-ellipsis overflow-x-hidden block
|
||||
}
|
||||
@@ -142,22 +142,6 @@ export default {
|
||||
@import '../sass/vuefilemanager/variables';
|
||||
@import '../sass/vuefilemanager/mixins';
|
||||
|
||||
.card {
|
||||
@apply dark:bg-dark-foreground bg-white sm:p-6 p-4 rounded-xl lg:mb-6 mb-5
|
||||
}
|
||||
|
||||
.widget-card {
|
||||
@apply dark:bg-dark-foreground bg-white lg:p-5 p-4 rounded-xl
|
||||
}
|
||||
|
||||
.input-dark {
|
||||
@apply w-full dark:bg-2x-dark-foreground bg-light-background py-3 px-5 rounded-lg appearance-none border-transparent text-base font-bold border
|
||||
}
|
||||
|
||||
.text-limit {
|
||||
@apply whitespace-nowrap overflow-ellipsis overflow-x-hidden block
|
||||
}
|
||||
|
||||
input:-webkit-autofill {
|
||||
transition-delay: 999999999999s;
|
||||
}
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
:member="row.data.relationships.settings"
|
||||
/>
|
||||
<div class="ml-3 pr-10">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden overflow-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden text-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
{{ row.data.relationships.settings.data.attributes.name }}
|
||||
</b>
|
||||
<span class="block text-xs dark:text-gray-500 text-gray-600">
|
||||
@@ -71,7 +71,7 @@
|
||||
:member="row.data.relationships.settings"
|
||||
/>
|
||||
<div class="ml-3 pr-10">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden overflow-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden text-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
{{ row.data.relationships.settings.data.attributes.name }}
|
||||
</b>
|
||||
<span class="block text-xs dark:text-gray-500 text-gray-600">
|
||||
@@ -135,7 +135,7 @@
|
||||
:member="row.data.relationships.settings"
|
||||
/>
|
||||
<div class="ml-3 pr-10">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden overflow-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden text-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
{{ row.data.relationships.settings.data.attributes.name }}
|
||||
</b>
|
||||
<span class="block text-xs dark:text-gray-500 text-gray-600">
|
||||
|
||||
@@ -19,7 +19,7 @@
|
||||
:member="row.data.relationships.user"
|
||||
/>
|
||||
<div class="ml-3 pr-10">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden overflow-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden text-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
{{ row.data.relationships.user.data.attributes.name }}
|
||||
</b>
|
||||
<span class="block text-xs dark:text-gray-500 text-gray-600">
|
||||
|
||||
@@ -300,7 +300,7 @@
|
||||
@include transition(150ms);
|
||||
pointer-events: none;
|
||||
margin-right: 6px;
|
||||
flex-shrink: 0;
|
||||
shrink: 0;
|
||||
}
|
||||
|
||||
.location-title {
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="flex items-center justify-center">
|
||||
<span class="text-theme dark-text-theme lg:text-xs text-tiny font-semibold absolute z-10 inline-block mx-auto mt-1 w-7 overflow-ellipsis overflow-hidden text-center">
|
||||
<span class="text-theme dark-text-theme lg:text-xs text-tiny font-semibold absolute z-10 inline-block mx-auto mt-1 w-7 text-ellipsis overflow-hidden text-center">
|
||||
{{ entry.data.attributes.mimetype }}
|
||||
</span>
|
||||
|
||||
|
||||
@@ -58,7 +58,7 @@
|
||||
<div class="text-center">
|
||||
|
||||
<!--Item Title-->
|
||||
<b class="inline-block leading-3 text-sm hover:underline w-full overflow-ellipsis overflow-hidden whitespace-nowrap md:px-6 tracking-tigh" ref="name" @input="renameItem" @keydown.delete.stop @click.stop :contenteditable="canEditName">
|
||||
<b class="inline-block leading-3 text-sm hover:underline w-full text-ellipsis overflow-hidden whitespace-nowrap md:px-6 tracking-tigh" ref="name" @input="renameItem" @keydown.delete.stop @click.stop :contenteditable="canEditName">
|
||||
{{ itemName }}
|
||||
</b>
|
||||
|
||||
|
||||
@@ -37,7 +37,7 @@
|
||||
<div class="pl-2">
|
||||
|
||||
<!--Item Title-->
|
||||
<b class="block text-sm mb-0.5 overflow-ellipsis overflow-hidden hover:underline whitespace-nowrap" style="max-width: 240px" ref="name" @input="renameItem" @keydown.delete.stop @click.stop :contenteditable="canEditName">
|
||||
<b class="block text-sm mb-0.5 text-ellipsis overflow-hidden hover:underline whitespace-nowrap" style="max-width: 240px" ref="name" @input="renameItem" @keydown.delete.stop @click.stop :contenteditable="canEditName">
|
||||
{{ itemName }}
|
||||
</b>
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="flex-shrink-0 flex-grow-0">
|
||||
<div class="shrink-0 grow-0">
|
||||
<img
|
||||
:style="{width: size + 'px', height: size + 'px'}"
|
||||
v-if="member.data.attributes.avatar"
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
<chevron-left-icon size="17" :class="{'opacity-0 -translate-x-3': ! isLoadedFolder, 'opacity-100 translate-x-0': isLoadedFolder }" class="transform align-middle cursor-pointer mr-2 -ml-1 transition-all duration-200" />
|
||||
|
||||
<!--Folder Title-->
|
||||
<div :class="{'-translate-x-4': ! isLoadedFolder}" class="transform lg:text-base text-sm align-middle font-bold overflow-hidden overflow-ellipsis inline-block whitespace-nowrap transition-all duration-200" style="max-width: 200px;">
|
||||
<div :class="{'-translate-x-4': ! isLoadedFolder}" class="transform lg:text-base text-sm align-middle font-bold overflow-hidden text-ellipsis inline-block whitespace-nowrap transition-all duration-200" style="max-width: 200px;">
|
||||
{{ $getCurrentLocationName() }}
|
||||
</div>
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<file-icon v-if="icon === 'file'" class="text-theme vue-feather" size="19" />
|
||||
</div>
|
||||
<div>
|
||||
<b class="font-bold text-base inline-block whitespace-nowrap 2xl:w-72 w-52 overflow-ellipsis overflow-hidden leading-3">
|
||||
<b class="font-bold text-base inline-block whitespace-nowrap 2xl:w-72 w-52 text-ellipsis overflow-hidden leading-3">
|
||||
{{ title }}
|
||||
</b>
|
||||
<small class="font-bold text-xs text-gray-400 block">
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
<user-icon v-if="selected.icon === 'user'" size="14" class="vue-feather text-theme" />
|
||||
<edit2-icon v-if="selected.icon === 'user-edit'" size="14" class="vue-feather text-theme" />
|
||||
</div>
|
||||
<span class="whitespace-nowrap w-full inline-block overflow-hidden overflow-ellipsis option-value pl-2">
|
||||
<span class="whitespace-nowrap w-full inline-block overflow-hidden text-ellipsis option-value pl-2">
|
||||
{{ selected.label }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="flex items-center flex-shrink-0 flex-grow-0">
|
||||
<div class="flex items-center shrink-0 grow-0">
|
||||
<MemberAvatar
|
||||
class="mr-3 flex-shrink-0"
|
||||
class="mr-3 shrink-0"
|
||||
:is-border="false"
|
||||
:size="52"
|
||||
:member="member"
|
||||
|
||||
@@ -34,7 +34,7 @@
|
||||
<div class="pl-2">
|
||||
|
||||
<!--Item Title-->
|
||||
<b class="block text-sm mb-0.5 overflow-ellipsis overflow-hidden hover:underline whitespace-nowrap" style="max-width: 240px">
|
||||
<b class="block text-sm mb-0.5 text-ellipsis overflow-hidden hover:underline whitespace-nowrap" style="max-width: 240px">
|
||||
{{ item.data.attributes.name }}
|
||||
</b>
|
||||
|
||||
|
||||
@@ -24,7 +24,7 @@
|
||||
<!--Item label-->
|
||||
<b
|
||||
@click="getFolder"
|
||||
class="text-sm font-bold whitespace-nowrap overflow-x-hidden overflow-ellipsis inline-block ml-3 transition-all duration-150"
|
||||
class="text-sm font-bold whitespace-nowrap overflow-x-hidden text-ellipsis inline-block ml-3 transition-all duration-150"
|
||||
:class="{'text-theme': isSelectedItem}"
|
||||
>
|
||||
{{ nodes.name }}
|
||||
@@ -32,7 +32,7 @@
|
||||
</div>
|
||||
|
||||
<!--Children-->
|
||||
<TreeMenu
|
||||
<tree-node
|
||||
:disabled-by-id="disabledById"
|
||||
:depth="depth + 1"
|
||||
v-if="isVisible"
|
||||
@@ -44,7 +44,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TreeMenu from './TreeMenu'
|
||||
//import TreeMenu from './TreeMenu'
|
||||
import {FolderIcon, ChevronRightIcon, HardDriveIcon, UsersIcon, UserPlusIcon} from 'vue-feather-icons'
|
||||
import {events} from '../../bus'
|
||||
import {mapGetters} from 'vuex'
|
||||
@@ -62,7 +62,7 @@
|
||||
UserPlusIcon,
|
||||
FolderIcon,
|
||||
UsersIcon,
|
||||
TreeMenu,
|
||||
'tree-node': () => import('./TreeMenuNavigator'),
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
|
||||
@@ -18,18 +18,17 @@
|
||||
</div>
|
||||
<folder-icon size="17" class="mr-2.5 vue-feather" :class="{'text-theme': isSelected}" />
|
||||
<b
|
||||
class="font-bold text-xs max-w-1 overflow-hidden overflow-ellipsis whitespace-nowrap"
|
||||
class="font-bold text-xs max-w-1 overflow-hidden text-ellipsis whitespace-nowrap"
|
||||
:class="{'text-theme': isSelected}"
|
||||
>
|
||||
{{ nodes.name }}
|
||||
</b>
|
||||
</div>
|
||||
<TreeMenuNavigator :disabled="disableChildren" :depth="depth + 1" v-if="isVisible" :nodes="item" v-for="item in nodes.folders" :key="item.id" />
|
||||
<tree-node :disabled="disableChildren" :depth="depth + 1" v-if="isVisible" :nodes="item" v-for="item in nodes.folders" :key="item.id" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TreeMenuNavigator from './TreeMenuNavigator'
|
||||
import {FolderIcon, ChevronRightIcon} from 'vue-feather-icons'
|
||||
import {mapGetters} from 'vuex'
|
||||
import {events} from '../../bus'
|
||||
@@ -42,7 +41,7 @@
|
||||
'depth',
|
||||
],
|
||||
components: {
|
||||
TreeMenuNavigator,
|
||||
'tree-node': () => import('./TreeMenuNavigator'),
|
||||
ChevronRightIcon,
|
||||
FolderIcon,
|
||||
},
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<section class="content-sidebar flex-none xl:w-48 w-40 lg:block hidden overflow-y-auto pt-6 select-none dark:bg-dark-background bg-light-background z-10" id="content-sidebar">
|
||||
<section class="content-sidebar flex-none xl:w-56 w-52 lg:block hidden overflow-y-auto pt-6 select-none dark:bg-dark-background bg-light-background z-10" id="content-sidebar">
|
||||
<slot></slot>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
@@ -136,7 +136,7 @@
|
||||
:member="result"
|
||||
/>
|
||||
<div class="ml-3">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden overflow-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden text-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
{{ result.data.attributes.name }}
|
||||
</b>
|
||||
<span class="block text-xs dark:text-gray-500 text-gray-600">
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
:member="row.data.relationships.user"
|
||||
/>
|
||||
<div class="ml-3 pr-10">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden overflow-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden text-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
{{ row.data.relationships.user.data.attributes.name }}
|
||||
</b>
|
||||
<span class="block text-xs dark:text-gray-500 text-gray-600">
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
:member="row.data.relationships.user"
|
||||
/>
|
||||
<div class="ml-3 pr-10">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden overflow-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden text-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
{{ row.data.relationships.user.data.attributes.name }}
|
||||
</b>
|
||||
<span class="block text-xs dark:text-gray-500 text-gray-600">
|
||||
|
||||
@@ -24,7 +24,7 @@
|
||||
|
||||
<!--Member-->
|
||||
<div v-if="entry.type === 'member'" class="info">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden overflow-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden text-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
{{ entry.name }}
|
||||
</b>
|
||||
<span class="block text-xs dark:text-gray-500 text-gray-600">
|
||||
@@ -34,7 +34,7 @@
|
||||
|
||||
<!--Invitation-->
|
||||
<div v-if="entry.type === 'invitation'" class="info">
|
||||
<b class="text-sm font-bold block max-w-xs overflow-hidden overflow-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
<b class="text-sm font-bold block max-w-xs overflow-hidden text-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
{{ entry.email }}
|
||||
</b>
|
||||
<span v-if="entry.id" class="block text-xs dark:text-gray-500 text-gray-600">
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
:member="row.data.relationships.user"
|
||||
/>
|
||||
<div class="ml-3 pr-10">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden overflow-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden text-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
{{ row.data.relationships.user.data.attributes.name }}
|
||||
</b>
|
||||
<span class="block text-xs dark:text-gray-500 text-gray-600">
|
||||
@@ -40,7 +40,7 @@
|
||||
:member="row.data.relationships.user"
|
||||
/>
|
||||
<div class="ml-3 pr-10">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden overflow-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden text-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
{{ row.data.relationships.user.data.attributes.name }}
|
||||
</b>
|
||||
<span class="block text-xs dark:text-gray-500 text-gray-600">
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
:member="row.data.relationships.user"
|
||||
/>
|
||||
<div class="ml-3 pr-10">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden overflow-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden text-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
{{ row.data.relationships.user.data.attributes.name }}
|
||||
</b>
|
||||
<span class="block text-xs dark:text-gray-500 text-gray-600">
|
||||
|
||||
@@ -27,7 +27,7 @@
|
||||
:member="row.data.relationships.settings"
|
||||
/>
|
||||
<div class="ml-3 pr-10">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden overflow-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden text-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
{{ row.data.relationships.settings.data.attributes.name }}
|
||||
</b>
|
||||
<span class="block text-xs dark:text-gray-500 text-gray-600">
|
||||
@@ -86,7 +86,7 @@
|
||||
:member="row.data.relationships.settings"
|
||||
/>
|
||||
<div class="ml-3 pr-10">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden overflow-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden text-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
{{ row.data.relationships.settings.data.attributes.name }}
|
||||
</b>
|
||||
<span class="block text-xs dark:text-gray-500 text-gray-600">
|
||||
@@ -150,7 +150,7 @@
|
||||
:member="row.data.relationships.settings"
|
||||
/>
|
||||
<div class="ml-3 pr-10">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden overflow-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
<b class="text-sm font-bold block max-w-1 overflow-hidden text-ellipsis whitespace-nowrap" style="max-width: 155px;">
|
||||
{{ row.data.relationships.settings.data.attributes.name }}
|
||||
</b>
|
||||
<span class="block text-xs dark:text-gray-500 text-gray-600">
|
||||
|
||||
@@ -44,7 +44,7 @@
|
||||
<div @click="goToFolder(folder)" v-for="folder in favourites" :key="folder.data.id" class="group flex items-center justify-between py-2.5 cursor-pointer">
|
||||
<div class="flex items-center">
|
||||
<folder-icon size="17" class="mr-2.5 vue-feather" :class="{'text-theme': $route.params.id === folder.data.id}" />
|
||||
<span class="font-bold text-xs max-w-1 overflow-hidden overflow-ellipsis whitespace-nowrap" :class="{'text-theme': $route.params.id === folder.data.id}">
|
||||
<span class="font-bold text-xs max-w-1 overflow-hidden text-ellipsis whitespace-nowrap" :class="{'text-theme': $route.params.id === folder.data.id}">
|
||||
{{ folder.data.attributes.name }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<div class="flex text-center py-5 px-5 w-full justify-between items-center z-20 lg:hidden block">
|
||||
|
||||
<!--Location Title-->
|
||||
<div class="text-sm dark:text-gray-100 align-middle font-bold overflow-hidden overflow-ellipsis inline-block whitespace-nowrap transition-all duration-200" style="max-width: 200px;">
|
||||
<div class="text-sm dark:text-gray-100 align-middle font-bold overflow-hidden text-ellipsis inline-block whitespace-nowrap transition-all duration-200" style="max-width: 200px;">
|
||||
{{ locationName }}
|
||||
</div>
|
||||
|
||||
|
||||
@@ -30,7 +30,7 @@
|
||||
|
||||
{{--StyleSheet--}}
|
||||
<link href="{{ mix('css/app.css') }}?v={{ get_version() }}" rel="stylesheet" type="text/css">
|
||||
<link href="{{ asset('css/tailwind.css') }}?v={{ get_version() }}" rel="stylesheet" type="text/css">
|
||||
<link href="{{ mix('css/tailwind.css') }}?v={{ get_version() }}" rel="stylesheet" type="text/css">
|
||||
|
||||
{{--OG items--}}
|
||||
<meta property="og:url" content="{{ url('/') }}">
|
||||
|
||||
2
webpack.mix.js
vendored
2
webpack.mix.js
vendored
@@ -17,7 +17,7 @@ mix
|
||||
.sass('resources/sass/app.scss', 'public/css/app.css', {
|
||||
implementation: require('node-sass')
|
||||
})
|
||||
.postCss("resources/css/tailwind.css", "public/css", [
|
||||
.postCss("resources/css/tailwind.css", "public/css/tailwind.css", [
|
||||
require("tailwindcss"),
|
||||
])
|
||||
/*.webpackConfig({
|
||||
|
||||
Reference in New Issue
Block a user