VDMDI/CT
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

prepare fileBrowser layout on mobile

Browse Source
This commit is contained in:
marlon-erler
2024-07-21 18:56:56 +02:00
parent 6507b64922
commit 593c85a8b9
6 changed files with 123 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dist/index.css
Vendored
+21 -4
View File
@@ -499,14 +499,28 @@ body[showing-chat] #chat-page-wrapper {
scroll-snap-type: x mandatory;
}
.file-browser > div {
display: flex;
flex-direction: column;
width: 100%;
min-width: 100%;
flex: 0;
display: flex;
flex-direction: column;
padding: var(--content-padding);
scroll-snap-align: center;
overflow: auto;
}
.file-browser .scroll-area {
flex: 1;
width: 100%;
height: 100%;
overflow-y: auto;
padding: var(--content-padding);
}
.file-browser .detail-button-wrapper {
display: flex;
justify-content: end;
border-top: 1px solid var(--border);
padding: var(--content-padding);
}
.file-browser .detail-button-wrapper button {
max-width: 100%;
}
.file-browser code {
width: 100%;
@@ -518,4 +532,7 @@ body[showing-chat] #chat-page-wrapper {
min-width: 50%;
flex: 1;
}
.file-browser .detail-button-wrapper {
display: none;
}
}
dist/index.js
Vendored
+27 -2
View File
@@ -379,6 +379,13 @@
printTree = () => {
return stringify(this.storageEntryTree);
};
static getFileName = (pathComponents) => {
return pathComponents[pathComponents.length - 1] || "\\";
};
static getFileNameFromString = (pathString) => {
const pathComponents = this.stringToPathComponents(pathString);
return pathComponents[pathComponents.length - 1] || "\\";
};
static pathComponentsToString = (...pathComponents) => {
return pathComponents.join(PATH_COMPONENT_SEPARATOR);
};
@@ -2081,7 +2088,7 @@
function DirectoryItemList(storageModel2, pathString, selectedPath) {
const StringToDirectoryItemList = (pathString2) => DirectoryItemList(storageModel2, pathString2, selectedPath);
const path = StorageModel.stringToPathComponents(pathString);
const fileName = path[path.length - 1] || "\\";
const fileName = StorageModel.getFileName(path);
const items = new ListState();
const style = `text-indent: ${path.length * 2}rem`;
function loadItems() {
@@ -2128,7 +2135,25 @@
const content = storageModel2.restore(path);
return content || "";
});
return /* @__PURE__ */ createElement("div", { class: "file-browser" }, DirectoryItemList(storageModel2, "\\", selectedPath), /* @__PURE__ */ createElement("div", null, /* @__PURE__ */ createElement("code", { "subscribe:innerText": fileContent })));
const selectedFileName = createProxyState(
[selectedPath],
() => StorageModel.getFileNameFromString(selectedPath.value) ?? PATH_COMPONENT_SEPARATOR
);
const view = /* @__PURE__ */ createElement("div", { class: "file-browser" }, /* @__PURE__ */ createElement("div", null, /* @__PURE__ */ createElement("div", { class: "scroll-area" }, DirectoryItemList(
storageModel2,
PATH_COMPONENT_SEPARATOR,
selectedPath
)), /* @__PURE__ */ createElement("div", { class: "detail-button-wrapper" }, /* @__PURE__ */ createElement("button", { class: "ghost", "on:click": scrollToDetails }, /* @__PURE__ */ createElement(
"span",
{
class: "ellipsis",
"subscribe:innerText": selectedFileName
}
), /* @__PURE__ */ createElement("span", { class: "icon" }, "arrow_forward")))), /* @__PURE__ */ createElement("div", { class: "scroll-area" }, /* @__PURE__ */ createElement("code", { "subscribe:innerText": fileContent })));
function scrollToDetails() {
view.scrollLeft = view.scrollWidth;
}
return view;
}
// src/View/Modals/storageModal.tsx