Skip to content

Commit 4b5d786

Browse files
Michael BirdMichael Bird
authored andcommitted
CSS printing tweaks.
1 parent 0645bc6 commit 4b5d786

File tree

4 files changed

+57
-54
lines changed

4 files changed

+57
-54
lines changed

cyphercore/static/cyphercore/css/shared.css

Lines changed: 24 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,6 @@ body {
44
margin-top: 3rem;
55
}
66

7-
h1, h2, h3, h4, h5, h6 {
8-
break-after: avoid;
9-
page-break-after: avoid;
10-
}
117
h1 {
128
font-size: 2.5rem;
139
font-variant: small-caps;
@@ -79,11 +75,6 @@ ul {
7975
padding-left: 2rem;
8076
}
8177

82-
.avoid-break {
83-
break-inside: avoid;
84-
page-break-inside: avoid;
85-
}
86-
8778
.breadcrumbs {
8879
display: block;
8980
font-size: 1.5rem;
@@ -92,21 +83,10 @@ ul {
9283
padding-top: 1rem;
9384
}
9485

95-
.breakbefore {
96-
break-before: always;
97-
page-break-before: always;
98-
}
99-
100-
.breakafter {
101-
break-after: always;
102-
page-break-after: always;
103-
}
104-
10586
.bubble-item {
10687
background-color: lightgray;
10788
border: 1px solid black;
10889
border-radius: 3px;
109-
font-size: 1.3rem;
11090
line-height: 2.5rem;
11191
margin: 0 .5rem;
11292
padding: .2rem 1rem;
@@ -171,12 +151,32 @@ ul {
171151
padding: 0;
172152
}
173153

174-
.breadcrumbs {
175-
display: none;
154+
h1, h2, h3, h4, h5, h6 {
155+
break-after: avoid;
156+
page-break-after: avoid;
176157
}
177158

178-
.compact {
179-
font-size: smaller;
159+
html {
160+
font-size: 50%;
161+
}
162+
163+
.avoid-break {
164+
break-inside: avoid;
165+
page-break-inside: avoid;
166+
}
167+
168+
.breakbefore {
169+
break-before: always;
170+
page-break-before: always;
171+
}
172+
173+
.breakafter {
174+
break-after: always;
175+
page-break-after: always;
176+
}
177+
178+
.breadcrumbs {
179+
display: none;
180180
}
181181

182182
.container {

cyphercore/templates/cyphercore/base_character_detail.html

Lines changed: 23 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,9 @@
1010
#equipment { display: none; }
1111
#cyphers { display: none; }
1212
#artifacts { display: none; }
13+
#recursion { break-before: avoid; page-break-before: avoid; }
14+
{% else %}
15+
.recursion { break-before: always; page-break-before: always; }
1316
{% endif %}
1417
{% if not character.portrait_link %}
1518
#picture-frame { display: none; }
@@ -36,7 +39,7 @@ <h1>{{ character.name }}</h1>
3639
</section>
3740
<!-- Stat Pools -->
3841
<section class="stat-pools" class="avoid-break">
39-
<div class="row compact">
42+
<div class="row">
4043
<div class="four columns">
4144
<strong>Might</strong>
4245
</div>
@@ -47,7 +50,7 @@ <h1>{{ character.name }}</h1>
4750
<strong>Intellect</strong>
4851
</div>
4952
</div>
50-
<div class="row compact">
53+
<div class="row">
5154
<div class="two columns">
5255
Pool:
5356
</div>
@@ -67,7 +70,7 @@ <h1>{{ character.name }}</h1>
6770
{{ character.intellect_pool }} ({{ character.intellect_current }}*)
6871
</div>
6972
</div>
70-
<div class="row compact">
73+
<div class="row">
7174
<div class="two columns">
7275
Edge:
7376
</div>
@@ -87,16 +90,16 @@ <h1>{{ character.name }}</h1>
8790
{{ character.intellect_edge }}
8891
</div>
8992
</div>
90-
<div class="row compact">
91-
<div class="twelve columns compact">
93+
<div class="row">
94+
<div class="twelve columns">
9295
*Adjusted value based on Equipment and other factors
9396
</div>
9497
</div>
9598
<hr />
9699
</section>
97100
<!-- Other Stats -->
98101
<section id="other-stats" class="avoid-break">
99-
<div class="row compact">
102+
<div class="row">
100103
<div class="two columns">
101104
<strong>Cyper Limit:</strong>
102105
</div>
@@ -117,7 +120,7 @@ <h1>{{ character.name }}</h1>
117120
</div>
118121
</div>
119122
{% block recursable_stats %}
120-
<div class="row compact">
123+
<div class="row">
121124
<div class="two columns">
122125
<strong>Armor:</strong>
123126
</div>
@@ -142,7 +145,7 @@ <h1>{{ character.name }}</h1>
142145
</section>
143146
<!-- Recovery & Damage Track -->
144147
<section id="recovery-damage" class="avoid-break">
145-
<div class="row compact">
148+
<div class="row">
146149
<div class="two columns">
147150
<strong>Recovery:</strong>
148151
</div>
@@ -162,7 +165,7 @@ <h1>{{ character.name }}</h1>
162165
<span {% if character.ten_hours %}class="strikethrough"{% endif %}>10 Hr</span>
163166
</div>
164167
</div>
165-
<div class="row compact">
168+
<div class="row">
166169
<div class="two columns">
167170
<strong>Dmg. Track:</strong>
168171
</div>
@@ -208,7 +211,7 @@ <h2>Skills</h2>
208211
<!-- Base Abilities and Characteristics -->
209212
<section id="base-abilities" class="avoid-break">
210213
<h2>Base Abiliites &amp; Characteristics</h2>
211-
<div class="compact">
214+
<div>
212215
<h3>Type:</h3>
213216
<div class="indent">{{ character.type.base_abilities|linebreaks }}</div>
214217
<h3>Descriptor:</h3>
@@ -225,45 +228,45 @@ <h2>Special Abilities</h2>
225228
{% for item in character.abilities.all %}
226229
<div class="avoid-break">
227230
<h3>{{ item.name }} ({{ item.usage }}; Cost: {{ item.cost }})</h3>
228-
<div class="compact indent">{{ item.description|linebreaks }}</div>
231+
<div class="indent">{{ item.description|linebreaks }}</div>
229232
</div>
230233
{% endfor %}
231234
</div>
232235
<hr />
233236
</section>
234237
<!-- Cyphers -->
235-
<section id="cyphers">
238+
<section id="cyphers" class="avoid-break">
236239
<h2>Cyphers</h2>
237240
<div class="row">
238241
{% for item in character.charactercypher_set.all %}
239-
<h3>{{ item.cypher.name }} (Level {{ item.level }})</h3>
240-
<div class="compact indent">
241-
{{ item.appearance }} {{ item.cypher.effect }}
242+
<div class="avoid-break">
243+
<h3>{{ item.cypher.name }} (Level {{ item.level }})</h3>
244+
<div class="indent">{{ item.appearance }} {{ item.cypher.effect }}</div>
242245
</div>
243246
{% endfor %}
244247
</div>
245248
<hr />
246249
</section>
247250
<!-- Artifacts -->
248-
<section id="artifacts">
251+
<section id="artifacts" class="avoid-break">
249252
<h2>Artifacts</h2>
250253
<div class="row">
251254
{% for item in character.characterartifact_set.all %}
252255
<h3>{{ item.artifact.name }} (Level {{ item.level }}; Depletion: {{ item.artifact.depletion }})</h3>
253-
<div class="compact indent">
256+
<div class="indent">
254257
{{ item.artifact.form }} {{ item.artifact.effect }}
255258
</div>
256259
{% endfor %}
257260
</div>
258261
<hr />
259262
</section>
260263
<!-- Notes -->
261-
<section id="notes">
264+
<section id="notes" class="avoid-break">
262265
<div class="row">
263266
<h2>Notes</h2>
264-
<div class="compact indent">{{ character.notes|linebreaks }}</div>
267+
<div class="indent">{{ character.notes|linebreaks }}</div>
265268
</div>
266-
<hr class="no-print" />
269+
<hr />
267270
</section>
268271
{% block recursions %}
269272
{% endblock %}

cyphercore/templates/cyphercore/base_equipment_list.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<span class="breadcrumbs"><a href="../">Index</a> | Equipment List</span>
55
<h1>{% block header_text %}Cypher Core: Equipment{% endblock %}</h1>
66
<hr/>
7-
<table class="compact">
7+
<table>
88
<tr>
99
<th>Item Name</th>
1010
<th>Type</th>

strange/templates/strange/character_detail.html

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -12,11 +12,11 @@
1212
<!-- Character Recursions -->
1313
<section id="recursions">
1414
{% for item in character.recursion_set.all %}
15-
<div class="breakbefore row">
15+
<div class="recursion row">
1616
<h1>Recursion: {{ item.name }}</h1>
1717
<!-- Recursion Stat Pools -->
1818
<section class="stat-pools avoid-break">
19-
<div class="row compact">
19+
<div class="row">
2020
<div class="four columns">
2121
<strong>Might</strong>
2222
</div>
@@ -27,7 +27,7 @@ <h1>Recursion: {{ item.name }}</h1>
2727
<strong>Intellect</strong>
2828
</div>
2929
</div>
30-
<div class="row compact">
30+
<div class="row">
3131
<div class="two columns">
3232
Pool:
3333
</div>
@@ -47,7 +47,7 @@ <h1>Recursion: {{ item.name }}</h1>
4747
{{ character.intellect_pool|add:item.intellect_pool_adjust }} ({{ character.intellect_current|add:item.intellect_pool_adjust }}*)
4848
</div>
4949
</div>
50-
<div class="row compact">
50+
<div class="row">
5151
<div class="two columns">
5252
Edge:
5353
</div>
@@ -67,14 +67,14 @@ <h1>Recursion: {{ item.name }}</h1>
6767
{{ character.intellect_edge|add:item.intellect_edge_adjust }}
6868
</div>
6969
</div>
70-
<div class="row compact">
71-
<div class="twelve columns compact">
70+
<div class="row">
71+
<div class="twelve columns">
7272
*Adjusted value based on Equipment and other factors
7373
</div>
7474
</div>
7575
<hr />
7676
<!-- Recursion Other Stats -->
77-
<div class="row compact">
77+
<div class="row">
7878
<div class="two columns">
7979
<strong>Armor:</strong>
8080
</div>
@@ -92,15 +92,15 @@ <h1>Recursion: {{ item.name }}</h1>
9292
</div>
9393
</section>
9494
<h2>Focus: {{ item.focus.name }}</h2>
95-
<div class="compact indent">{{ item.focus.other_details|linebreaks }}</div>
95+
<div class="indent">{{ item.focus.other_details|linebreaks }}</div>
9696
<!-- Recursion Special Abilities -->
9797
<section class="recursion-special-abilities">
9898
<h2>Special Abilities</h2>
9999
<div class="row">
100100
{% for ability in item.abilities.all %}
101101
<div class="avoid-break">
102102
<h3>{{ ability.name }} ({{ ability.usage }}; Cost: {{ ability.cost }})</h3>
103-
<div class="compact indent">{{ ability.description|linebreaks }}</div>
103+
<div class="indent">{{ ability.description|linebreaks }}</div>
104104
</div>
105105
{% endfor %}
106106
</div>

0 commit comments

Comments
 (0)