move forum style into its own file

This commit is contained in:
thomas girod 2024-08-15 00:40:30 +02:00
parent bbcc7ffeaa
commit 3f2b63aaa5
9 changed files with 189 additions and 159 deletions

View File

@ -1248,165 +1248,6 @@ textarea {
display: inline;
}
/*------------------------------FORUM----------------------------------*/
#forum {
.button {
background-color: rgb(230, 230, 230);
padding: 10px;
font-weight: bold;
border-radius: 5px;
&:hover {
background-color: rgb(211, 211, 211);
}
}
.topic {
border: solid $primary-neutral-color 1px;
padding: 1px;
margin: 1px;
p {
margin: 1px;
font-size: smaller;
}
a {
color: $black-color;
}
a:hover {
text-decoration: underline;
}
}
.tools {
font-size: x-small;
border: none;
font-weight: bold;
a {
padding: 1px;
}
}
.title {
font-size: small;
font-weight: bold;
padding: 2px;
}
.last_message date {
white-space: nowrap;
}
.last_message span {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
width: 100%;
display: block;
}
.forum {
background: $primary-neutral-light-color;
padding: 1px;
margin: 1px;
p {
margin: 1px;
font-size: smaller;
}
a {
color: $black-color;
}
a:hover {
text-decoration: underline;
}
}
.search_bar {
margin: 10px 0;
display: flex;
flex-wrap: wrap;
height: 20px;
align-items: center;
}
.search_check {
margin-left: 10px;
}
.search_bouton {
margin-left: 10px;
}
.category {
margin-top: 5px;
background: $secondary-color;
color: white;
border-radius: 10px 10px 0 0;
.title {
text-transform: uppercase;
}
}
.message {
padding: 1px;
margin: 1px;
background: $secondary-neutral-light-color;
&:nth-child(odd) {
background: $primary-neutral-light-color;
}
.title {
font-size: 100%;
}
&.unread {
background: #e9eea1;
}
}
.msg_author.deleted {
background: #ffcfcf;
}
.msg_content {
&.deleted {
background: #ffefef;
}
display: inline-block;
width: 80%;
vertical-align: top;
}
.msg_author {
display: inline-block;
width: 19%;
text-align: center;
img {
max-width: 70%;
margin: 0 auto;
}
}
.msg_header {
display: inline-block;
width: 100%;
font-size: small;
}
.msg_meta {
font-size: small;
list-style-type: none;
li {
padding: 1px;
margin: 1px;
}
}
.forum_signature {
color: hsl(0, 0%, 75%);
border-top: 1px solid hsl(0, 0%, 75%);
a {
color: hsl(0, 0%, 75%);
&:hover {
text-decoration: underline;
}
}
}
}
/*--------------------------------FOOTER-------------------------------*/
footer {

View File

@ -0,0 +1,158 @@
@import "core/static/core/colors";
#forum {
.button {
background-color: rgb(230, 230, 230);
padding: 10px;
font-weight: bold;
border-radius: 5px;
&:hover {
background-color: rgb(211, 211, 211);
}
}
.topic {
border: solid $primary-neutral-color 1px;
padding: 1px;
margin: 1px;
p {
margin: 1px;
font-size: smaller;
}
a {
color: $black-color;
}
a:hover {
text-decoration: underline;
}
}
.tools {
font-size: x-small;
border: none;
font-weight: bold;
a {
padding: 1px;
}
}
.title {
font-size: small;
font-weight: bold;
padding: 2px;
}
.last_message date {
white-space: nowrap;
}
.last_message span {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
width: 100%;
display: block;
}
.forum {
background: $primary-neutral-light-color;
padding: 1px;
margin: 1px;
p {
margin: 1px;
font-size: smaller;
}
a {
color: $black-color;
}
a:hover {
text-decoration: underline;
}
}
.search_bar {
margin: 10px 0;
display: flex;
flex-wrap: wrap;
height: 20px;
align-items: center;
}
.search_check {
margin-left: 10px;
}
.search_bouton {
margin-left: 10px;
}
.category {
margin-top: 5px;
background: $secondary-color;
color: white;
border-radius: 10px 10px 0 0;
.title {
text-transform: uppercase;
}
}
.message {
padding: 1px;
margin: 1px;
background: $secondary-neutral-light-color;
&:nth-child(odd) {
background: $primary-neutral-light-color;
}
.title {
font-size: 100%;
}
&.unread {
background: #e9eea1;
}
}
.msg_author.deleted {
background: #ffcfcf;
}
.msg_content {
&.deleted {
background: #ffefef;
}
display: inline-block;
width: 80%;
vertical-align: top;
}
.msg_author {
display: inline-block;
width: 19%;
text-align: center;
img {
max-width: 70%;
margin: 0 auto;
}
}
.msg_header {
display: inline-block;
width: 100%;
font-size: small;
}
.msg_meta {
font-size: small;
list-style-type: none;
li {
padding: 1px;
margin: 1px;
}
}
.forum_signature {
color: hsl(0, 0%, 75%);
border-top: 1px solid hsl(0, 0%, 75%);
a {
color: hsl(0, 0%, 75%);
&:hover {
text-decoration: underline;
}
}
}
}

View File

@ -5,6 +5,10 @@
{% trans %}Favorite topics{% endtrans %}
{% endblock %}
{% block additional_css %}
<link rel="stylesheet" href="{{ scss('forum/css/forum.scss') }}">
{% endblock %}
{% block content %}
<p>
<a href="{{ url('forum:main') }}">Forum</a> >

View File

@ -5,6 +5,10 @@
{{ forum }}
{% endblock %}
{% block additional_css %}
<link rel="stylesheet" href="{{ scss('forum/css/forum.scss') }}">
{% endblock %}
{% block content %}
{{ display_breadcrumb(forum) }}
<div id="forum">

View File

@ -5,6 +5,10 @@
{% trans %}Last unread messages{% endtrans %}
{% endblock %}
{% block additional_css %}
<link rel="stylesheet" href="{{ scss('forum/css/forum.scss') }}">
{% endblock %}
{% block content %}
<p>
<a href="{{ url('forum:main') }}">Forum</a> >

View File

@ -6,6 +6,10 @@
{% trans %}Forum{% endtrans %}
{% endblock %}
{% block additional_css %}
<link rel="stylesheet" href="{{ scss('forum/css/forum.scss') }}">
{% endblock %}
{% block content %}
<p>
<a href="{{ url('forum:main') }}">{% trans %}Forum{% endtrans %}</a> >

View File

@ -9,6 +9,11 @@
{% endif %}
{% endblock %}
{% block additional_css %}
<link rel="stylesheet" href="{{ scss('forum/css/forum.scss') }}">
{% endblock %}
{% block content %}
{% if topic %}
{{ display_search_bar(request) }}

View File

@ -2,6 +2,11 @@
{% from 'forum/macros.jinja' import display_message, display_breadcrumb, display_search_bar %}
{% block additional_css %}
<link rel="stylesheet" href="{{ scss('forum/css/forum.scss') }}">
{% endblock %}
{% block content %}
<div id="forum">
{{ display_search_bar(request) }}

View File

@ -6,6 +6,11 @@
{{ topic }}
{% endblock %}
{% block additional_css %}
<link rel="stylesheet" href="{{ scss('forum/css/forum.scss') }}">
{% endblock %}
{% block head %}
{{ super() }}
<style type="text/css" media="all">