bbaovanc/bobatheme
1
0
Fork 0
mirror of https://github.com/BBaoVanC/bobatheme.git synced 2025-06-12 09:47:29 -05:00
Code Issues Projects Releases Wiki Activity

Replace <li> in page lists with semantic HTML <article>

Browse Source
This commit is contained in:
BBaoVanC
2022-05-21 23:20:22 -05:00
parent 73dc916d5a
commit a65a435b1d
9 changed files with 122 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
assets/css/bobastyle.css
View File

@ -123,8 +123,8 @@
gap: 40px;
}
.page-list ul,
.series-taxonomy ul {
.page-list,
.series-taxonomy-list {
display: flex;
flex-direction: column;
list-style: none;
@ -132,12 +132,13 @@
gap: 40px;
}
.series-taxonomy ul {
.series-taxonomy-list {
gap: 80px;
}
.page-list li,
.series-taxonomy li {
.page-list .post,
.series-taxonomy-list .series-taxonomy,
.series-taxonomy .post {
padding-top: 8px;
padding-left: 24px;
padding-right: 24px;
@ -206,7 +207,7 @@
margin: 0;
}
.taxonomy-list ul {
.taxonomy-list {
list-style: none;
padding: 0;
display: flex;
@ -214,7 +215,7 @@
gap: 10px;
}
.taxonomy-list li {
.taxonomy-list .taxonomy-term {
background-color: var(--background-1);
color: var(--text-1);
padding: 8px 12px;
@ -230,7 +231,7 @@
}
@media (max-width: 480px) {
.taxonomy-list li {
.taxonomy-list .taxonomy-term {
flex-direction: column;
gap: 4px;
}
@ -244,7 +245,7 @@
/* Series list format */
.series-pages ul {
.series-page-list {
display: flex;
gap: 10px;
flex-flow: row wrap;
@ -255,7 +256,7 @@
border-radius: 16px;
}
.series-pages li {
.series-page-list .post {
flex: 1;
min-width: 49%;
}
@ -304,8 +305,13 @@
/* Header formatting (website title and article section headers) */
h1.header {
.header {
margin: 16px 0;
}
.header h1 {
font-size: 1.5em;
font-weight: bold;
}
.header a,
@ -347,6 +353,7 @@ h1.header {
}
/* Related posts */
.full-width-page-list {
/* make left/right 0 margin so it takes up full width */
@ -359,16 +366,16 @@ h1.header {
margin-right: 20px;
}
.full-width-page-list li {
.full-width-page-list .post {
min-width: 300px;
max-width: 300px;
}
.full-width-page-list li:first-child {
.full-width-page-list .post:first-child {
margin-left: 20px;
}
.full-width-page-list li:last-child {
.full-width-page-list .post:last-child {
margin-right: 20px;
}
@ -393,7 +400,7 @@ h1.header {
}
}
.full-width-page-list .page-list ul {
.full-width-page-list .page-list {
display: flex;
flex-direction: row;
gap: 20px;
@ -401,6 +408,7 @@ h1.header {
}
/* Social media share buttons */
.share-buttons {
background: var(--background-1);
@ -439,6 +447,7 @@ h1.header {
*/
/* See also formating */
.see-also {
background-color: var(--background-1);
@ -453,6 +462,7 @@ h1.header {
}
/* Back to top */
#back-to-top {
position: fixed;