Skip to content

Commit 8c0c2f0

Browse files
StartAutomatingStartAutomating
committed
style: Site Updates ( Fixes #333 )
More backgrounds and layout adjustments
1 parent 0b25b2b commit 8c0c2f0

File tree

2 files changed

+114
-72
lines changed

2 files changed

+114
-72
lines changed

‎psturtle.com/config.ps1‎

Lines changed: 75 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,14 @@ if ($psScriptRoot -and -not $site.PSScriptRoot) {
3333
}
3434
#endregion Core
3535

36+
#region Exclude
37+
if ($site.Exclude -isnot [Collections.IDictionary] ) {
38+
$site.Exclude = [Ordered]@{}
39+
}
40+
$site.Exclude.Wildcards = '*.functions.ps1', '*.function.ps1', '*.filters.ps1`', '*.filter.ps1', '*.turtle.ps1'
41+
$site.Exclude.Patterns = 'build\\.[^\\.]+\\.ps1$'
42+
#endregion Exclude
43+
3644
#region _
3745
if ($site.PSScriptRoot) {
3846
$underbarItems =
@@ -120,6 +128,10 @@ $Site.Logo =
120128
{
121129
turtle SierpinskiTriangle 42 4
122130
}
131+
132+
{
133+
turtle rotate -90 TurtleMonotile 42
134+
}
123135
)
124136

125137
$site.Logo = . ($site.Logo | Get-Random)
@@ -133,24 +145,21 @@ $site.Taskbar = [Ordered]@{
133145
'BlueSky' = 'https://bsky.app/profile/psturtle.com'
134146
'GitHub' = 'https://github.com/PowerShellWeb/Turtle'
135147
'RSS' = 'https://psturtle.com/RSS/index.rss'
136-
'Help' = @(
137-
if ($site.Module) {
138-
"<h3>Installing</h3>"
139-
"<pre><code>Install-Module $($site.Module)</code></pre>"
140-
"<h3>Updating</h3>"
141-
"<pre><code>Install-Module $($site.Module) -Force</code></pre>"
142-
"<h3>Importing</h3>"
143-
"<pre><code>Import-Module $($site.Module)</code></pre>"
144-
"<h3>Basics</h3>"
145-
"<pre><code>turtle polygon 42 6</code></pre>"
146-
"$(turtle polygon 42 6)"
147-
"<h3><a href='/Commands/Get-Turtle'>More Examples</a></h3>"
148+
'Help' = 'https://psturtle.com/Commands/Get-Turtle'
148149
}
149-
) -join [Environment]::NewLine
150-
'Settings' = @(
151-
. $site.includes.SelectPalette
152-
. $site.includes.GetRandomPalette
153-
)
150+
151+
$site.Footer = @(
152+
. $site.includes.SelectPalette
153+
. $site.includes.GetRandomPalette
154+
)
155+
156+
$Site.FixFooter = [Ordered]@{
157+
'width' = '90vw'
158+
'margin-left' = '5vw'
159+
'margin-right' = '5vw'
160+
'height' = '5vh'
161+
'top' = '92.5vh'
162+
'z-index' = 100
154163
}
155164

156165
<#$site.HeaderMenu = [Ordered]@{
@@ -317,6 +326,55 @@ $sitebackgrounds = @(
317326
{
318327
turtle FlowerPetal
319328
}
329+
330+
{
331+
turtle (
332+
@(
333+
'circlearc', 21, -60,
334+
'rotate',60,
335+
'forward',42 * 6
336+
337+
'rotate', 30
338+
) * 12
339+
)
340+
}
341+
342+
{
343+
turtle StarFlower
344+
}
345+
346+
{
347+
$spokes = Get-Random -Min 3 -Max 13
348+
$rings = Get-Random -Min 3 -Max (13 * 3)
349+
turtle web 42 $spokes $rings morph @(
350+
turtle web 42 $spokes $rings
351+
turtle rotate (
352+
Get-Random -Max 360
353+
) web 42 $spokes $rings
354+
turtle web 42 $spokes $rings
355+
)
356+
}
357+
358+
{
359+
Turtle @(
360+
'CircleArc',42, -90,
361+
'Rotate', 90 * 4
362+
)
363+
}
364+
365+
{
366+
Turtle @(
367+
'CircleArc',42, -60,
368+
'Rotate', 60 * 6
369+
)
370+
}
371+
372+
{
373+
Turtle @(
374+
'CircleArc',42, -45,
375+
'Rotate', 45 * 8
376+
)
377+
}
320378
)
321379

322380
$siteBackground = $sitebackgrounds | Get-Random

‎psturtle.com/layout.ps1‎

Lines changed: 39 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ param(
1616
[string]
1717
$PaletteName = $(
1818
if ($Site -and $Site['PaletteName']) { $Site['PaletteName'] }
19-
else { 'Konsolas' }
19+
else { 'Konsolas' }
2020
),
2121

2222
# The Google Font name
@@ -61,14 +61,14 @@ param(
6161
),
6262

6363
# The footer menu.
64-
[Collections.IDictionary]
65-
$FooterMenu = $(
66-
if ($page -and $page.'FooterMenu' -is [Collections.IDictionary]) {
67-
$page.'FooterMenu'
68-
} elseif ($Site -and $site.'FooterMenu' -is [Collections.IDictionary]) {
69-
$site.'FooterMenu'
64+
[PSObject[]]
65+
$Footer = @(
66+
if ($page.Footer) {
67+
$page.Footer
68+
} elseif ($Site -and $site.Footer) {
69+
$site.Footer
7070
} else {
71-
[Ordered]@{}
71+
''
7272
}
7373
)
7474
)
@@ -145,32 +145,18 @@ $(
145145
if ($HeaderMenu) {
146146
# If the device is in landscape mode, use larger padding and gaps
147147
"@media (orientation: landscape) {"
148-
".header-menu { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap: 0.5em }"
148+
".header-menu { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap: 0.5em; position: sticky; top: 0px}"
149149
".header-menu-item { text-align: center; padding: 0.5em; }"
150150
"}"
151151
152152
# If the device is in portrait mode, use smaller padding and gaps
153153
"@media (orientation: portrait) {"
154-
".header-menu { display: grid; grid-template-columns: repeat(auto-fit, minmax(66px, 1fr)); gap: 0.25em }"
154+
".header-menu { display: grid; grid-template-columns: repeat(auto-fit, minmax(66px, 1fr)); gap: 0.25em; position: sticky; top: 0px }"
155155
".header-menu-item { text-align: center; padding: 0.25em; }"
156156
"}"
157157
}
158158
)
159159
160-
$(
161-
if ($FooterMenu) {
162-
"@media (orientation: landscape) {"
163-
".footer-menu { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap: 0.5em }"
164-
".footer-menu-item { text-align: center; padding: 0.5em; }"
165-
"}"
166-
167-
"@media (orientation: portrait) {"
168-
".footer-menu { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap: 0.25em }"
169-
".footer-menu-item { text-align: center; padding: 0.25em; }"
170-
"}"
171-
}
172-
)
173-
174160
.logo {
175161
display: inline;
176162
height: 4.2rem;
@@ -215,9 +201,8 @@ a:hover, a:focus {
215201
})
216202
}
217203
218-
.taskbar {
219-
float: right;
220-
position: absolute;
204+
.taskbar {
205+
position: sticky;
221206
top: 0; right: 0; z-index: 10;
222207
display: flex; flex-direction: row-reverse;
223208
align-content: right; align-items: flex-start;
@@ -315,18 +300,15 @@ $headerElements = @(
315300

316301
# Now we declare the body elements
317302
$bodyElements = @(
318-
# * The background layers
319-
320-
321-
303+
# * The background layers
322304
"<svg class='background backdrop-svg' id='background-svg' width='100%' height='100%'>"
323305
if ($page.Background -is [xml]) {
324306
$page.Background.OuterXml
325307
}
326308
elseif ($site.Background -is [xml]) {
327309
$site.Background.OuterXml
328310
}
329-
"</svg>"
311+
"</svg>"
330312
"<canvas id='background backdrop-canvas' width='0' height='0'></canvas>"
331313
if ($taskbar) {
332314
# * Our taskbar
@@ -346,15 +328,16 @@ $bodyElements = @(
346328
}
347329
}
348330
else { $taskbarItem.Key }
349-
if ($taskbarItem.Value -match '[<>]') {
331+
$taskBarContent = $taskbarItem.Value
332+
if ($taskBarContent -match '[<>]') {
350333
"<details>"
351334
"<summary>"
352335
$itemIconAndOrName
353-
"</summary>"
336+
"</summary>"
354337
$taskbarItem.Value
355338
"</details>"
356339
} else {
357-
"<a href='$($taskbarItem.Value)' class='icon-link' target='_blank'>"
340+
"<a href='$($taskBarContent)' class='icon-link' target='_blank'>"
358341
$itemIconAndOrName
359342
"</a>"
360343
}
@@ -406,27 +389,26 @@ $bodyElements = @(
406389
"</header>"
407390

408391
# * The main content
392+
409393
"<div class='main'>$outputHtml</div>"
410394

411-
# * The footer
412-
"<footer>"
413-
if ($FooterMenu) {
414-
"<style>"
415-
"@media (orientation: landscape) {"
416-
".footer-menu { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap: 1em }"
417-
".footer-menu-item { text-align: center; padding: 1em; }"
418-
"}"
419-
"@media (orientation: portrait) {"
420-
".footer-menu { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap: 0.5em }"
421-
".footer-menu-item { text-align: center; padding: 0.5em; }"
422-
"}"
423-
"</style>"
424-
"<nav class='footer-menu'>"
425-
foreach ($menuItem in $FooterMenu.GetEnumerator()) {
426-
"<a href='$($menuItem.Value)' class='footer-menu-item'>$([Web.HttpUtility]::HtmlEncode($menuItem.Key))</a>"
427-
}
428-
"</nav>"
395+
if ($page.FixFooter -or $site.FixFooter) {
396+
"<style>footer { position:fixed; $(
397+
@(
398+
foreach ($key in $site.FixFooter.Keys) {
399+
"${key}:$($site.FixFooter[$key])"
400+
}
401+
foreach ($key in $page.FixFooter.Keys) {
402+
"${key}:$($Page.FixFooter[$key])"
403+
}
404+
) -join ';'
405+
)
406+
}</style>"
429407
}
408+
409+
410+
# * The footer
411+
"<footer>"
430412
if ($Page.Footer) { $page.Footer -join [Environment]::NewLine }
431413
if ($Site.Footer) { $site.Footer -join [Environment]::NewLine }
432414
"</footer>"
@@ -436,7 +418,9 @@ $bodyElements = @(
436418
"<html>
437419
<head>
438420
<title>$(if ($page['Title']) { $page['Title'] } else { $Title })</title>
439-
$($headerElements -join [Environment]::NewLine)
421+
$($headerElements -join [Environment]::NewLine)
440422
</head>
441-
<body>$($bodyElements -join [Environment]::NewLine)</body>
423+
<body>
424+
$($bodyElements -join [Environment]::NewLine)
425+
</body>
442426
</html>"

0 commit comments

Comments
 (0)