mirror of
https://github.com/SillyTavern/SillyTavern.git
synced 2025-06-05 21:59:27 +02:00
Added sort by date Added
This commit is contained in:
@ -2273,6 +2273,8 @@
|
|||||||
<option value="search" data-i18n="Search" hidden>A-Z</option>
|
<option value="search" data-i18n="Search" hidden>A-Z</option>
|
||||||
<option value="asc">A-Z</option>
|
<option value="asc">A-Z</option>
|
||||||
<option value="desc">Z-A</option>
|
<option value="desc">Z-A</option>
|
||||||
|
<option value="date_asc">Date Asc</option>
|
||||||
|
<option value="date_desc">Date Desc</option>
|
||||||
</select>
|
</select>
|
||||||
<select id="category_selection">
|
<select id="category_selection">
|
||||||
<option value="" disabled selected data-i18n="category">category</option>
|
<option value="" disabled selected data-i18n="category">category</option>
|
||||||
|
@ -293,7 +293,7 @@ export async function loadFeatherlessModels(data) {
|
|||||||
populateClassSelection(data);
|
populateClassSelection(data);
|
||||||
|
|
||||||
// Retrieve the stored number of items per page or default to 5
|
// Retrieve the stored number of items per page or default to 5
|
||||||
const perPage = Number(localStorage.getItem(storageKey)) || 5;
|
const perPage = Number(localStorage.getItem(storageKey)) || 6;
|
||||||
|
|
||||||
// Initialize pagination with the full set of models
|
// Initialize pagination with the full set of models
|
||||||
setupPagination(originalModels, perPage);
|
setupPagination(originalModels, perPage);
|
||||||
@ -303,7 +303,7 @@ export async function loadFeatherlessModels(data) {
|
|||||||
paginationContainer.pagination({
|
paginationContainer.pagination({
|
||||||
dataSource: models,
|
dataSource: models,
|
||||||
pageSize: perPage,
|
pageSize: perPage,
|
||||||
sizeChangerOptions: [5, 10, 25, 50, 100, 250, 500, 1000],
|
sizeChangerOptions: [6, 10, 26, 50, 100, 250, 500, 1000],
|
||||||
pageRange: 1,
|
pageRange: 1,
|
||||||
pageNumber: 1,
|
pageNumber: 1,
|
||||||
showPageNumbers: true,
|
showPageNumbers: true,
|
||||||
@ -450,6 +450,10 @@ export async function loadFeatherlessModels(data) {
|
|||||||
filteredModels.sort((a, b) => a.id.localeCompare(b.id));
|
filteredModels.sort((a, b) => a.id.localeCompare(b.id));
|
||||||
} else if (selectedSortOrder === 'desc') {
|
} else if (selectedSortOrder === 'desc') {
|
||||||
filteredModels.sort((a, b) => b.id.localeCompare(a.id));
|
filteredModels.sort((a, b) => b.id.localeCompare(a.id));
|
||||||
|
} else if (selectedSortOrder === 'date_asc') {
|
||||||
|
filteredModels.sort((a, b) => a.updated_at.localeCompare(b.updated_at));
|
||||||
|
} else if (selectedSortOrder === 'date_desc') {
|
||||||
|
filteredModels.sort((a, b) => b.updated_at.localeCompare(a.updated_at));
|
||||||
}
|
}
|
||||||
|
|
||||||
// Reinitialize pagination with the filtered and sorted models
|
// Reinitialize pagination with the filtered and sorted models
|
||||||
|
@ -5495,22 +5495,22 @@ body:not(.movingUI) .drawer-content.maximized {
|
|||||||
border-radius: 8px; /* Rounded corners for the card */
|
border-radius: 8px; /* Rounded corners for the card */
|
||||||
background-color: #222; /* Card background color */
|
background-color: #222; /* Card background color */
|
||||||
color: #fff; /* Text color */
|
color: #fff; /* Text color */
|
||||||
margin: 10px; /* Space between cards */
|
margin: 7px; /* Space between cards */
|
||||||
width: calc(100% - 20px); /* Full width minus margin */
|
width: calc(100% - 7px); /* Full width minus margin */
|
||||||
box-sizing: border-box; /* Include padding and border in the width */
|
box-sizing: border-box; /* Include padding and border in the width */
|
||||||
transition: transform 0.2s ease-in-out, background-color 0.2s ease-in-out, border 0.2s ease-in-out;
|
transition: transform 0.2s ease-in-out, background-color 0.2s ease-in-out, border 0.2s ease-in-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
.model-card:hover {
|
.model-card:hover {
|
||||||
transform: scale(1.025); /* Grow the card slightly on hover */
|
transform: scale(1.02); /* Grow the card slightly on hover */
|
||||||
background-color: #444; /* Highlight background on hover */
|
background-color: #444; /* Highlight background on hover */
|
||||||
transition: transform 0.2s ease-in-out, background-color 0.2s ease-in-out; /* Smooth transition */
|
transition: transform 0.2s ease-in-out, background-color 0.2s ease-in-out; /* Smooth transition */
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Highlight the selected model card */
|
/* Highlight the selected model card */
|
||||||
.model-card.selected {
|
.model-card.selected {
|
||||||
border: 2px solid #00f; /* Add a blue border to indicate selection */
|
border: 2px solid var(--okGreen70a); /* Add a blue border to indicate selection */
|
||||||
background-color: #333; /* Slightly darker background for selected state */
|
background-color: var(--okGreen70a); /* Slightly darker background for selected state */
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Model title information */
|
/* Model title information */
|
||||||
@ -5550,7 +5550,7 @@ body:not(.movingUI) .drawer-content.maximized {
|
|||||||
grid-template-columns: repeat(2, 1fr);
|
grid-template-columns: repeat(2, 1fr);
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap; /* Cards wrap onto new lines when necessary */
|
flex-wrap: wrap; /* Cards wrap onto new lines when necessary */
|
||||||
gap: 15px; /* Space between grid items */
|
gap: 5px; /* Space between grid items */
|
||||||
justify-content: flex-start; /* Align cards to the left */
|
justify-content: flex-start; /* Align cards to the left */
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -5558,7 +5558,7 @@ body:not(.movingUI) .drawer-content.maximized {
|
|||||||
#model_card_block.grid-view .model-card {
|
#model_card_block.grid-view .model-card {
|
||||||
flex-direction: column; /* Stack title, class, and context length vertically for grid */
|
flex-direction: column; /* Stack title, class, and context length vertically for grid */
|
||||||
flex: 1 1 calc(50% - 30px); /* 3 cards per row with spacing */
|
flex: 1 1 calc(50% - 30px); /* 3 cards per row with spacing */
|
||||||
margin-bottom: 10px;
|
/* margin-bottom: 10px; */
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Ensure the search bar takes most of the width */
|
/* Ensure the search bar takes most of the width */
|
||||||
|
Reference in New Issue
Block a user