iou1name/Titivillus
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

adjust header and chatPane height

Browse Source
This commit is contained in:
iou1name 2018-09-30 01:30:50 -04:00
parent ba28cb94e1
commit eb4ccddb37
5 changed files with 24 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
jinja2/base.html
View File

@ -14,14 +14,14 @@
</head>
<body>
<div id="globalWrapper">
<ul id="header" class="header" style="{% if request.session.get("hide_header") == True %}display:none;{% else %}display:initial;{% endif %}">
<li><a onclick="toggle_header();" href="javascript:void(0);">↑</a></li>
<li><a href="{{ url('homepage:index') }}">Home</a></li>
<div id="header" class="header" style="{% if request.session.get("hide_header") == True %}display:none;{% else %}display:flex;{% endif %}">
<span><a onclick="toggle_header();" href="javascript:void(0);">↑</a></span>
<span><a href="{{ url('homepage:index') }}">Home</a></span>
{% block header %}{% endblock %}
</ul>
<ul id="headerHidden" class="header" style="{% if request.session.get("hide_header") == True %}display:initial;{% else %}display:none;{% endif %}">
<li><a onclick="toggle_header();" href="javascript:void(0);">↓</a></li>
</ul>
</div>
<div id="headerHidden" class="header" style="{% if request.session.get("hide_header") == True %}display:initial;{% else %}display:none;{% endif %}">
<span><a onclick="toggle_header();" href="javascript:void(0);">↓</a></span>
</div>
<ul id="alerts">
{% for message in get_messages(request) %}
<li{% if message.tags %} class="{{ message.tags }}"{% endif %}>{{ message }}</li>

10
quest/jinja2/quest/quest.html
View File

@ -7,7 +7,7 @@
{% endif %}
<script>
const quest_id = {{ quest.id }};
const page_num = {{ page_num }};
const page_num = '{{ page_num }}';
const SCRIPT_NAME = '{{ request.META["SCRIPT_NAME"] }}';
const anon_name = '{{ quest.anon_name }}';
</script>
@ -19,9 +19,9 @@
{% endblock %}
{% block header %}
{% if request.user == quest.owner %}
<li><a href="{{ url('quest:edit_quest', args=[quest_id]) }}">Edit Quest</a></li>
<span><a href="{{ url('quest:edit_quest', args=[quest_id, page_num]) }}">Edit Quest</a></span>
{% endif %}
<li>
<span>
<select onChange="window.location.href=this.value">
<optgroup label="Pages">
{% for page in pages %}
@ -36,8 +36,8 @@
</optgroup>
{% endif %}
</select>
</li>
<li id="toggleChat"><a onclick="toggle_chat()" href="javascript:void(0);">{% if request.session.get("hide_chat") == True %}←{% else %}→{% endif %}</a></li>
</span>
<span id="toggleChat"><a onclick="toggle_chat()" href="javascript:void(0);">{% if request.session.get("hide_chat") == True %}←{% else %}→{% endif %}</a></span>
{% endblock %}
{% block content %}
<div id="questPane" style="width:{% if request.session.get("hide_chat") == True %}100%{% else %}70%{% endif %};">

6
quest/static/quest.css
View File

@ -8,6 +8,10 @@ h3 {
margin-bottom: 0.5em;
}
#toggleChat {
margin-left: auto;
}
#questPane {
float: left;
box-sizing: border-box;
@ -111,8 +115,8 @@ h3 {
}
#chatPane {
height: calc(100% - var(--header-height));
width: 30%;
height: calc(100vh - 2em);
right: 0;
position: fixed;
display: flex;

12
static/base.css
View File

@ -1,7 +1,3 @@
:root {
--header-height: 1.25em;
}
body {
margin: 0;
}
@ -18,13 +14,15 @@ body {
margin: 0;
padding: 0;
width: 100%;
height: var(--header-height);
height: 2em;
list-style-type: none;
background-color: #dddddd;
display: flex;
align-items: center;
}
.header li {
display: inline;
.header span {
padding-right: 0.25em;
}
.header a {

4
static/base.js
View File

@ -6,13 +6,13 @@ function toggle_cookie(cookie, state) {
xhr.send(cookie + '=' + state);
}
function toggle_header() {
if (document.getElementById('header').style.display == 'initial') {
if (document.getElementById('header').style.display == 'flex') {
document.getElementById('header').style.display = 'none';
document.getElementById('headerHidden').style.display = 'initial';
toggle_cookie('hide_header', 'on');
}
else {
document.getElementById('header').style.display = 'initial';
document.getElementById('header').style.display = 'flex';
document.getElementById('headerHidden').style.display = 'none';
toggle_cookie('hide_header', 'off');
}