|
diff --git a/web_src/css/index.css b/web_src/css/index.css
index 174a4a9cbc..158ae42d3e 100644
--- a/web_src/css/index.css
+++ b/web_src/css/index.css
@@ -65,6 +65,7 @@
@import "./repo/linebutton.css";
@import "./repo/wiki.css";
@import "./repo/header.css";
+@import "./repo/home.css";
@import "./repo/reactions.css";
@import "./editor/fileeditor.css";
diff --git a/web_src/css/repo.css b/web_src/css/repo.css
index b40859975c..3eebc0c477 100644
--- a/web_src/css/repo.css
+++ b/web_src/css/repo.css
@@ -422,14 +422,6 @@ td .commit-summary {
border-radius: 0 0 var(--border-radius) var(--border-radius);
}
-.repository.file.list .sidebar {
- padding-left: 0;
-}
-
-.repository.file.list .sidebar .svg {
- width: 16px;
-}
-
.repo-editor-header {
width: 100%;
}
@@ -1822,16 +1814,6 @@ td .commit-summary {
background: var(--color-secondary);
}
-.repository .repository-summary .segment.language-stats {
- display: flex;
- gap: 2px;
- padding: 0;
- height: 10px;
- white-space: nowrap;
- border-radius: 0 0 3px 3px !important;
- overflow: hidden;
-}
-
#cite-repo-modal #citation-panel {
display: flex;
width: 100%;
@@ -2172,11 +2154,7 @@ td .commit-summary {
justify-content: flex-end;
}
-.repo-button-row[data-is-homepage="false"] .repo-button-row-right {
- flex-grow: 0;
-}
-
-@media (max-width: 991px) {
+@media (max-width: 1200px) {
.repository:not(.wiki) .repo-button-row {
flex-direction: column;
align-items: stretch;
@@ -2302,6 +2280,7 @@ tbody.commit-list {
font-weight: var(--font-weight-normal);
cursor: pointer;
margin: 0;
+ display: inline-block !important;
}
#new-dependency-drop-list.ui.selection.dropdown {
@@ -2820,9 +2799,9 @@ tbody.commit-list {
/* FIXME: These media selectors are not ideal (just keep them from old code).
There are many different pages, some need the max-width while some others don't,
they should be tested and improved in the future. */
-@media (min-width: 768px) and (max-width: 991.98px) {
+@media (min-width: 768px) and (max-width: 1235px) {
.branch-selector-dropdown .branch-dropdown-button {
- max-width: 185px;
+ max-width: 301px;
}
}
diff --git a/web_src/css/repo/home.css b/web_src/css/repo/home.css
new file mode 100644
index 0000000000..fd8fac27e2
--- /dev/null
+++ b/web_src/css/repo/home.css
@@ -0,0 +1,77 @@
+.repo-grid-filelist-sidebar {
+ display: grid;
+ grid-template-columns: auto 300px;
+ grid-template-rows: auto auto 1fr;
+}
+
+.repo-grid-filelist-sidebar .repo-home-filelist {
+ min-width: 0;
+ grid-column: 1;
+ grid-row: 1 / 4;
+}
+
+.repo-grid-filelist-sidebar .repo-home-sidebar-top {
+ grid-column: 2;
+ grid-row: 1;
+ padding-left: 1em;
+}
+.repo-grid-filelist-sidebar .repo-home-sidebar-bottom {
+ grid-column: 2;
+ grid-row: 2;
+ padding-left: 1em;
+}
+.repo-home-sidebar-bottom > :first-child {
+ border-top: 1px solid var(--color-secondary); /* same to .flex-list > .flex-item + .flex-item */
+}
+
+@media (max-width: 767.98px) {
+ .repo-grid-filelist-sidebar {
+ grid-template-columns: 100%;
+ grid-template-rows: auto auto auto;
+ }
+ .repo-grid-filelist-sidebar .repo-home-filelist {
+ grid-column: 1;
+ grid-row: 2;
+ }
+ .repo-grid-filelist-sidebar .repo-home-sidebar-top {
+ grid-column: 1;
+ grid-row: 1;
+ padding-left: 0;
+ }
+ .repo-grid-filelist-sidebar .repo-home-sidebar-bottom {
+ grid-column: 1;
+ grid-row: 3;
+ padding-left: 0;
+ }
+ .repo-home-sidebar-bottom > :first-child {
+ border-top: 0;
+ }
+}
+
+.language-stats {
+ display: flex;
+ gap: 2px;
+ padding: 0;
+ height: 10px;
+ white-space: nowrap;
+ border-radius: 5px;
+ overflow: hidden;
+ width: 100%;
+ margin-top: 1rem;
+ margin-bottom: 5px;
+}
+
+.language-stats-details {
+ display: flex;
+ flex-wrap: wrap;
+}
+
+.language-stats-details .item {
+ height: 30px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ gap: 0.25em;
+ padding: 0 0.5em; /* make the UI look better for narrow (mobile) view */
+ text-decoration: none;
+}
diff --git a/web_src/js/features/citation.ts b/web_src/js/features/citation.ts
index 8fc6beabfb..fc5bb38f0a 100644
--- a/web_src/js/features/citation.ts
+++ b/web_src/js/features/citation.ts
@@ -41,35 +41,28 @@ export async function initCitationFileCopyContent() {
citationCopyApa.classList.toggle('primary', !isBibtex);
};
- document.querySelector('#cite-repo-button')?.addEventListener('click', async (e: MouseEvent & {target: HTMLAnchorElement}) => {
- const dropdownBtn = e.target.closest('.ui.dropdown.button');
- dropdownBtn.classList.add('is-loading');
-
+ document.querySelector('#cite-repo-button')?.addEventListener('click', async () => {
try {
- try {
- await initInputCitationValue(citationCopyApa, citationCopyBibtex);
- } catch (e) {
- console.error(`initCitationFileCopyContent error: ${e}`, e);
- return;
- }
- updateUi();
-
- citationCopyApa.addEventListener('click', () => {
- localStorage.setItem('citation-copy-format', 'apa');
- updateUi();
- });
-
- citationCopyBibtex.addEventListener('click', () => {
- localStorage.setItem('citation-copy-format', 'bibtex');
- updateUi();
- });
-
- inputContent.addEventListener('click', () => {
- inputContent.select();
- });
- } finally {
- dropdownBtn.classList.remove('is-loading');
+ await initInputCitationValue(citationCopyApa, citationCopyBibtex);
+ } catch (e) {
+ console.error(`initCitationFileCopyContent error: ${e}`, e);
+ return;
}
+ updateUi();
+
+ citationCopyApa.addEventListener('click', () => {
+ localStorage.setItem('citation-copy-format', 'apa');
+ updateUi();
+ });
+
+ citationCopyBibtex.addEventListener('click', () => {
+ localStorage.setItem('citation-copy-format', 'bibtex');
+ updateUi();
+ });
+
+ inputContent.addEventListener('click', () => {
+ inputContent.select();
+ });
fomanticQuery('#cite-repo-modal').modal('show');
});
diff --git a/web_src/js/features/repo-home.ts b/web_src/js/features/repo-home.ts
index a65a1815d2..df52b87f5a 100644
--- a/web_src/js/features/repo-home.ts
+++ b/web_src/js/features/repo-home.ts
@@ -7,7 +7,7 @@ import {fomanticQuery} from '../modules/fomantic/base.ts';
const {appSubUrl} = window.config;
export function initRepoTopicBar() {
- const mgrBtn = document.querySelector('#manage_topic');
+ const mgrBtn = document.querySelector |
|---|