split comments css

This commit is contained in:
j 2023-07-15 13:04:07 +05:30
parent b420bf43b7
commit 100fe79b1d
4 changed files with 61 additions and 50 deletions

View file

@ -0,0 +1,43 @@
.comments h3 {
font-weight: bold;
padding: 4px;
padding-left: 0;
margin: 0;
//display: none;
}
.comments.active h3 {
display: block;
}
.comments .icon svg {
width: 12px;
height: 12px;
}
.add-comment {
width: 100%;
height: 30vh;
text-align: center;
}
.add-comment input {
width: 100px;
}
.add-comment textarea {
width: 80%;
display: block;
background: black;
color: white;
margin: auto;
padding: 0;
border: 0;
}
.add-comment button {
background: red;
border: 0;
}
.comment .text {
white-space: pre-line;
}

View file

@ -1,4 +1,4 @@
/* http://meyerweb.com/eric/tools/css/reset/ /* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126 v2.0 | 20110126
License: none (public domain) License: none (public domain)
*/ */
@ -9,11 +9,11 @@ a, abbr, acronym, address, big, cite,
del, dfn, em, img, ins, kbd, q, s, samp, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, small, strike, strong, sub, sup, tt, var,
u, i, center, u, i, center,
ol, ol,
fieldset, form, label, legend, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup, figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary, menu, nav, output, ruby, section, summary,
time, mark, audio, video { time, mark, audio, video {
margin: 0; margin: 0;
@ -24,7 +24,7 @@ time, mark, audio, video {
vertical-align: baseline; vertical-align: baseline;
} }
/* HTML5 display-role reset for older browsers */ /* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { footer, header, hgroup, menu, nav, section {
display: block; display: block;
} }

View file

@ -86,6 +86,16 @@ video, .poster {
.layer.active:first-child { .layer.active:first-child {
padding-top: 0px; padding-top: 0px;
} }
.layer h3 {
font-weight: bold;
padding: 4px;
padding-left: 0;
margin: 0;
//display: none;
}
.layer.active h3 {
display: block;
}
.annotation { .annotation {
padding: 4px; padding: 4px;
@ -107,20 +117,10 @@ video, .poster {
} }
} }
.layer h3, .layer h3 {
.comments h3 {
font-weight: bold;
padding: 4px;
padding-left: 0;
margin: 0;
//display: none;
cursor: pointer; cursor: pointer;
} }
.layer.active h3 { .layer .icon svg {
display: block;
}
.layer .icon svg,
.comments .icon svg {
width: 12px; width: 12px;
height: 12px; height: 12px;
} }

View file

@ -1,40 +1,8 @@
{% extends "base.html" %} {% extends "base.html" %}
{% block head %} {% block head %}
<style>
body {
margin: 0;
padding: 0;
background: turquoise;
}
.add-comment {
width: 100%;
height: 30vh;
text-align: center;
}
.add-comment input {
width: 100px;
}
.add-comment textarea {
width: 80%;
display: block;
background: black;
color: white;
margin: auto;
padding: 0;
border: 0;
}
.add-comment button {
background: red;
border: 0;
}
.comment .text {
white-space: pre-line;
}
</style>
<link rel="stylesheet" href="/static/css/reset.css"></link> <link rel="stylesheet" href="/static/css/reset.css"></link>
<link rel="stylesheet" href="/static/css/style.css"></link> <link rel="stylesheet" href="/static/css/style.css"></link>
<link rel="stylesheet" href="/static/css/comments.css"></link>
{% endblock %} {% endblock %}
{% block main %} {% block main %}
<div class="content"> <div class="content">