Semantic HTML and post feed #23

Merged
Jaculabilis merged 10 commits from tvb/post-feed into develop 2021-10-02 00:18:32 +00:00
5 changed files with 35 additions and 35 deletions
Showing only changes of commit ffaf881707 - Show all commits

View File

@ -17,7 +17,7 @@ div#editor-left {
display: flex;
align-items: stretch;
}
div#editor-left div.contentblock {
div#editor-left section {
display: flex;
flex-direction: column;
margin: 10px 5px 10px 10px;
@ -48,7 +48,7 @@ textarea#editor-content {
div#editor-right {
overflow-y: scroll;
}
div#editor-right div.contentblock {
div#editor-right section {
margin: 10px 5px 10px 10px;
}
span.message-warning {

View File

@ -8,14 +8,14 @@ body {
line-height: 1.4;
font-size: 16px;
}
div#wrapper {
main {
max-width: 800px;
position: absolute;
left: 0;
right: 0;
margin: 0 auto;
}
div#header {
header {
padding: 5px;
margin: 5px;
background-color: #ffffff;
@ -24,7 +24,7 @@ div#header {
overflow: auto;
position: relative;
}
div#header p, div#header h2 {
header p, header h2 {
margin: 5px;
}
div#login-status {
@ -33,7 +33,7 @@ div#login-status {
top: 10px;
right: 10px;
}
div#sidebar {
nav {
width: 200px;
float:left;
margin:5px;
@ -46,7 +46,7 @@ div#sidebar {
img#logo {
max-width: 200px;
}
div#sidebar table {
nav table {
width: 100%;
border-collapse: collapse;
}
@ -63,32 +63,32 @@ table a {
border-radius: 5px;
text-decoration: none;
}
div#sidebar table a {
nav table a {
justify-content: center;
}
table a:hover {
background-color: var(--button-hover);
}
div#sidebar table a.current-page {
nav table a.current-page {
background-color: var(--button-current);
}
div#sidebar table a.current-page:hover {
nav table a.current-page:hover {
background-color: var(--button-current);
}
div#sidebar table td {
nav table td {
padding: 0px; margin: 3px 0;
border-bottom: 8px solid transparent;
}
div#content {
article {
margin: 5px;
}
div.content-2col {
article.content-2col {
position: absolute;
right: 0px;
left: 226px;
max-width: 564px;
}
div.contentblock {
section {
background-color: #ffffff;
box-shadow: 2px 2px 10px #888888;
margin-bottom: 5px;
@ -216,26 +216,26 @@ details.setting-help {
width: 4em;
}
@media only screen and (max-width: 816px) {
div#wrapper {
main {
padding: 5px;
}
div#header {
header {
max-width: 554px;
margin: 0 auto;
}
div#sidebar {
nav {
max-width: 548px;
width: inherit;
float: inherit;
margin: 10px auto;
}
div#content{
article{
margin: 10px auto;
}
div.content-1col {
article.content-1col {
max-width: 564px;
}
div.content-2col {
article.content-2col {
max-width: 564px;
position: static;
right: inherit;

View File

@ -8,8 +8,8 @@
<link rel="stylesheet" href="{{ url_for('static', filename='page.css') }}">
</head>
<body>
<div id="wrapper">
<div id="header">
<main>
<header>
<div id="login-status" {% block login_status_attr %}{% endblock %}>
{% if current_user.is_authenticated %}
<b>{{ current_user.username -}}</b>
@ -24,15 +24,15 @@
{% endif %}
</div>
{% block header %}{% endblock %}
</div>
</header>
{% block sidebar %}{% endblock %}
<div id="content" class="{% block content_class %}{% endblock %}">
<article class="{% block content_class %}{% endblock %}">
{% if not template_content_blocks %}{% set template_content_blocks = [] %}{% endif %}
{% if not content_blocks %}{% set content_blocks = [] %}{% endif %}
{% for content_block in template_content_blocks + content_blocks %}<div class="contentblock">
{{ content_block|safe }}</div>
{% for content_block in template_content_blocks + content_blocks -%}
<section>{{ content_block|safe }}</div>
{% endfor %}
</div>
</div>
</article>
</main>
</body>
</html>

View File

@ -1,12 +1,12 @@
{% extends "page.jinja" %}
{% block sidebar %}
<div id="sidebar">
<nav>
{% if not template_sidebar_rows %}{% set template_sidebar_rows = [] %}{% endif %}
{% if not sidebar_rows %}{% set sidebar_rows = [] %}{% endif %}
<table>
{% for row in template_sidebar_rows + sidebar_rows %}
<tr><td>{{ row|safe }}</td></tr>{% endfor %}
</table>
</div>
</nav>
{% endblock %}
{% block content_class %}content-2col{% endblock %}

View File

@ -34,7 +34,7 @@
<body>
<div id="wrapper">
<div id="editor-left" class="column">
<div class="contentblock">
<section>
{# Thin header bar #}
<div id="editor-header">
{# Header always includes backlink to lexicon #}
@ -103,16 +103,16 @@
{# #}{{ article.contents }}{#
#}</textarea>
{% endif %}
</div>
</section>
</div>
<div id="editor-right" class="column">
<div id="preview" class="contentblock">
<section id="preview">
<p>This editor requires Javascript to function.</p>
</div>
<div id="preview-citations" class="contentblock">
<section id="preview-citations">
<p>&nbsp;</p>
</div>
<div id="preview-control" class="contentblock">
<section id="preview-control">
<p>&nbsp;</p>
</div>
</div>