Skip to content

Commit 2dfe0c7

Browse files
authored
[5.0] Cassiopeia add 14 modern system font stacks (#40124)
1 parent 323a799 commit 2dfe0c7

File tree

3 files changed

+112
-27
lines changed

3 files changed

+112
-27
lines changed

language/en-GB/tpl_cassiopeia.ini

Lines changed: 20 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,11 +15,29 @@ TPL_CASSIOPEIA_FLUID_LABEL="Layout"
1515
TPL_CASSIOPEIA_FONT_GROUP_LOCAL="Fonts from Folder"
1616
TPL_CASSIOPEIA_FONT_GROUP_WEB="Fonts from Web"
1717
TPL_CASSIOPEIA_FONT_LABEL="Fonts Scheme"
18-
TPL_CASSIOPEIA_FONT_NOTE_TEXT="Loading fonts from external sources might be against privacy regulations in some countries.<br>Loading fonts from a local folder might have a performance impact on your site."
18+
TPL_CASSIOPEIA_FONT_NOTE_TEXT="System fonts are the most performant although there may be small differences between operating systems.<br>Loading fonts from external sources might be against privacy regulations in some countries.<br>Loading fonts from a local folder might have a performance impact on your site."
19+
TPL_CASSIOPEIA_FONT_SYSTEM="System Fonts"
20+
TPL_CASSIOPEIA_FONT_SYSTEM_BODY="Body Font Stack"
21+
TPL_CASSIOPEIA_FONT_SYSTEM_HEADING="Heading Font Stack"
22+
TPL_CASSIOPEIA_FONT_SYSTEM_SELECT="Select System Fonts"
23+
TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_ANTIQUE="Antique"
24+
TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_CLASSICAL="Classical Humanist"
25+
TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_CODE="Monospace Code"
26+
TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_DIDONE="Didone"
27+
TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_GEOMETRIC="Geometric Humanist"
28+
TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_GROTESQUE="Neo-Grotesque"
29+
TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_HANDWRITTEN="Handwritten"
30+
TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_HUMANIST="Humanist"
31+
TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_INDUSTRIAL="Industrial"
32+
TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_MONOSPACE="Monospace Slab Serif"
33+
TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_OLDSTYLE="Old Style"
34+
TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_ROUNDED="Rounded Sans"
35+
TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_SLAB="Slab Serif"
36+
TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_TRANSITIONAL="Transitional"
1937
TPL_CASSIOPEIA_LOGO_LABEL="Logo"
2038
TPL_CASSIOPEIA_STATIC="Static"
2139
TPL_CASSIOPEIA_STICKY_LABEL="Sticky Header"
22-
TPL_CASSIOPEIA_TAGLINE_LABEL="Tagline"
2340
TPL_CASSIOPEIA_TAGLINE_DESC="Optional text to show as a subheading"
41+
TPL_CASSIOPEIA_TAGLINE_LABEL="Tagline"
2442
TPL_CASSIOPEIA_TITLE="Title (alternative to logo)"
2543
TPL_CASSIOPEIA_XML_DESCRIPTION="Continuing the space theme (Solarflare from 1.0, Milkyway from 1.5 and Protostar from 3.0), Cassiopeia is the Joomla 4 site template based on Bootstrap 5."

templates/cassiopeia/index.php

Lines changed: 39 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -58,6 +58,18 @@
5858
--cassiopeia-font-weight-normal: 400;
5959
--cassiopeia-font-weight-headings: 700;';
6060
}
61+
} elseif ($paramsFontScheme === 'system') {
62+
$fontStylesBody = $this->params->get('systemFontBody', '');
63+
$fontStylesHeading = $this->params->get('systemFontHeading', '');
64+
65+
if ($fontStylesBody) {
66+
$fontStyles = '--cassiopeia-font-family-body: ' . $fontStylesBody . ';
67+
--cassiopeia-font-weight-normal: 400;';
68+
}
69+
if ($fontStylesHeading) {
70+
$fontStyles .= '--cassiopeia-font-family-headings: ' . $fontStylesHeading . ';
71+
--cassiopeia-font-weight-headings: 700;';
72+
}
6173
} else {
6274
$wa->registerAndUseStyle('fontscheme.current', $paramsFontScheme, ['version' => 'auto'], ['media' => 'print', 'rel' => 'lazy-stylesheet', 'onload' => 'this.media=\'all\'']);
6375
$this->getPreloadManager()->preload($wa->getAsset('style', 'fontscheme.current')->getUri() . '?' . $this->getMediaVersion(), ['as' => 'style']);
@@ -113,6 +125,7 @@
113125
?>
114126
<!DOCTYPE html>
115127
<html lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>">
128+
116129
<head>
117130
<jdoc:include type="metas" />
118131
<jdoc:include type="styles" />
@@ -133,7 +146,7 @@
133146

134147
<?php if ($this->countModules('topbar')) : ?>
135148
<div class="container-topbar">
136-
<jdoc:include type="modules" name="topbar" style="none" />
149+
<jdoc:include type="modules" name="topbar" style="none" />
137150
</div>
138151
<?php endif; ?>
139152

@@ -178,58 +191,58 @@
178191
<?php endif; ?>
179192

180193
<?php if ($this->countModules('top-a', true)) : ?>
181-
<div class="grid-child container-top-a">
182-
<jdoc:include type="modules" name="top-a" style="card" />
183-
</div>
194+
<div class="grid-child container-top-a">
195+
<jdoc:include type="modules" name="top-a" style="card" />
196+
</div>
184197
<?php endif; ?>
185198

186199
<?php if ($this->countModules('top-b', true)) : ?>
187-
<div class="grid-child container-top-b">
188-
<jdoc:include type="modules" name="top-b" style="card" />
189-
</div>
200+
<div class="grid-child container-top-b">
201+
<jdoc:include type="modules" name="top-b" style="card" />
202+
</div>
190203
<?php endif; ?>
191204

192205
<?php if ($this->countModules('sidebar-left', true)) : ?>
193-
<div class="grid-child container-sidebar-left">
194-
<jdoc:include type="modules" name="sidebar-left" style="card" />
195-
</div>
206+
<div class="grid-child container-sidebar-left">
207+
<jdoc:include type="modules" name="sidebar-left" style="card" />
208+
</div>
196209
<?php endif; ?>
197210

198211
<div class="grid-child container-component">
199212
<jdoc:include type="modules" name="breadcrumbs" style="none" />
200213
<jdoc:include type="modules" name="main-top" style="card" />
201214
<jdoc:include type="message" />
202215
<main>
203-
<jdoc:include type="component" />
216+
<jdoc:include type="component" />
204217
</main>
205218
<jdoc:include type="modules" name="main-bottom" style="card" />
206219
</div>
207220

208221
<?php if ($this->countModules('sidebar-right', true)) : ?>
209-
<div class="grid-child container-sidebar-right">
210-
<jdoc:include type="modules" name="sidebar-right" style="card" />
211-
</div>
222+
<div class="grid-child container-sidebar-right">
223+
<jdoc:include type="modules" name="sidebar-right" style="card" />
224+
</div>
212225
<?php endif; ?>
213226

214227
<?php if ($this->countModules('bottom-a', true)) : ?>
215-
<div class="grid-child container-bottom-a">
216-
<jdoc:include type="modules" name="bottom-a" style="card" />
217-
</div>
228+
<div class="grid-child container-bottom-a">
229+
<jdoc:include type="modules" name="bottom-a" style="card" />
230+
</div>
218231
<?php endif; ?>
219232

220233
<?php if ($this->countModules('bottom-b', true)) : ?>
221-
<div class="grid-child container-bottom-b">
222-
<jdoc:include type="modules" name="bottom-b" style="card" />
223-
</div>
234+
<div class="grid-child container-bottom-b">
235+
<jdoc:include type="modules" name="bottom-b" style="card" />
236+
</div>
224237
<?php endif; ?>
225238
</div>
226239

227240
<?php if ($this->countModules('footer', true)) : ?>
228-
<footer class="container-footer footer full-width">
229-
<div class="grid-child">
230-
<jdoc:include type="modules" name="footer" style="none" />
231-
</div>
232-
</footer>
241+
<footer class="container-footer footer full-width">
242+
<div class="grid-child">
243+
<jdoc:include type="modules" name="footer" style="none" />
244+
</div>
245+
</footer>
233246
<?php endif; ?>
234247

235248
<?php if ($this->params->get('backTop') == 1) : ?>
@@ -240,4 +253,5 @@
240253

241254
<jdoc:include type="modules" name="debug" style="none" />
242255
</body>
256+
243257
</html>

templates/cassiopeia/templateDetails.xml

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -94,6 +94,9 @@
9494
default="0"
9595
>
9696
<option value="0">JNONE</option>
97+
<group label="TPL_CASSIOPEIA_FONT_SYSTEM">
98+
<option value="system">TPL_CASSIOPEIA_FONT_SYSTEM_SELECT</option>
99+
</group>
97100
<group label="TPL_CASSIOPEIA_FONT_GROUP_LOCAL">
98101
<option value="media/templates/site/cassiopeia/css/global/fonts-local_roboto.css">Roboto (local)</option>
99102
</group>
@@ -103,6 +106,56 @@
103106
</group>
104107
</field>
105108

109+
<field
110+
name="systemFontBody"
111+
type="list"
112+
label="TPL_CASSIOPEIA_FONT_SYSTEM_BODY"
113+
default=""
114+
validate="options"
115+
showon="useFontScheme:system"
116+
>
117+
<option value="">JSELECT</option>
118+
<option value="Charter, 'Bitstream Charter', 'Sitka Text', Cambria, serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_TRANSITIONAL</option>
119+
<option value="'Iowan Old Style', 'Palatino Linotype', 'URW Palladio L', P052, serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_OLDSTYLE</option>
120+
<option value="Seravek, 'Gill Sans Nova', Ubuntu, Calibri, 'DejaVu Sans', source-sans-pro, sans-serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_HUMANIST</option>
121+
<option value="Avenir, 'Avenir Next LT Pro', Montserrat, Corbel, 'URW Gothic', source-sans-pro, sans-serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_GEOMETRIC</option>
122+
<option value="Optima, Candara, 'Noto Sans', source-sans-pro, sans-serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_CLASSICAL</option>
123+
<option value="Inter, Roboto, 'Helvetica Neue', 'Arial Nova', 'Nimbus Sans', Arial, sans-serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_GROTESQUE</option>
124+
<option value="'Nimbus Mono PS', 'Courier New', 'Cutive Mono', monospace">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_MONOSPACE</option>
125+
<option value="ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_CODE</option>
126+
<option value="Bahnschrift, 'DIN Alternate', 'Franklin Gothic Medium', 'Nimbus Sans Narrow', sans-serif-condensed, sans-serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_INDUSTRIAL</option>
127+
<option value="ui-rounded, 'Hiragino Maru Gothic ProN', Quicksand, Comfortaa, Manjari, 'Arial Rounded MT Bold', Calibri, source-sans-pro, sans-serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_ROUNDED</option>
128+
<option value="Rockwell, 'Rockwell Nova', 'Roboto Slab', 'DejaVu Serif', 'Sitka Small', serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_SLAB</option>
129+
<option value="Superclarendon, 'Bookman Old Style', 'URW Bookman', 'URW Bookman L', 'Georgia Pro', Georgia, serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_ANTIQUE</option>
130+
<option value="Didot, 'Bodoni MT', 'Noto Serif Display', 'URW Palladio L', P052, Sylfaen, serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_DIDONE</option>
131+
<option value="'Segoe Print', 'Bradley Hand', Chilanka, TSCu_Comic, casual, cursive">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_HANDWRITTEN</option>
132+
</field>
133+
134+
<field
135+
name="systemFontHeading"
136+
type="list"
137+
label="TPL_CASSIOPEIA_FONT_SYSTEM_HEADING"
138+
default=""
139+
validate="options"
140+
showon="useFontScheme:system"
141+
>
142+
<option value="">JSELECT</option>
143+
<option value="Charter, 'Bitstream Charter', 'Sitka Text', Cambria, serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_TRANSITIONAL</option>
144+
<option value="'Iowan Old Style', 'Palatino Linotype', 'URW Palladio L', P052, serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_OLDSTYLE</option>
145+
<option value="Seravek, 'Gill Sans Nova', Ubuntu, Calibri, 'DejaVu Sans', source-sans-pro, sans-serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_HUMANIST</option>
146+
<option value="Avenir, 'Avenir Next LT Pro', Montserrat, Corbel, 'URW Gothic', source-sans-pro, sans-serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_GEOMETRIC</option>
147+
<option value="Optima, Candara, 'Noto Sans', source-sans-pro, sans-serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_CLASSICAL</option>
148+
<option value="Inter, Roboto, 'Helvetica Neue', 'Arial Nova', 'Nimbus Sans', Arial, sans-serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_GROTESQUE</option>
149+
<option value="'Nimbus Mono PS', 'Courier New', 'Cutive Mono', monospace">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_MONOSPACE</option>
150+
<option value="ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_CODE</option>
151+
<option value="Bahnschrift, 'DIN Alternate', 'Franklin Gothic Medium', 'Nimbus Sans Narrow', sans-serif-condensed, sans-serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_INDUSTRIAL</option>
152+
<option value="ui-rounded, 'Hiragino Maru Gothic ProN', Quicksand, Comfortaa, Manjari, 'Arial Rounded MT Bold', Calibri, source-sans-pro, sans-serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_ROUNDED</option>
153+
<option value="Rockwell, 'Rockwell Nova', 'Roboto Slab', 'DejaVu Serif', 'Sitka Small', serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_SLAB</option>
154+
<option value="Superclarendon, 'Bookman Old Style', 'URW Bookman', 'URW Bookman L', 'Georgia Pro', Georgia, serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_ANTIQUE</option>
155+
<option value="Didot, 'Bodoni MT', 'Noto Serif Display', 'URW Palladio L', P052, Sylfaen, serif">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_DIDONE</option>
156+
<option value="'Segoe Print', 'Bradley Hand', Chilanka, TSCu_Comic, casual, cursive">TPL_CASSIOPEIA_FONT_SYSTEM_STACK_SYSTEM_HANDWRITTEN</option>
157+
</field>
158+
106159
<field
107160
name="noteFontScheme"
108161
type="note"

0 commit comments

Comments
 (0)