obsidian-plugin/xuquan-nikkkki_FolderFile-Splitter-Plugin
1
0
Fork 0
mirror of https://github.com/xuquan-nikkkki/FolderFile-Splitter-Plugin.git synced 2026-07-22 05:37:28 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: change plugin name to avoid other brand name

Browse source
This commit is contained in:
Xu Quan 2025-02-25 11:10:09 +08:00
parent 634bc9bf6a
commit 8a88631cce
35 changed files with 225 additions and 231 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
README-CN.md
View file

@ -1,10 +1,10 @@
当然可以，下面是你的 `README` 文件的中文翻译：
# Apple Style Notes 插件
# FolderFile Splitter 插件
[English](./README.md) | [中文](./README.zh.md)
**Apple Style Notes** 是一款 Obsidian 插件。它通过将文件夹和文件列表分开展示，从而提供了一种全新的文件管理方式。插件的界面交互受苹果设计理念的启发，旨在提供一种更简洁、更直观的方式来浏览和整理笔记。
**FolderFile Splitter** 是一款 Obsidian 插件。它通过将文件夹和文件列表分开展示，从而提供了一种全新的文件管理方式。插件的界面交互受 Apple Notes 设计理念的启发，旨在提供一种更简洁、更直观的方式来浏览和整理笔记。
## 功能
@ -19,7 +19,7 @@
1. **下载插件**
- 进入本仓库的 [Releases](https://github.com/XuQuan-nikkkki/apple-style-notes-plugin/releases) 页面。
- 进入本仓库的 [Releases](https://github.com/XuQuan-nikkkki/FolderFile-Splitter-Plugin/releases) 页面。
- 下载最新的 `.zip` 压缩包。
2. **解压并放入插件文件夹**
@ -53,4 +53,4 @@
## 反馈与问题
如果你遇到任何 bug 或有功能建议，欢迎你在这个 [GitHub 仓库](https://github.com/XuQuan-nikkkki/apple-style-notes-plugin)中提交问题。你的反馈对于改进 Apple Style Notes 插件非常重要！
如果你遇到任何 bug 或有功能建议，欢迎你在这个 [GitHub 仓库](https://github.com/XuQuan-nikkkki/FolderFile-Splitter-Plugin)中提交问题。你的反馈对于改进 FolderFile Splitter 插件非常重要！

8
README.md
View file

@ -1,8 +1,8 @@
# Apple Style Notes Plugin
# FolderFile Splitter Plugin
[English](./README.md) | [中文](./README-CN.md)
**Apple Style Notes** is an Obsidian plugin that brings a fresh approach to file management by splitting folders and files into distinct, visually separated lists. Inspired by Apple's elegant design principles, this plugin offers a cleaner, more intuitive way to browse and organize your notes.
**FolderFile Splitter** is an Obsidian plugin that brings a fresh approach to file management by splitting folders and files into distinct, visually separated lists. Inspired by Apple's elegant design principles, this plugin offers a cleaner, more intuitive way to browse and organize your notes.
## Features
@ -17,7 +17,7 @@
1. **Download the Plugin**
- Go to the [Releases](https://github.com/XuQuan-nikkkki/apple-style-notes-plugin/releases) section of this repository.
- Go to the [Releases](https://github.com/XuQuan-nikkkki/FolderFile-Splitter-Plugin/releases) section of this repository.
- Download the latest `.zip` file.
2. **Extract and Place in the Plugins Folder**
@ -49,4 +49,4 @@ To uninstall the plugin, simply disable or delete it from the Obsidian plugin se
## Feedback & Issues
If you encounter any bugs or have feature suggestions, please open an issue on this [GitHub repository](https://github.com/XuQuan-nikkkki/apple-style-notes-plugin). Your feedback is invaluable in helping us improve Apple Style Notes!
If you encounter any bugs or have feature suggestions, please open an issue on this [GitHub repository](https://github.com/XuQuan-nikkkki/FolderFile-Splitter-Plugin). Your feedback is invaluable in helping us improve FolderFile Splitter!

4
manifest.json
View file

@ -1,6 +1,6 @@
{
"id": "apple-style-notes",
"name": "Apple Style Notes",
"id": "folder-file-splitter",
"name": "FolderFile Splitter",
"version": "0.1.0",
"minAppVersion": "0.15.0",
"description": "Splits folder and file lists into separate views, simplifying navigation, improving clarity, and making it more intuitive to organize your notes.",

4
package-lock.json generated
View file

@ -1,11 +1,11 @@
{
"name": "apple-style-notes-plugin",
"name": "folder-file-splitter",
"version": "1.0.0",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "apple-style-notes-plugin",
"name": "folder-file-splitter",
"version": "1.0.0",
"license": "MIT",
"dependencies": {

2
package.json
View file

@ -1,5 +1,5 @@
{
"name": "apple-style-notes-plugin",
"name": "folder-file-splitter",
"version": "1.0.0",
"description": "This is an Obsidian plugin",
"main": "main.js",

10
src/FileTreeView.tsx
View file

@ -1,14 +1,14 @@
import { Root, createRoot } from "react-dom/client";
import { ItemView, WorkspaceLeaf } from "obsidian";
import AppleStyleNotesPlugin from "./main";
import FolderFileSplitterPlugin from "./main";
import FileTree from "./components/FileTree";
export class FileTreeView extends ItemView {
root: Root;
plugin: AppleStyleNotesPlugin;
plugin: FolderFileSplitterPlugin;
constructor(leaf: WorkspaceLeaf, plugin: AppleStyleNotesPlugin) {
constructor(leaf: WorkspaceLeaf, plugin: FolderFileSplitterPlugin) {
super(leaf);
this.plugin = plugin;
}
@ -22,7 +22,7 @@ export class FileTreeView extends ItemView {
}
getIcon(): string {
return this.plugin?.ICON
return this.plugin?.ICON;
}
destroy() {
@ -38,7 +38,7 @@ export class FileTreeView extends ItemView {
this.destroy();
this.root = createRoot(this.contentEl);
this.root.render(
<div className="asn-plugin-view">
<div className="ffs-plugin-view">
<FileTree plugin={this.plugin} />
</div>
);

6
src/SettingTab.tsx
View file

@ -1,12 +1,12 @@
import { App, PluginSettingTab, Setting } from "obsidian";
import AppleStyleNotesPlugin from "./main";
import FolderFileSplitterPlugin from "./main";
import { expandFolderByClickingOnElement } from "./settings";
import { saveSettingsToLocalStorage } from "./utils";
export class SettingTab extends PluginSettingTab {
plugin: AppleStyleNotesPlugin;
plugin: FolderFileSplitterPlugin;
constructor(app: App, plugin: AppleStyleNotesPlugin) {
constructor(app: App, plugin: FolderFileSplitterPlugin) {
super(app, plugin);
this.plugin = plugin;
}

27
src/assets/constants.ts
View file

@ -1,23 +1,24 @@
import { TAbstractFile } from "obsidian";
export const ASN_FOCUSED_FOLDER_PATH_KEY =
"AppleStyleNotesPlugin-FocusedFolderPath";
export const ASN_EXPANDED_FOLDER_PATHS_KEY =
"AppleStyleNotesPlugin-ExpandedFolderPaths";
export const ASN_FOCUSED_FILE_PATH_KEY =
"AppleStyleNotesPlugin-FocusedFilePath";
export const ASN_FOLDER_SORT_RULE_KEY = "AppleStyleNotesPlugin-FolderSortRule";
export const ASN_FILE_SORT_RULE_KEY = "AppleStyleNotesPlugin-FileSortRule";
export const FFS_FOCUSED_FOLDER_PATH_KEY =
"FolderFileSplitterPlugin-FocusedFolderPath";
export const FFS_EXPANDED_FOLDER_PATHS_KEY =
"FolderFileSplitterPlugin-ExpandedFolderPaths";
export const FFS_FOCUSED_FILE_PATH_KEY =
"FolderFileSplitterPlugin-FocusedFilePath";
export const FFS_FOLDER_SORT_RULE_KEY =
"FolderFileSplitterPlugin-FolderSortRule";
export const FFS_FILE_SORT_RULE_KEY = "FolderFileSplitterPlugin-FileSortRule";
export const ASN_FOLDER_PANE_WIDTH_KEY =
"AppleStyleNotesPlugin-FolderPaneWidth";
export const FFS_FOLDER_PANE_WIDTH_KEY =
"FolderFileSplitterPlugin-FolderPaneWidth";
export const VaultChangeEventName = "ASN-VaultChangeEvent";
export const VaultChangeEventName = "FFS-VaultChangeEvent";
export type VaultChangeType = "create" | "modify" | "delete" | "rename";
export type VaultChangeEvent = CustomEvent<{
file: TAbstractFile;
changeType: VaultChangeType;
}>;
export const ASN_PLUGIN_SETTINGS = "AppleStyleNotesPluging-Settings";
export const SettingsChangeEventName = "ASN-SettingsChangeEvent";
export const FFS_PLUGIN_SETTINGS = "FolderFileSplitterPlugin-Settings";
export const SettingsChangeEventName = "FFS-SettingsChangeEvent";

2
src/assets/icons/AddFileIcon.tsx
View file

@ -8,7 +8,7 @@ const AddFileIcon = () => {
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
className="asn-folder-actions-icon"
className="ffs-folder-actions-icon"
>
<path d="M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" />
<path d="M14 2v4a2 2 0 0 0 2 2h4" />

6
src/assets/icons/AddFolderIcon.tsx
View file

@ -8,10 +8,10 @@ const AddFolderIcon = () => {
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
className="asn-folder-actions-icon"
className="ffs-folder-actions-icon"
>
<path d="M12 10v6"></path>
<path d="M9 13h6"></path>
<path d="M12 10v6"></path>
<path d="M9 13h6"></path>
<path d="M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z" />
</svg>
);

8
src/assets/icons/ArrowDownIcon.tsx
View file

@ -3,14 +3,12 @@ const ArrowDownIcon = () => (
viewBox="0 0 84.8212890625 52.0029296875"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
className="asn-icon asn-arrow-down-icon"
className="ffs-icon ffs-arrow-down-icon"
>
<g transform="matrix(1 0 0 1 -12.444326171874991 61.2314453125)">
<path
d="M54.8828-9.22852C56.1035-9.22852 57.3242-9.7168 58.1543-10.6445L95.9473-49.3652C96.7773-50.1953 97.2656-51.2695 97.2656-52.4902C97.2656-55.0293 95.3613-56.9824 92.8223-56.9824C91.6016-56.9824 90.4785-56.4941 89.6484-55.7129L54.8828-20.166L20.0684-55.7129C19.2871-56.4941 18.1641-56.9824 16.8945-56.9824C14.3555-56.9824 12.4512-55.0293 12.4512-52.4902C12.4512-51.2695 12.9395-50.1953 13.7695-49.3164L51.5625-10.6445C52.4902-9.7168 53.6133-9.22852 54.8828-9.22852Z"
/>
<path d="M54.8828-9.22852C56.1035-9.22852 57.3242-9.7168 58.1543-10.6445L95.9473-49.3652C96.7773-50.1953 97.2656-51.2695 97.2656-52.4902C97.2656-55.0293 95.3613-56.9824 92.8223-56.9824C91.6016-56.9824 90.4785-56.4941 89.6484-55.7129L54.8828-20.166L20.0684-55.7129C19.2871-56.4941 18.1641-56.9824 16.8945-56.9824C14.3555-56.9824 12.4512-55.0293 12.4512-52.4902C12.4512-51.2695 12.9395-50.1953 13.7695-49.3164L51.5625-10.6445C52.4902-9.7168 53.6133-9.22852 54.8828-9.22852Z" />
</g>
</svg>
);
export default ArrowDownIcon
export default ArrowDownIcon;

8
src/assets/icons/ArrowRightIcon.tsx
View file

@ -3,14 +3,12 @@ const ArrowRightIcon = () => (
viewBox="0 0 60.2601318359375 84.8134765625"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
className="asn-icon asn-arrow-right-icon"
className="ffs-icon ffs-arrow-right-icon"
>
<g transform="matrix(1 0 0 1 -6.194965820312518 77.63671875)">
<path
d="M66.4551-35.2539C66.4551-36.4746 65.9668-37.5977 65.0391-38.4766L26.3672-76.3672C25.4883-77.1973 24.4141-77.6367 23.1445-77.6367C20.6543-77.6367 18.7012-75.7324 18.7012-73.1934C18.7012-71.9727 19.1895-70.8496 19.9707-70.0195L55.5176-35.2539L19.9707-0.488281C19.1895 0.341797 18.7012 1.41602 18.7012 2.68555C18.7012 5.22461 20.6543 7.12891 23.1445 7.12891C24.4141 7.12891 25.4883 6.68945 26.3672 5.81055L65.0391-32.0312C65.9668-32.959 66.4551-34.0332 66.4551-35.2539Z"
/>
<path d="M66.4551-35.2539C66.4551-36.4746 65.9668-37.5977 65.0391-38.4766L26.3672-76.3672C25.4883-77.1973 24.4141-77.6367 23.1445-77.6367C20.6543-77.6367 18.7012-75.7324 18.7012-73.1934C18.7012-71.9727 19.1895-70.8496 19.9707-70.0195L55.5176-35.2539L19.9707-0.488281C19.1895 0.341797 18.7012 1.41602 18.7012 2.68555C18.7012 5.22461 20.6543 7.12891 23.1445 7.12891C24.4141 7.12891 25.4883 6.68945 26.3672 5.81055L65.0391-32.0312C65.9668-32.959 66.4551-34.0332 66.4551-35.2539Z" />
</g>
</svg>
);
export default ArrowRightIcon
export default ArrowRightIcon;

2
src/assets/icons/AscendingSortIcon.tsx
View file

@ -8,7 +8,7 @@ const AscendingSortIcon = () => {
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
className="asn-folder-actions-icon asn-sort-icon"
className="ffs-folder-actions-icon ffs-sort-icon"
>
<path d="m3 8 4-4 4 4" />
<path d="M7 4v16" />

2
src/assets/icons/CollapseIcon.tsx
View file

@ -8,7 +8,7 @@ const CollapseIcon = () => {
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
className="asn-folder-actions-icon asn-collapse-icon"
className="ffs-folder-actions-icon ffs-collapse-icon"
>
<path d="m7 20 5-5 5 5" />
<path d="m7 4 5 5 5-5" />

2
src/assets/icons/DescendingSortIcon.tsx
View file

@ -8,7 +8,7 @@ const DescendingSortIcon = () => {
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
className="asn-folder-actions-icon asn-reverse-sort-icon"
className="ffs-folder-actions-icon ffs-reverse-sort-icon"
>
<path d="m3 16 4 4 4-4" />
<path d="M7 20V4" />

2
src/assets/icons/EmptyFolderIcon.tsx
View file

@ -3,7 +3,7 @@ const EmptyFolderIcon = () => (
version="1.1"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 462.035 462.035"
className="asn-empty-folder-icon"
className="ffs-empty-folder-icon"
>
<g>
<path

2
src/assets/icons/ExpandIcon.tsx
View file

@ -8,7 +8,7 @@ const ExpandIcon = () => {
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
className="asn-folder-actions-icon asn-expand-icon"
className="ffs-folder-actions-icon ffs-expand-icon"
>
<path d="m7 15 5 5 5-5" />
<path d="m7 9 5-5 5 5" />

4
src/assets/icons/FolderIcon.tsx
View file

@ -3,7 +3,7 @@ const FolderIcon = () => (
viewBox="0 0 110.889892578125 89.9892578125"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
className="asn-icon asn-folder-icon"
className="ffs-icon ffs-folder-icon"
>
<g transform="matrix(1 0 0 1 -12.450024414062455 80.224609375)">
<path d="M27.7832 9.13086L109.473 9.13086C118.213 9.13086 123.34 4.05273 123.34-6.00586L123.34-56.1523C123.34-66.2109 118.164-71.2891 108.008-71.2891L61.1328-71.2891C57.8125-71.2891 55.8105-72.0703 53.3691-74.1699L50.3906-76.6113C47.168-79.3457 44.6777-80.2246 39.8438-80.2246L25.9277-80.2246C17.3828-80.2246 12.4512-75.3418 12.4512-65.5273L12.4512-6.00586C12.4512 4.10156 17.5781 9.13086 27.7832 9.13086ZM20.3125-65.0879C20.3125-69.9219 22.8516-72.4121 27.5391-72.4121L37.8418-72.4121C41.0645-72.4121 43.0176-71.582 45.5078-69.4824L48.4863-66.9922C51.6602-64.3555 54.248-63.4277 59.082-63.4277L107.861-63.4277C112.695-63.4277 115.479-60.791 115.479-55.7129L115.479-52.9297L20.3125-52.9297ZM27.8809 1.26953C22.998 1.26953 20.3125-1.31836 20.3125-6.39648L20.3125-45.5566L115.479-45.5566L115.479-6.34766C115.479-1.31836 112.695 1.26953 107.861 1.26953Z" />
@ -11,4 +11,4 @@ const FolderIcon = () => (
</svg>
);
export default FolderIcon
export default FolderIcon;

2
src/components/DraggableDivider.tsx
View file

@ -27,7 +27,7 @@ const DraggableDivider = ({ initialWidth, onChangeWidth }: Props) => {
return (
<div
className="asn-pane-divider"
className="ffs-pane-divider"
ref={dividerRef}
onMouseDown={handleMouseDown}
/>

14
src/components/File.tsx
View file

@ -4,14 +4,14 @@ import { StoreApi, UseBoundStore } from "zustand";
import { useShallow } from "zustand/react/shallow";
import { FileTreeStore } from "src/store";
import AppleStyleNotesPlugin from "src/main";
import FolderFileSplitterPlugin from "src/main";
import { moveCursorToEnd, selectText } from "src/utils";
import { FolderListModal } from "./FolderListModal";
type Props = {
useFileTreeStore: UseBoundStore<StoreApi<FileTreeStore>>;
file: TFile;
plugin: AppleStyleNotesPlugin;
plugin: FolderFileSplitterPlugin;
deleteFile: () => void;
};
const File = ({ file, useFileTreeStore, plugin, deleteFile }: Props) => {
@ -169,9 +169,9 @@ const File = ({ file, useFileTreeStore, plugin, deleteFile }: Props) => {
};
const isFocused = focusedFile?.path === file.path;
const className = "asn-file" + (isFocused ? " asn-focused-file" : "");
const className = "ffs-file" + (isFocused ? " ffs-focused-file" : "");
const fileNameClassName =
"asn-file-name" + (isEditing ? " asn-file-name-edit-mode" : "");
"ffs-file-name" + (isEditing ? " ffs-file-name-edit-mode" : "");
return (
<div
className={className}
@ -187,11 +187,11 @@ const File = ({ file, useFileTreeStore, plugin, deleteFile }: Props) => {
>
{name}
</div>
<div className="asn-file-details">
<span className="asn-file-created-time">
<div className="ffs-file-details">
<span className="ffs-file-created-time">
{new Date(file.stat.ctime).toLocaleString().split(" ")[0]}
</span>
<span className="asn-file-content-preview">
<span className="ffs-file-content-preview">
{contentPreview}
</span>
</div>

5
src/components/FileActions/CreateFile.tsx
View file

@ -23,10 +23,7 @@ const CreateFile = ({ useFileTreeStore }: Props) => {
};
return (
<div
className="asn-actions-icon-wrapper"
onClick={onCreateNewFile}
>
<div className="ffs-actions-icon-wrapper" onClick={onCreateNewFile}>
<AddFileIcon />
</div>
);

6
src/components/FileActions/SortFiles.tsx
View file

@ -5,7 +5,7 @@ import { useShallow } from "zustand/react/shallow";
import { AscendingSortIcon, DescendingSortIcon } from "src/assets/icons";
import { FileSortRule, FileTreeStore } from "src/store";
import AppleStyleNotesPlugin from "src/main";
import FolderFileSplitterPlugin from "src/main";
type FileSortRuleItem = {
text: string;
@ -39,7 +39,7 @@ const FileSortByCreatedTimeRules: FileSortRuleGroup = [
type Props = {
useFileTreeStore: UseBoundStore<StoreApi<FileTreeStore>>;
plugin: AppleStyleNotesPlugin;
plugin: FolderFileSplitterPlugin;
};
const SortFiles = ({ useFileTreeStore, plugin }: Props) => {
const {
@ -93,7 +93,7 @@ const SortFiles = ({ useFileTreeStore, plugin }: Props) => {
<DescendingSortIcon />
);
return (
<div className="asn-actions-icon-wrapper" onClick={onChangeSortRule}>
<div className="ffs-actions-icon-wrapper" onClick={onChangeSortRule}>
{icon}
</div>
);

18
src/components/FileTree.tsx
View file

@ -1,8 +1,8 @@
import { useMemo, useState } from "react";
import AppleStyleNotesPlugin from "src/main";
import FolderFileSplitterPlugin from "src/main";
import { createFileTreeStore } from "src/store";
import { ASN_FOLDER_PANE_WIDTH_KEY } from "src/assets/constants";
import { FFS_FOLDER_PANE_WIDTH_KEY } from "src/assets/constants";
import DraggableDivider from "./DraggableDivider";
import Files from "./Files";
import Folders from "./Folders";
@ -13,7 +13,7 @@ import CreateFile from "./FileActions/CreateFile";
import SortFiles from "./FileActions/SortFiles";
type Props = {
plugin: AppleStyleNotesPlugin;
plugin: FolderFileSplitterPlugin;
};
const FileTree = ({ plugin }: Props) => {
const useFileTreeStore = useMemo(
@ -27,13 +27,13 @@ const FileTree = ({ plugin }: Props) => {
const onChangeFolderPaneWidth = (width: number) => {
setFolderPaneWidth(width);
localStorage.setItem(ASN_FOLDER_PANE_WIDTH_KEY, String(width));
localStorage.setItem(FFS_FOLDER_PANE_WIDTH_KEY, String(width));
};
return (
<div className="asn-plugin-container">
<div className="asn-folder-pane" style={{ width: folderPaneWidth }}>
<div className="asn-actions asn-folder-actions">
<div className="ffs-plugin-container">
<div className="ffs-folder-pane" style={{ width: folderPaneWidth }}>
<div className="ffs-actions ffs-folder-actions">
<CreateFolder useFileTreeStore={useFileTreeStore} />
<SortFolders
useFileTreeStore={useFileTreeStore}
@ -47,8 +47,8 @@ const FileTree = ({ plugin }: Props) => {
initialWidth={folderPaneWidth}
onChangeWidth={onChangeFolderPaneWidth}
/>
<div className="asn-files-pane">
<div className="asn-actions asn-file-actions">
<div className="ffs-files-pane">
<div className="ffs-actions ffs-file-actions">
<CreateFile useFileTreeStore={useFileTreeStore} />
<SortFiles
useFileTreeStore={useFileTreeStore}

6
src/components/Files.tsx
View file

@ -6,14 +6,14 @@ import { FileTreeStore } from "src/store";
import { EmptyFolderIcon } from "src/assets/icons";
import File from "./File";
import AppleStyleNotesPlugin from "src/main";
import FolderFileSplitterPlugin from "src/main";
import { TFile } from "obsidian";
import { VaultChangeEvent, VaultChangeEventName } from "src/assets/constants";
import { isFile } from "src/utils";
type Props = {
useFileTreeStore: UseBoundStore<StoreApi<FileTreeStore>>;
plugin: AppleStyleNotesPlugin;
plugin: FolderFileSplitterPlugin;
};
const Files = ({ useFileTreeStore, plugin }: Props) => {
const {
@ -94,7 +94,7 @@ const Files = ({ useFileTreeStore, plugin }: Props) => {
const renderNoneFilesTips = () => {
return (
<div className="asn-none-files-tips">
<div className="ffs-none-files-tips">
<EmptyFolderIcon />
</div>
);

18
src/components/Folder.tsx
View file

@ -4,7 +4,7 @@ import { StoreApi, UseBoundStore } from "zustand";
import { useShallow } from "zustand/react/shallow";
import { ArrowDownIcon, ArrowRightIcon, FolderIcon } from "src/assets/icons";
import AppleStyleNotesPlugin from "src/main";
import FolderFileSplitterPlugin from "src/main";
import { FileTreeStore } from "src/store";
import { moveCursorToEnd, selectText } from "src/utils";
import { FolderListModal } from "./FolderListModal";
@ -12,7 +12,7 @@ import { SettingsChangeEventName } from "src/assets/constants";
type Props = {
useFileTreeStore: UseBoundStore<StoreApi<FileTreeStore>>;
plugin: AppleStyleNotesPlugin;
plugin: FolderFileSplitterPlugin;
folder: TFolder;
isRoot?: boolean;
};
@ -222,16 +222,16 @@ const Folder = ({
const isFocused = folder.path == focusedFolder?.path;
const isExpanded = isRoot || expandedFolderPaths.includes(folder.path);
const folderClassNames = ["asn-folder"];
const folderClassNames = ["ffs-folder"];
if (isFocused) {
folderClassNames.push("asn-focused-folder");
folderClassNames.push("ffs-focused-folder");
}
if (isRoot) {
folderClassNames.push("asn-root-folder");
folderClassNames.push("ffs-root-folder");
}
const folderNameClassName =
"asn-folder-name" + (isEditing ? " asn-folder-name-edit-mode" : "");
"ffs-folder-name" + (isEditing ? " ffs-folder-name-edit-mode" : "");
return (
<div
className={folderClassNames.join(" ")}
@ -239,7 +239,7 @@ const Folder = ({
onContextMenu={onShowContextMenu}
>
<div
className="asn-folder-pane-left-sectionn"
className="ffs-folder-pane-left-sectionn"
onClick={(e) => {
if (expandFolderByClickingOn == "folder") {
e.stopPropagation();
@ -252,7 +252,7 @@ const Folder = ({
}}
>
<span
className="asn-folder-arrow-icon-wrapper"
className="ffs-folder-arrow-icon-wrapper"
onClick={(e) => {
if (expandFolderByClickingOn == "icon") {
e.stopPropagation();
@ -275,7 +275,7 @@ const Folder = ({
{name}
</div>
</div>
<span className="asn-files-count">{filesCount}</span>
<span className="ffs-files-count">{filesCount}</span>
</div>
);
};

2
src/components/FolderActions/CreateFolder.tsx
View file

@ -23,7 +23,7 @@ const CreateFolder = ({ useFileTreeStore }: Props) => {
};
return (
<div className="asn-actions-icon-wrapper" onClick={onCreateFolder}>
<div className="ffs-actions-icon-wrapper" onClick={onCreateFolder}>
<AddFolderIcon />
</div>
);

6
src/components/FolderActions/SortFolders.tsx
View file

@ -5,7 +5,7 @@ import { useShallow } from "zustand/react/shallow";
import { AscendingSortIcon, DescendingSortIcon } from "src/assets/icons";
import { FileTreeStore, FolderSortRule } from "src/store";
import AppleStyleNotesPlugin from "src/main";
import FolderFileSplitterPlugin from "src/main";
type FolderSortRuleItem = {
text: string;
@ -29,7 +29,7 @@ const FolderSortByFilesCountRules: FolderSortRuleGroup = [
type Props = {
useFileTreeStore: UseBoundStore<StoreApi<FileTreeStore>>;
plugin: AppleStyleNotesPlugin;
plugin: FolderFileSplitterPlugin;
};
const SortFolders = ({ useFileTreeStore, plugin }: Props) => {
const {
@ -80,7 +80,7 @@ const SortFolders = ({ useFileTreeStore, plugin }: Props) => {
<DescendingSortIcon />
);
return (
<div className="asn-actions-icon-wrapper" onClick={onChangeSortRule}>
<div className="ffs-actions-icon-wrapper" onClick={onChangeSortRule}>
{icon}
</div>
);

2
src/components/FolderActions/ToggleFolders.tsx
View file

@ -28,7 +28,7 @@ const ToggleFolders = ({ useFileTreeStore }: Props) => {
};
return (
<div className="asn-actions-icon-wrapper" onClick={onToggleAllFolders}>
<div className="ffs-actions-icon-wrapper" onClick={onToggleAllFolders}>
{isExpanded ? <CollapseIcon /> : <ExpandIcon />}
</div>
);

4
src/components/FolderListModal.tsx
View file

@ -1,12 +1,12 @@
import { SuggestModal, TAbstractFile, TFolder } from "obsidian";
import AppleStyleNotesPlugin from "src/main";
import FolderFileSplitterPlugin from "src/main";
export class FolderListModal extends SuggestModal<TFolder> {
folders: TFolder[];
item: TAbstractFile;
constructor(
plugin: AppleStyleNotesPlugin,
plugin: FolderFileSplitterPlugin,
folders: TFolder[],
item: TAbstractFile
) {

12
src/components/Folders.tsx
View file

@ -3,7 +3,7 @@ import { useShallow } from "zustand/react/shallow";
import { StoreApi, UseBoundStore } from "zustand";
import { TFolder } from "obsidian";
import AppleStyleNotesPlugin from "src/main";
import FolderFileSplitterPlugin from "src/main";
import { FileTreeStore } from "src/store";
import Folder from "./Folder";
import {
@ -15,7 +15,7 @@ import { isFolder } from "src/utils";
type Props = {
useFileTreeStore: UseBoundStore<StoreApi<FileTreeStore>>;
plugin: AppleStyleNotesPlugin;
plugin: FolderFileSplitterPlugin;
};
const Folders = ({ useFileTreeStore, plugin }: Props) => {
const {
@ -128,9 +128,9 @@ const Folders = ({ useFileTreeStore, plugin }: Props) => {
/>
{expandedFolderPaths.includes(folder.path) &&
hasFolderChildren(folder) && (
<div className="asn-sub-folders-section asn-folder-wrapper">
<div className="ffs-sub-folders-section ffs-folder-wrapper">
{showHierarchyLines && (
<div className="asn-hierarchy-line"></div>
<div className="ffs-hierarchy-line"></div>
)}
{renderFolders(getFoldersByParent(folder))}
</div>
@ -143,9 +143,9 @@ const Folders = ({ useFileTreeStore, plugin }: Props) => {
if (!rootFolder) return null;
return (
<div className="asn-folder-wrapper">
<div className="ffs-folder-wrapper">
{showHierarchyLines && (
<div className="asn-hierarchy-line"></div>
<div className="ffs-hierarchy-line"></div>
)}
<Folder
folder={rootFolder}

16
src/main.ts
View file

@ -2,7 +2,7 @@ import { Plugin, TAbstractFile } from "obsidian";
import { FileTreeView } from "./FileTreeView";
import { SettingTab } from "./SettingTab";
import { AppleStyleNotesPluginSettings } from "./settings";
import { FolderFileSplitterPluginSettings } from "./settings";
import {
SettingsChangeEventName,
VaultChangeEventName,
@ -10,15 +10,15 @@ import {
} from "./assets/constants";
import { getSettingsFromLocalStorage } from "./utils";
export default class AppleStyleNotesPlugin extends Plugin {
settings: AppleStyleNotesPluginSettings;
export default class FolderFileSplitterPlugin extends Plugin {
settings: FolderFileSplitterPluginSettings;
VIEW_TYPE = "asn-plugin-file-tree-view";
VIEW_DISPLAY_TEXT = "Apple Style Notes Plugin File Tree";
VIEW_TYPE = "ffs-plugin-file-tree-view";
VIEW_DISPLAY_TEXT = "FolderFile Splitter Plugin File Tree";
ICON = "dock";
async onload() {
console.log("Apple Styled Notes Plugin onload");
console.log("FolderFile Splitter Plugin onload");
this.addSettingTab(new SettingTab(this.app, this));
@ -75,10 +75,10 @@ export default class AppleStyleNotesPlugin extends Plugin {
};
triggerSettingsChangeEvent = <
K extends keyof AppleStyleNotesPluginSettings
K extends keyof FolderFileSplitterPluginSettings
>(
changeKey: K,
changeValue: AppleStyleNotesPluginSettings[K]
changeValue: FolderFileSplitterPluginSettings[K]
) => {
const event = new CustomEvent(SettingsChangeEventName, {
detail: {

4
src/settings.ts
View file

@ -1,13 +1,13 @@
export type expandFolderByClickingOnElement = "icon" | "folder";
export interface AppleStyleNotesPluginSettings {
export interface FolderFileSplitterPluginSettings {
expandFolderByClickingOn: expandFolderByClickingOnElement;
includeSubfolderFilesCount: boolean;
showFolderHierarchyLines: boolean;
showFolderIcon: boolean;
}
export const DEFAULT_SETTINGS: AppleStyleNotesPluginSettings = {
export const DEFAULT_SETTINGS: FolderFileSplitterPluginSettings = {
expandFolderByClickingOn: "icon",
includeSubfolderFilesCount: false,
showFolderHierarchyLines: false,

34
src/store.ts
View file

@ -1,14 +1,14 @@
import { create } from "zustand";
import { TFile, TFolder } from "obsidian";
import AppleStyleNotesPlugin from "./main";
import FolderFileSplitterPlugin from "./main";
import { isFile, isFolder } from "./utils";
import {
ASN_EXPANDED_FOLDER_PATHS_KEY,
ASN_FILE_SORT_RULE_KEY,
ASN_FOCUSED_FILE_PATH_KEY,
ASN_FOCUSED_FOLDER_PATH_KEY,
ASN_FOLDER_SORT_RULE_KEY,
FFS_EXPANDED_FOLDER_PATHS_KEY,
FFS_FILE_SORT_RULE_KEY,
FFS_FOCUSED_FILE_PATH_KEY,
FFS_FOCUSED_FOLDER_PATH_KEY,
FFS_FOLDER_SORT_RULE_KEY,
} from "./assets/constants";
export type FolderSortRule =
@ -76,7 +76,7 @@ export type FileTreeStore = {
sortFiles: (files: TFile[], rule: FileSortRule) => TFile[];
};
export const createFileTreeStore = (plugin: AppleStyleNotesPlugin) =>
export const createFileTreeStore = (plugin: FolderFileSplitterPlugin) =>
create((set, get: () => FileTreeStore) => ({
folders: plugin.app.vault.getAllFolders() || [],
rootFolder: plugin.app.vault.getRoot() || null,
@ -132,7 +132,7 @@ export const createFileTreeStore = (plugin: AppleStyleNotesPlugin) =>
}),
setFocusedFolderAndSaveInLocalStorage: (folder: TFolder) => {
get().setFocusedFolder(folder);
localStorage.setItem(ASN_FOCUSED_FOLDER_PATH_KEY, folder.path);
localStorage.setItem(FFS_FOCUSED_FOLDER_PATH_KEY, folder.path);
},
_createFolder: async (path: string): Promise<TFolder> => {
const newFolder = await plugin.app.vault.createFolder(path);
@ -213,11 +213,11 @@ export const createFileTreeStore = (plugin: AppleStyleNotesPlugin) =>
set({
folderSortRule: rule,
});
localStorage.setItem(ASN_FOLDER_SORT_RULE_KEY, rule);
localStorage.setItem(FFS_FOLDER_SORT_RULE_KEY, rule);
},
restoreFolderSortRule: () => {
const lastFolderSortRule = localStorage.getItem(
ASN_FOLDER_SORT_RULE_KEY
FFS_FOLDER_SORT_RULE_KEY
);
if (lastFolderSortRule) {
set({
@ -230,13 +230,13 @@ export const createFileTreeStore = (plugin: AppleStyleNotesPlugin) =>
expandedFolderPaths: folderPaths,
});
localStorage.setItem(
ASN_EXPANDED_FOLDER_PATHS_KEY,
FFS_EXPANDED_FOLDER_PATHS_KEY,
JSON.stringify(folderPaths)
);
},
restoreExpandedFolderPaths: () => {
const lastExpandedFolderPaths = localStorage.getItem(
ASN_EXPANDED_FOLDER_PATHS_KEY
FFS_EXPANDED_FOLDER_PATHS_KEY
);
if (lastExpandedFolderPaths) {
try {
@ -251,7 +251,7 @@ export const createFileTreeStore = (plugin: AppleStyleNotesPlugin) =>
},
restoreLastFocusedFolder: () => {
const lastFocusedFolderPath = localStorage.getItem(
ASN_FOCUSED_FOLDER_PATH_KEY
FFS_FOCUSED_FOLDER_PATH_KEY
);
const { rootFolder, setFocusedFolder, findFolderByPath } = get();
if (lastFocusedFolderPath && lastFocusedFolderPath !== "/") {
@ -288,7 +288,7 @@ export const createFileTreeStore = (plugin: AppleStyleNotesPlugin) =>
const { setFocusedFile, openFile } = get();
setFocusedFile(file);
openFile(file);
localStorage.setItem(ASN_FOCUSED_FILE_PATH_KEY, file.path);
localStorage.setItem(FFS_FOCUSED_FILE_PATH_KEY, file.path);
},
readFile: async (file: TFile): Promise<string> => {
return await plugin.app.vault.read(file);
@ -343,7 +343,7 @@ export const createFileTreeStore = (plugin: AppleStyleNotesPlugin) =>
},
restoreLastFocusedFile: () => {
const lastFocusedFilePath = localStorage.getItem(
ASN_FOCUSED_FILE_PATH_KEY
FFS_FOCUSED_FILE_PATH_KEY
);
const { findFileByPath, selectFile } = get();
if (lastFocusedFilePath) {
@ -375,11 +375,11 @@ export const createFileTreeStore = (plugin: AppleStyleNotesPlugin) =>
set({
fileSortRule: rule,
});
localStorage.setItem(ASN_FILE_SORT_RULE_KEY, rule);
localStorage.setItem(FFS_FILE_SORT_RULE_KEY, rule);
},
restoreFileSortRule: () => {
const lastFileSortRule = localStorage.getItem(
ASN_FILE_SORT_RULE_KEY
FFS_FILE_SORT_RULE_KEY
);
if (lastFileSortRule) {
set({

10
src/utils.ts
View file

@ -1,6 +1,6 @@
import { TAbstractFile, TFile, TFolder } from "obsidian";
import { AppleStyleNotesPluginSettings, DEFAULT_SETTINGS } from "./settings";
import { ASN_PLUGIN_SETTINGS } from "./assets/constants";
import { FolderFileSplitterPluginSettings, DEFAULT_SETTINGS } from "./settings";
import { FFS_PLUGIN_SETTINGS } from "./assets/constants";
type FolderChild = TFile | TFolder | TAbstractFile;
export const isFile = (item: FolderChild): item is TFile => {
@ -30,10 +30,10 @@ export const selectText = (element: HTMLElement) => {
};
export const saveSettingsToLocalStorage = (
settings: AppleStyleNotesPluginSettings
settings: FolderFileSplitterPluginSettings
) => {
try {
localStorage.setItem(ASN_PLUGIN_SETTINGS, JSON.stringify(settings));
localStorage.setItem(FFS_PLUGIN_SETTINGS, JSON.stringify(settings));
} catch (e) {
console.error(e);
}
@ -42,7 +42,7 @@ export const saveSettingsToLocalStorage = (
export const getSettingsFromLocalStorage = () => {
let settings = DEFAULT_SETTINGS;
try {
const settingsText = localStorage.getItem(ASN_PLUGIN_SETTINGS);
const settingsText = localStorage.getItem(FFS_PLUGIN_SETTINGS);
if (settingsText) {
settings = JSON.parse(settingsText);
}

190
styles.css
View file

@ -9,74 +9,74 @@ If your plugin does not need CSS, delete this file.
.theme-light,
.theme-dark {
--asn-folder-pane-min-width: 140px;
--asn-files-pane-min-width: 200px;
--asn-folder-border-radius: 4px;
--ffs-folder-pane-min-width: 140px;
--ffs-files-pane-min-width: 200px;
--ffs-folder-border-radius: 4px;
}
.theme-light {
--asn-pane-divider-color: #d3d4d6;
--asn-folder-hover-background-color: #e5e5e5;
--asn-files-count-color: #a6a6a7;
--asn-folder-toggle-icon-color: #585a5d;
--asn-folder-focused-color: #fdf8eb;
--asn-focused-folder-background-color: #ecc44c;
--asn-actions-background-color: #e5e5e5;
--asn-actions-icon-color: #898989;
--asn-file-content-preview-color: #999999;
--asn-file-created-time-color: #515151;
--asn-editing-mode-color: #000000;
--asn-editing-background-color: #ffffff;
--asn-folder-hierarchy-line-color: #e1dede;
--ffs-pane-divider-color: #d3d4d6;
--ffs-folder-hover-background-color: #e5e5e5;
--ffs-files-count-color: #a6a6a7;
--ffs-folder-toggle-icon-color: #585a5d;
--ffs-folder-focused-color: #fdf8eb;
--ffs-focused-folder-background-color: #ecc44c;
--ffs-actions-background-color: #e5e5e5;
--ffs-actions-icon-color: #898989;
--ffs-file-content-preview-color: #999999;
--ffs-file-created-time-color: #515151;
--ffs-editing-mode-color: #000000;
--ffs-editing-background-color: #ffffff;
--ffs-folder-hierarchy-line-color: #e1dede;
}
.theme-dark {
--asn-pane-divider-color: #000000;
--asn-folder-hover-background-color: #2e2d2c;
--asn-files-count-color: #89898a;
--asn-folder-toggle-icon-color: #bfc2c2;
--asn-folder-focused-color: #ffffff;
--asn-focused-folder-background-color: #debe5b;
--asn-actions-background-color: #2e2d2c;
--asn-actions-icon-color: #a59982;
--asn-file-content-preview-color: #9b9d9f;
--asn-file-created-time-color: #dddede;
--asn-editing-mode-color: #ffffff;
--asn-editing-background-color: #000000;
--asn-folder-hierarchy-line-color: #474341;
--ffs-pane-divider-color: #000000;
--ffs-folder-hover-background-color: #2e2d2c;
--ffs-files-count-color: #89898a;
--ffs-folder-toggle-icon-color: #bfc2c2;
--ffs-folder-focused-color: #ffffff;
--ffs-focused-folder-background-color: #debe5b;
--ffs-actions-background-color: #2e2d2c;
--ffs-actions-icon-color: #a59982;
--ffs-file-content-preview-color: #9b9d9f;
--ffs-file-created-time-color: #dddede;
--ffs-editing-mode-color: #ffffff;
--ffs-editing-background-color: #000000;
--ffs-folder-hierarchy-line-color: #474341;
}
.asn-plugin-view {
.ffs-plugin-view {
height: 100%;
min-width: calc(
var(--asn-folder-pane-min-width) + var(--asn-files-pane-min-width)
var(--ffs-folder-pane-min-width) + var(--ffs-files-pane-min-width)
);
}
.asn-plugin-container {
.ffs-plugin-container {
display: flex;
height: 100%;
overflow-y: hidden;
}
.asn-folder-pane {
min-width: var(--asn-folder-pane-min-width);
.ffs-folder-pane {
min-width: var(--ffs-folder-pane-min-width);
margin-right: 8px;
overflow-y: auto;
}
.asn-files-pane {
min-width: var(--asn-files-pane-min-width);
.ffs-files-pane {
min-width: var(--ffs-files-pane-min-width);
flex: 1;
overflow-y: auto;
}
.asn-pane-divider {
border: 1px solid var(--asn-pane-divider-color);
.ffs-pane-divider {
border: 1px solid var(--ffs-pane-divider-color);
cursor: ew-resize;
}
.asn-folder {
.ffs-folder {
height: 30px;
font-size: 13px;
@ -87,24 +87,24 @@ If your plugin does not need CSS, delete this file.
padding-right: 6px;
}
.asn-folder:hover {
background-color: var(--asn-folder-hover-background-color);
border-radius: var(--asn-folder-border-radius);
.ffs-folder:hover {
background-color: var(--ffs-folder-hover-background-color);
border-radius: var(--ffs-folder-border-radius);
}
.asn-root-folder {
.ffs-root-folder {
font-size: 14px;
font-weight: 450;
}
.asn-folder-pane-left-sectionn {
.ffs-folder-pane-left-sectionn {
display: flex;
align-items: center;
flex: 1;
overflow: hidden;
}
.asn-folder-arrow-icon-wrapper {
.ffs-folder-arrow-icon-wrapper {
width: 14px;
display: flex;
align-items: center;
@ -112,82 +112,82 @@ If your plugin does not need CSS, delete this file.
padding: 2px;
}
.asn-folder-icon {
.ffs-folder-icon {
width: 14px;
height: 12px;
fill: #d19600;
margin-right: 8px;
}
.asn-root-folder .asn-folder-icon {
.ffs-root-folder .ffs-folder-icon {
width: 16px;
height: 14px;
}
.asn-root-folder .asn-folder-arrow-icon-wrapper {
.ffs-root-folder .ffs-folder-arrow-icon-wrapper {
width: 4px;
}
.asn-root-folder .asn-root-folder-icon {
.ffs-root-folder .ffs-root-folder-icon {
width: 16px;
height: 14px;
}
.asn-arrow-down-icon,
.asn-arrow-right-icon {
.ffs-arrow-down-icon,
.ffs-arrow-right-icon {
width: 8px;
height: 8px;
fill: #5a5d63;
}
.asn-files-count {
color: var(--asn-files-count-color);
.ffs-files-count {
color: var(--ffs-files-count-color);
font-size: 12px;
margin-left: 4px;
}
.asn-folder-pane .asn-focused-folder {
background-color: var(--asn-focused-folder-background-color);
border-radius: var(--asn-folder-border-radius);
.ffs-folder-pane .ffs-focused-folder {
background-color: var(--ffs-focused-folder-background-color);
border-radius: var(--ffs-folder-border-radius);
}
.asn-folder-pane .asn-folder-name-edit-mode {
background-color: var(--asn-editing-background-color) !important;
color: var(--asn-editing-mode-color) !important;
.ffs-folder-pane .ffs-folder-name-edit-mode {
background-color: var(--ffs-editing-background-color) !important;
color: var(--ffs-editing-mode-color) !important;
}
.asn-files-pane .asn-file-name-edit-mode {
background-color: var(--asn-editing-background-color) !important;
color: var(--asn-editing-mode-color) !important;
.ffs-files-pane .ffs-file-name-edit-mode {
background-color: var(--ffs-editing-background-color) !important;
color: var(--ffs-editing-mode-color) !important;
}
.asn-focused-folder,
.asn-focused-folder .asn-files-count {
color: var(--asn-folder-focused-color);
.ffs-focused-folder,
.ffs-focused-folder .ffs-files-count {
color: var(--ffs-folder-focused-color);
font-weight: 450;
}
.asn-focused-folder .asn-arrow-down-icon,
.asn-focused-folder .asn-folder-icon {
fill: var(--asn-folder-focused-color);
.ffs-focused-folder .ffs-arrow-down-icon,
.ffs-focused-folder .ffs-folder-icon {
fill: var(--ffs-folder-focused-color);
}
.asn-folder-name {
.ffs-folder-name {
flex: 1;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.asn-folder-wrapper {
.ffs-folder-wrapper {
position: relative;
}
.asn-sub-folders-section {
.ffs-sub-folders-section {
margin-left: 14px;
}
.asn-none-files-tips {
.ffs-none-files-tips {
width: 100%;
height: 100%;
display: flex;
@ -195,41 +195,41 @@ If your plugin does not need CSS, delete this file.
align-items: center;
}
.asn-hierarchy-line {
.ffs-hierarchy-line {
width: 1px;
border-left: 1px solid var(--asn-folder-hierarchy-line-color);
border-left: 1px solid var(--ffs-folder-hierarchy-line-color);
position: absolute;
left: -2px;
top: 0;
bottom: 0px;
}
.asn-none-files-tips .asn-empty-folder-icon {
.ffs-none-files-tips .ffs-empty-folder-icon {
width: 60px;
height: 60px;
fill: #bdbdbd;
}
.asn-file {
.ffs-file {
height: 56px;
font-size: 12px;
margin-left: 12px;
display: flex;
flex-direction: column;
justify-content: center;
border-radius: var(--asn-folder-border-radius);
border-radius: var(--ffs-folder-border-radius);
padding: 0 12px;
}
.asn-file:not(:last-child) {
.ffs-file:not(:last-child) {
border-bottom: 1px solid #e6e6e6;
}
.asn-file:hover {
.ffs-file:hover {
background-color: #dcdcdc;
}
.asn-file .asn-file-name {
.ffs-file .ffs-file-name {
font-size: 13px;
font-weight: 600;
overflow: hidden;
@ -237,54 +237,54 @@ If your plugin does not need CSS, delete this file.
white-space: nowrap;
}
.asn-file .asn-file-created-time {
.ffs-file .ffs-file-created-time {
letter-spacing: -0.5px;
width: 60px;
color: var(--asn-file-created-time-color);
color: var(--ffs-file-created-time-color);
font-weight: 480;
}
.asn-file-details {
.ffs-file-details {
display: flex;
margin-top: 4px;
}
.asn-files-pane .asn-focused-file {
background-color: var(--asn-focused-folder-background-color);
.ffs-files-pane .ffs-focused-file {
background-color: var(--ffs-focused-folder-background-color);
}
.asn-file-content-preview {
.ffs-file-content-preview {
flex: 1;
margin-left: 12px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 12px;
color: var(--asn-file-content-preview-color);
color: var(--ffs-file-content-preview-color);
}
.asn-actions {
.ffs-actions {
margin: 0px auto 4px;
padding: 8px 16px 4px;
border-radius: var(--asn-folder-border-radius);
background-color: var(--asn-actions-background-color);
border-radius: var(--ffs-folder-border-radius);
background-color: var(--ffs-actions-background-color);
display: flex;
}
.asn-file-actions {
.ffs-file-actions {
margin-left: 12px;
}
.asn-folder-actions-icon {
.ffs-folder-actions-icon {
width: 18px;
height: 18px;
stroke: var(--asn-actions-icon-color);
stroke: var(--ffs-actions-icon-color);
}
.asn-folder-actions-icon:hover {
.ffs-folder-actions-icon:hover {
transform: scale(1.1);
}
.asn-actions-icon-wrapper:not(:last-child) {
.ffs-actions-icon-wrapper:not(:last-child) {
margin-right: 12px;
}