Threads: Fix css of threads

jocadbz
Joca 2025-08-29 22:41:05 -03:00
parent e18d7ba193
commit adac250d86
Signed by: jocadbz
GPG Key ID: B1836DCE2F50BDF7
2 changed files with 62 additions and 19 deletions

View File

@ -176,7 +176,7 @@ p, a, li {
color: #001858; color: #001858;
} }
/* Enhanced styles for boards */ /* Styles for board lists */
ul.board-list { ul.board-list {
list-style-type: none; list-style-type: none;
padding: 0; padding: 0;
@ -185,7 +185,7 @@ ul.board-list {
li.board-item { li.board-item {
margin-bottom: 1em; margin-bottom: 1em;
padding: 1em; padding: 1.2em 1.5em;
background-color: #fef6e4; background-color: #fef6e4;
border: 1px solid #001858; border: 1px solid #001858;
border-radius: 8px; border-radius: 8px;
@ -201,7 +201,7 @@ li.board-item a {
color: #001858; color: #001858;
font-weight: bold; font-weight: bold;
text-decoration: none; text-decoration: none;
font-size: 1.2em; font-size: 1.4em;
} }
li.board-item a:hover { li.board-item a:hover {
@ -212,10 +212,50 @@ li.board-item a:hover {
p.board-desc { p.board-desc {
margin: 0.5em 0 0 0; margin: 0.5em 0 0 0;
color: #001858; color: #001858;
font-size: 0.9em; font-size: 1em;
} }
/* Enhanced styles for thread posts */ /* Styles for thread lists */
ul.thread-list {
list-style-type: none;
padding: 0;
margin: 0;
}
li.thread-item {
margin-bottom: 1em;
padding: 1.2em 1.5em;
background-color: #fef6e4;
border: 1px solid #001858;
border-radius: 8px;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
li.thread-item:hover {
transform: translateY(-3px);
box-shadow: 0px 6px 14px 0px rgba(0,0,0,0.15);
}
li.thread-item a {
color: #001858;
font-weight: bold;
text-decoration: none;
font-size: 1.4em;
}
li.thread-item a:hover {
color: #f582ae;
text-decoration: underline;
}
p.thread-info {
margin: 0.5em 0 0 0;
color: #001858;
font-size: 1em;
}
/* Specific styles for individual thread posts */
.thread-posts { .thread-posts {
width: 80%; width: 80%;
max-width: 800px; max-width: 800px;
@ -226,7 +266,7 @@ p.board-desc {
border: 1px solid #001858; border: 1px solid #001858;
border-radius: 8px; border-radius: 8px;
margin-bottom: 1.5em; margin-bottom: 1.5em;
padding: 1em; padding: 1.2em 1.5em;
transition: transform 0.2s ease, box-shadow 0.2s ease; transition: transform 0.2s ease, box-shadow 0.2s ease;
} }
@ -239,27 +279,27 @@ p.board-desc {
background-color: #001858; background-color: #001858;
color: #fef6e4; color: #fef6e4;
padding: 0.5em; padding: 0.5em;
margin: -1em -1em 1em -1em; margin: -1.2em -1.5em 1em -1.5em;
border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0;
border-bottom: 1px solid #001858; border-bottom: 1px solid #001858;
} }
.post-item header h3 { .post-item header h3 {
margin: 0; margin: 0;
font-size: 1.1em; font-size: 1.2em;
} }
.post-item header p { .post-item header p {
margin: 0.3em 0 0 0; margin: 0.3em 0 0 0;
font-size: 0.85em; font-size: 0.95em;
opacity: 0.9; opacity: 0.9;
} }
.post-content { .post-content {
margin: 0; margin: 0;
padding: 0.5em; padding: 0.8em;
line-height: 1.5; line-height: 1.5;
font-size: 0.95em; font-size: 1em;
} }
.post-actions { .post-actions {
@ -272,8 +312,8 @@ p.board-desc {
.post-actions a { .post-actions a {
color: #001858; color: #001858;
text-decoration: none; text-decoration: none;
font-size: 0.9em; font-size: 1em;
padding: 0.3em 0.6em; padding: 0.4em 0.8em;
border: 1px solid #001858; border: 1px solid #001858;
border-radius: 4px; border-radius: 4px;
transition: background-color 0.2s ease; transition: background-color 0.2s ease;
@ -330,17 +370,17 @@ p.board-desc {
input[type="submit"]:hover, button:hover { input[type="submit"]:hover, button:hover {
background-color: #8bd3dd; background-color: #8bd3dd;
} }
li.board-item { li.board-item, li.thread-item {
background-color: #444; background-color: #444;
border-color: #fef6e4; border-color: #fef6e4;
} }
li.board-item a { li.board-item a, li.thread-item a {
color: #fef6e4; color: #fef6e4;
} }
li.board-item a:hover { li.board-item a:hover, li.thread-item a:hover {
color: #f582ae; color: #f582ae;
} }
p.board-desc { p.board-desc, p.thread-info {
color: #fef6e4; color: #fef6e4;
} }
.post-item { .post-item {

View File

@ -15,9 +15,12 @@
<section> <section>
<h3>Threads</h3> <h3>Threads</h3>
{{if .Threads}} {{if .Threads}}
<ul> <ul class="thread-list">
{{range .Threads}} {{range .Threads}}
<li><a href="{{$.BasePath}}/thread/?id={{.ID}}">{{.Title}}</a> - Updated on {{.UpdatedAt.Format "02/01/2006 - 15:04"}}</li> <li class="thread-item">
<a href="{{$.BasePath}}/thread/?id={{.ID}}">{{.Title}}</a>
<p class="thread-info">Updated on {{.UpdatedAt.Format "02/01/2006 - 15:04"}}</p>
</li>
{{end}} {{end}}
</ul> </ul>
{{else}} {{else}}