Reduce div usage

This commit is contained in:
Tim Van Baak 2023-06-04 16:24:16 -07:00
parent 31e63611a4
commit 2d86ccf251
3 changed files with 34 additions and 34 deletions

View File

@ -4,11 +4,11 @@
<title>Intake - {{ subtitle }}</title> <title>Intake - {{ subtitle }}</title>
<link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwgAADsIBFShKgAAAABh0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMS41ZEdYUgAAAGFJREFUOE+lkFEKwDAIxXrzXXB3ckMm9EnAV/YRCxFCcUXEL3Jc77NDjpDA/VGL3RFWYEICfeGC8oQc9IPuCAnQDcoRVmBCAn3hgvKEHPSD7ggJ0A3KEVZgQgJ94YLSJ9YDUzNGDXGZ/JEAAAAASUVORK5CYII="> <link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwgAADsIBFShKgAAAABh0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMS41ZEdYUgAAAGFJREFUOE+lkFEKwDAIxXrzXXB3ckMm9EnAV/YRCxFCcUXEL3Jc77NDjpDA/VGL3RFWYEICfeGC8oQc9IPuCAnQDcoRVmBCAn3hgvKEHPSD7ggJ0A3KEVZgQgJ94YLSJ9YDUzNGDXGZ/JEAAAAASUVORK5CYII=">
<style> <style>
div#wrapper { main {
max-width: 700px; max-width: 700px;
margin: 0 auto; margin: 0 auto;
} }
.readable-item { article {
border: 1px solid black; border-radius: 6px; border: 1px solid black; border-radius: 6px;
padding: 5px; padding: 5px;
margin-bottom: 20px; margin-bottom: 20px;
@ -33,10 +33,10 @@ div#wrapper {
.item-info { .item-info {
color: rgba(0, 0, 0, 0.7); color: rgba(0, 0, 0, 0.7);
} }
.readable-item img { article img {
max-width: 100%; max-width: 100%;
} }
.readable-item textarea { article textarea {
width: 100%; width: 100%;
resize: vertical; resize: vertical;
} }
@ -67,9 +67,9 @@ span.error-message {
</style> </style>
</head> </head>
<body> <body>
<div id="wrapper"> <main>
<div class="readable-item"> <article>
<form method="post"> <form method="post">
<label for="config" class="item-title">Config Editor</label> <label for="config" class="item-title">Config Editor</label>
<textarea autofocus id="config" name="config" rows=20>{{config}}</textarea> <textarea autofocus id="config" name="config" rows=20>{{config}}</textarea>
@ -79,8 +79,8 @@ span.error-message {
{% endif %} {% endif %}
</p> </p>
</form> </form>
</div> </article>
</div> </main>
</body> </body>
</html> </html>

View File

@ -4,11 +4,11 @@
<title>Intake{% if items %} ({{ items|length }}){% endif %}</title> <title>Intake{% if items %} ({{ items|length }}){% endif %}</title>
<link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwgAADsIBFShKgAAAABh0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMS41ZEdYUgAAAGFJREFUOE+lkFEKwDAIxXrzXXB3ckMm9EnAV/YRCxFCcUXEL3Jc77NDjpDA/VGL3RFWYEICfeGC8oQc9IPuCAnQDcoRVmBCAn3hgvKEHPSD7ggJ0A3KEVZgQgJ94YLSJ9YDUzNGDXGZ/JEAAAAASUVORK5CYII="> <link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwgAADsIBFShKgAAAABh0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMS41ZEdYUgAAAGFJREFUOE+lkFEKwDAIxXrzXXB3ckMm9EnAV/YRCxFCcUXEL3Jc77NDjpDA/VGL3RFWYEICfeGC8oQc9IPuCAnQDcoRVmBCAn3hgvKEHPSD7ggJ0A3KEVZgQgJ94YLSJ9YDUzNGDXGZ/JEAAAAASUVORK5CYII=">
<style> <style>
div#wrapper { main {
max-width: 700px; max-width: 700px;
margin: 0 auto; margin: 0 auto;
} }
.readable-item { article {
border: 1px solid black; border-radius: 6px; border: 1px solid black; border-radius: 6px;
padding: 5px; padding: 5px;
margin-bottom: 20px; margin-bottom: 20px;
@ -33,7 +33,7 @@ div#wrapper {
.item-info { .item-info {
color: rgba(0, 0, 0, 0.7); color: rgba(0, 0, 0, 0.7);
} }
.readable-item img { article img {
max-width: 100%; max-width: 100%;
} }
button, summary { button, summary {
@ -120,13 +120,13 @@ var doAction = function (source, itemid, action) {
</script> </script>
</head> </head>
<body> <body>
<div id="wrapper"> <main>
<div class="readable-item center"> <article class="center">
<span class="item-title"><a href="{{url_for('root')}}">Home</a></span> <span class="item-title"><a href="{{url_for('root')}}">Home</a></span>
</div> </article>
{% if items %} {% if items %}
{% for item in items %} {% for item in items %}
<div class="readable-item <article class="
{%- if not item.active %} strikethru{% endif %} {%- if not item.active %} strikethru{% endif %}
{%- if item.is_hidden %} fade{% endif -%} {%- if item.is_hidden %} fade{% endif -%}
" id="{{item.source}}-{{item.id}}"> " id="{{item.source}}-{{item.id}}">
@ -173,30 +173,30 @@ var doAction = function (source, itemid, action) {
</span> </span>
{% endif %} {% endif %}
</div> </article>
{% endfor %} {% endfor %}
{% if pager_prev or pager_next %} {% if pager_prev or pager_next %}
<div class="readable-item center"> <article class="center">
<span class="item-title"> <span class="item-title">
<a {% if pager_prev -%} href="{{pager_prev}}" {%- endif %}>Prev</a> | <a {% if pager_next -%} href="{{pager_next}}" {%- endif %}>Next</a> <a {% if pager_prev -%} href="{{pager_prev}}" {%- endif %}>Prev</a> | <a {% if pager_next -%} href="{{pager_next}}" {%- endif %}>Next</a>
</span> </span>
</div> </article>
{% endif %} {% endif %}
<div class="readable-item"> <article>
<div style="text-align:center;"> <div style="text-align:center;">
<button onclick="javascript:mdeactivate({{ mdeac|safe }})">Deactivate All</button> <button onclick="javascript:mdeactivate({{ mdeac|safe }})">Deactivate All</button>
</div> </div>
</div> </article>
{# if items #} {# if items #}
{% else %} {% else %}
<div class="readable-item center"> <article class="center">
<span class="item-title">Feed is empty</span> <span class="item-title">Feed is empty</span>
</div> </article>
{% endif %} {% endif %}
</div> </main>
</body> </body>
</html> </html>

View File

@ -4,11 +4,11 @@
<title>Intake</title> <title>Intake</title>
<link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwgAADsIBFShKgAAAABh0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMS41ZEdYUgAAAGFJREFUOE+lkFEKwDAIxXrzXXB3ckMm9EnAV/YRCxFCcUXEL3Jc77NDjpDA/VGL3RFWYEICfeGC8oQc9IPuCAnQDcoRVmBCAn3hgvKEHPSD7ggJ0A3KEVZgQgJ94YLSJ9YDUzNGDXGZ/JEAAAAASUVORK5CYII="> <link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwgAADsIBFShKgAAAABh0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMS41ZEdYUgAAAGFJREFUOE+lkFEKwDAIxXrzXXB3ckMm9EnAV/YRCxFCcUXEL3Jc77NDjpDA/VGL3RFWYEICfeGC8oQc9IPuCAnQDcoRVmBCAn3hgvKEHPSD7ggJ0A3KEVZgQgJ94YLSJ9YDUzNGDXGZ/JEAAAAASUVORK5CYII=">
<style> <style>
div#wrapper { main {
max-width: 700px; max-width: 700px;
margin: 0 auto; margin: 0 auto;
} }
.readable-item { article {
border: 1px solid black; border-radius: 6px; border: 1px solid black; border-radius: 6px;
padding: 5px; padding: 5px;
margin-bottom: 20px; margin-bottom: 20px;
@ -17,7 +17,7 @@ div#wrapper {
.item-title { .item-title {
font-size: 1.4em; font-size: 1.4em;
} }
.readable-item img { article img {
max-width: 100%; max-width: 100%;
} }
button, summary { button, summary {
@ -32,9 +32,9 @@ summary:focus {
</style> </style>
</head> </head>
<body> <body>
<div id="wrapper"> <main>
<div class="readable-item"> <article>
<details open> <details open>
<summary><span class="item-title">Channels</span></summary> <summary><span class="item-title">Channels</span></summary>
{% if not channels %} {% if not channels %}
@ -46,9 +46,9 @@ summary:focus {
{% endif %} {% endif %}
<p><a href="{{ url_for('channels_edit') }}">Edit channels</a></p> <p><a href="{{ url_for('channels_edit') }}">Edit channels</a></p>
</details> </details>
</div> </article>
<div class="readable-item"> <article>
<details open> <details open>
<summary><span class="item-title">Sources</span></summary> <summary><span class="item-title">Sources</span></summary>
{% if not sources %} {% if not sources %}
@ -59,9 +59,9 @@ summary:focus {
{% endfor %} {% endfor %}
{% endif %} {% endif %}
</details> </details>
</div> </article>
<div class="readable-item"> <article>
<details open> <details open>
<summary><span class="item-title">Add item</span></summary> <summary><span class="item-title">Add item</span></summary>
<form action="add" method="post"> <form action="add" method="post">
@ -90,8 +90,8 @@ summary:focus {
<input type="submit" value="Add"> <input type="submit" value="Add">
</form> </form>
</details> </details>
</div> </article>
</div> </main>
</body> </body>
</html> </html>