gitea-mirror/blog
1
0
Fork 0
mirror of https://gitea.com/gitea/blog.git synced 2024-06-02 03:41:23 +05:30
Code Issues Packages Projects Releases Wiki Activity

update styles and tag page

Browse source
This commit is contained in:
HesterG 2023-07-11 18:11:34 +08:00
parent 2381d5fe25
commit 5df3506783
4 changed files with 93 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
docusaurus.config.js
View file

@ -83,25 +83,41 @@ const config = {
{
href: 'https://docs.gitea.com/',
label: 'Docs',
position: 'left',
className: 'header-navbar-link'
position: 'left',
className: 'internal-href',
},
{
href: 'https://docs.gitea.com/api/1.19/',
label: 'API',
position: 'left',
className: 'internal-href',
},
{
to: '/',
label: 'Blog',
position: 'left',
className: 'header-navbar-link'
},
{
href: 'https://github.com/go-gitea/gitea',
label: 'Code',
position: 'left',
className: 'header-navbar-link',
},
{
type: 'search',
position: 'right',
},
{
href: 'https://docs.gitea.com/help/seek-help',
position: 'right',
label: 'Support',
className: 'internal-href',
},
{
href: 'https://gitea.com/user/login',
label: 'Sign In',
position: 'right',
className: 'internal-href signin-button',
},
],
},
footer: {
@ -112,7 +128,8 @@ const config = {
items: [
{
label: 'Tutorial',
to: '/',
href: 'https://docs.gitea.com/',
className: 'internal-href',
},
],
},

68
src/css/custom.css
View file

@ -40,19 +40,65 @@
--theme-card-border-radius: 8px;
}
.navbar__item.header-navbar-link {
display: flex;
align-items: center;
column-gap: 0.3rem;
.internal-href [class*='iconExternalLink'] {
display: none;
}
@media screen and (max-width: 996px) {
.navbar__item.header-navbar-link {
.signin-button {
--bs-btn-padding-x: .75rem;
--bs-btn-padding-y: .375rem;
--bs-btn-font-family: ;
--bs-btn-font-size: 1rem;
--bs-btn-font-weight: 400;
--bs-btn-line-height: 1.5;
--bs-btn-bg: transparent;
--bs-btn-border-width: 1px;
--bs-btn-border-radius: .375rem;
--bs-btn-box-shadow: inset 0 1px 0 rgba(255,255,255,0.15),0 1px 1px rgba(29,45,53,0.075);
--bs-btn-disabled-opacity: .65;
--bs-btn-focus-box-shadow: 0 0 0 0 rgba(var(--bs-btn-focus-shadow-rgb), .5);
--bs-btn-color: #198754;
--bs-btn-border-color: #198754;
--bs-btn-hover-color: #fff;
--bs-btn-hover-bg: #198754;
--bs-btn-hover-border-color: #198754;
--bs-btn-focus-shadow-rgb: 25,135,84;
--bs-btn-active-color: #fff;
--bs-btn-active-bg: #198754;
--bs-btn-active-border-color: #198754;
--bs-btn-active-shadow: inset 0 3px 5px rgba(29,45,53,0.125);
--bs-btn-disabled-color: #198754;
--bs-btn-disabled-bg: transparent;
--bs-gradient: none;
display: inline-block;
padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
font-family: var(--bs-btn-font-family);
font-size: var(--bs-btn-font-size);
font-weight: var(--bs-btn-font-weight);
line-height: var(--bs-btn-line-height);
color: var(--bs-btn-color);
text-align: center;
vertical-align: middle;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
border-radius: var(--bs-btn-border-radius);
background-color: var(--bs-btn-bg);
transition: color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out;
margin-left: var(--ifm-navbar-item-padding-horizontal);
order: 1;
}
.signin-button:hover {
color: var(--bs-btn-hover-color);
background-color: var(--bs-btn-hover-bg);
border-color: var(--bs-btn-hover-border-color);
}
@media (max-width: 996px) {
.navbar__item.signin-button {
display: none;
}
.menu__link.header-navbar-link {
display: flex;
align-items: center;
column-gap: 0.3rem;
}
}

4
src/theme/BlogListPage/Chips/index.js
View file

@ -5,11 +5,11 @@ import { ensureTrailingSlash } from '@site/src/utils/ensureTrailingSlash.js';
export const Chips = ({ items, activeChip }) => (
<div className={styles.root}>
{items.map(({ name, permalink }) => (
{items.map(({ label, permalink }) => (
<Chip
key={permalink}
className={styles.chip}
label={name}
label={label}
permalink={ensureTrailingSlash(permalink)}
active={activeChip === permalink}
/>

25
src/theme/BlogListPage/index.js
View file

@ -36,22 +36,21 @@ function BlogListPageMetadata(props) {
}
function BlogListPageContent(props) {
const isTagsPage = props.tag !== undefined;
let tagPageCount = -1;
const metadata = isTagsPage ? props.listMetadata: props.metadata;
// No official api to get all tags right now: https://github.com/facebook/docusaurus/discussions/5856
// So used customized blog plugin which extends original blog plugin
const globalData = useGlobalData();
const myPluginData = globalData['docusaurus-plugin-content-blog']['default'];
const tagNames = [];
for (const tag of Object.keys(myPluginData.tags)) {
tagNames.push(myPluginData.tags[tag].label);
}
const {items, sidebar} = props;
// No official way to get all tags right now: https://github.com/facebook/docusaurus/discussions/5856
// unless show all posts without pagination, so added all tag list link
const tags = tagNames.map((name) => {
return {
name,
permalink: `/tags/${name.replace(/ /g, '-')}`,
const tags = [];
for (const {items, label, permalink} of Object.values(myPluginData.tags)) {
tags.push({label, permalink});
if (isTagsPage && props.tag.label === label) {
tagPageCount = items.length;
}
})
}
tags.sort((a,b) => a.label.localeCompare(b.label) );
const {items, sidebar} = props;
return (
// <BlogLayout sidebar={sidebar}>
// <BlogPostItems items={items} />
@ -67,7 +66,7 @@ function BlogListPageContent(props) {
/>
</div>
<a className={styles.link} href='/'>Show all posts</a>
<h2 className={styles.title}>{isTagsPage? `All "${props.tag.label}" blogs`: "Blog Posts"}</h2>
<h2 className={styles.title}>{isTagsPage? `${tagPageCount !== -1 ? `${tagPageCount} posts`: 'Posts'} tagged with "${props.tag.label}"`: "Blog Posts"}</h2>
<div className={styles.posts}>
{items.map(({ content }, i) => (
<ListItem