Cutieguwu/cutieguwu-site
1
0
Fork 0
Code Issues 10 Pull Requests Projects 1 Releases Activity

Compare commits

base: Cutieguwu:1f8ff1ae10f9c887442d235d44253f26020c1811
Branches Tags
Cutieguwu:v2.0.0-alpha Cutieguwu:main
..
compare: Cutieguwu:131b5f5e55a7e3ca510a8a2b94e1504b51364df8
Branches Tags
Cutieguwu:v2.0.0-alpha Cutieguwu:main

2 Commits
1f8ff1ae10 ... 131b5f5e55

Author SHA1 Message Date
Cutieguwu
131b5f5e55 Add Footer as an include. 2025-07-23 18:30:35 -04:00
Cutieguwu
bfcbd971ea Add var for leaf border; Switch to Liberation Sans; Scale Quick Links. 2025-07-23 18:25:48 -04:00
12 changed files with 128 additions and 91 deletions
Expand all files Collapse all files

43
src/acknowledgements.html
View File

@@ -5,28 +5,31 @@
<title>Acknowledgements | Cutieguwu</title> <title>Acknowledgements | Cutieguwu</title>
<include src="includes/meta.html" /> <include src="includes/meta.html" />
</head> </head>
<body class="viewport"> <body>
<nav class="pane_nav"> <div class="viewport">
<include src="includes/nav_logo.html" /> <nav class="pane_nav">
<include src="includes/nav_menu.html" /> <include src="includes/nav_logo.html" />
<div class="location"> <include src="includes/nav_menu.html" />
<p class="location_header">You are here:</p> <div class="location">
<p class="location_page">Acknowledgements</p> <p class="location_header">You are here:</p>
<p class="location_page">Acknowledgements</p>
</div>
<include src="includes/nav_quick_links.html" />
</nav>
<div class="pane_main">
<p>There are currently no acknowledgements</p>
<p>In terms of security, hopefully that means I'm doing a good-ish job.</p>
<p>
I will get my thanks to various open projects in here in time, but I'm still
busy getting the basics handled.
</p>
</div>
<div class="pane_spacer">
<div class="spacer_container"><p>#AD</p></div>
<div class="spacer_container"><p>#AD</p></div>
</div> </div>
<include src="includes/nav_quick_links.html" />
</nav>
<div class="pane_main">
<p>There are currently no acknowledgements</p>
<p>In terms of security, hopefully that means I'm doing a good-ish job.</p>
<p>
I will get my thanks to various open projects in here in time, but I'm still busy
getting the basics handled.
</p>
</div>
<div class="pane_spacer">
<div class="spacer_container"><p>#AD</p></div>
<div class="spacer_container"><p>#AD</p></div>
</div> </div>
<include src="includes/footer.html" />
<include src="includes/scripts.html" /> <include src="includes/scripts.html" />
</body> </body>
</html> </html>

1
src/includes/footer.html Normal file
View File

@@ -0,0 +1 @@
<p class="footer">Made with love in Canada 🇨🇦.</p>

35
src/index.html
View File

@@ -5,24 +5,27 @@
<title>Home | Cutieguwu</title> <title>Home | Cutieguwu</title>
<include src="includes/meta.html" /> <include src="includes/meta.html" />
</head> </head>
<body class="viewport"> <body>
<nav class="pane_nav"> <div class="viewport">
<include src="includes/nav_logo.html" /> <nav class="pane_nav">
<include src="includes/nav_menu.html" /> <include src="includes/nav_logo.html" />
<div class="location"> <include src="includes/nav_menu.html" />
<p class="location_header">You are here:</p> <div class="location">
<p class="location_page">Home</p> <p class="location_header">You are here:</p>
<p class="location_page">Home</p>
</div>
<include src="includes/nav_quick_links.html" />
</nav>
<div class="pane_main">
<h1>Home</h1>
<p>lorem ipsum idk what else there is in this latin phrase</p>
</div>
<div class="pane_spacer">
<div class="spacer_container"><p>#AD</p></div>
<div class="spacer_container"><p>#AD</p></div>
</div> </div>
<include src="includes/nav_quick_links.html" />
</nav>
<div class="pane_main">
<h1>Home</h1>
<p>lorem ipsum idk what else there is in this latin phrase</p>
</div>
<div class="pane_spacer">
<div class="spacer_container"><p>#AD</p></div>
<div class="spacer_container"><p>#AD</p></div>
</div> </div>
<include src="includes/footer.html" />
<include src="includes/scripts.html" /> <include src="includes/scripts.html" />
</body> </body>
</html> </html>

3
src/partials/_nav_location.scss
View File

@@ -2,8 +2,7 @@
margin: 0; margin: 0;
padding: var(--spacing-horizontal); padding: var(--spacing-horizontal);
background-color: var(--background-2); background-color: var(--background-2);
border-radius: var(--border-radius-small) border-radius: var(--border-radius-leaf);
var(--border-radius-large);
text-align: center; text-align: center;
.location_header { .location_header {

7
src/partials/_nav_quick_links.scss
View File

@@ -1,7 +1,7 @@
.nav_quick_links { .nav_quick_links {
--cols: 5; --cols: 5;
--item-padding: 0.35rem; --item-padding: 0.3rem;
--item-edge-length: 1.25rem; --item-edge-length: 1.15rem;
--item-size: calc( --item-size: calc(
var(--item-edge-length) + calc(var(--item-padding) * 2) var(--item-edge-length) + calc(var(--item-padding) * 2)
); );
@@ -32,8 +32,7 @@
padding: var(--item-padding); padding: var(--item-padding);
background-color: var(--background-2); background-color: var(--background-2);
border-radius: var(--border-radius-small) border-radius: var(--border-radius-leaf);
var(--border-radius-large);
} }
} }
} }

2
src/partials/_nav_title.scss
View File

@@ -9,7 +9,7 @@
margin: inherit; margin: inherit;
padding: 0 var(--spacing-horizontal); padding: 0 var(--spacing-horizontal);
transition: var(--transition-fade); transition: var(--transition-fade);
text-transform: uppercase; /*text-transform: uppercase;*/
display: block; display: block;
} }

3
src/partials/_pane_main.scss
View File

@@ -5,6 +5,5 @@
margin: var(--margin-pane); margin: var(--margin-pane);
padding: 0; padding: 0;
border-radius: var(--border-radius-small) border-radius: var(--border-radius-leaf);
var(--border-radius-large);
} }

7
src/partials/_pane_nav.scss
View File

@@ -4,14 +4,15 @@
@use "nav_quick_links"; @use "nav_quick_links";
.pane_nav { .pane_nav {
--spacing-horizontal: 0.75rem;
--transform-scale-x: scaleX(1.15);
margin: var(--margin-pane); margin: var(--margin-pane);
padding: 0; padding: 0;
gap: var(--spacing-menu-gap); gap: var(--spacing-menu-gap);
width: min-content; width: min-content;
align-content: start; align-content: start;
display: grid; display: grid;
grid-auto-flow: row;
grid-template-rows: auto auto auto 1fr max-content;
color: var(--accent-pink); color: var(--accent-pink);
} }

3
src/partials/_pane_spacer.scss
View File

@@ -15,8 +15,7 @@
) )
); );
flex: 1; flex: 1;
border-radius: var(--border-radius-small) border-radius: var(--border-radius-leaf);
var(--border-radius-large);
/* Vertical Text Align */ /* Vertical Text Align */
display: flex; display: flex;

47
src/style.scss
View File

@@ -4,6 +4,13 @@
@use "partials/pane_error"; @use "partials/pane_error";
/*
@font-face {
font-family: Syncopate;
src: url(syncopate.woff);
}
*/
:root { :root {
/* /*
0: Base of an element. Example: the viewport class. 0: Base of an element. Example: the viewport class.
@@ -44,18 +51,29 @@
--white-2: #e5e5e5ff; --white-2: #e5e5e5ff;
--white-3: #f5f5f5ff; --white-3: #f5f5f5ff;
--font-size-generic: 1.65vh; --font-size-generic: 1.85vh;
--font-family-generic: Arial, Sans-Serif, Helvetica; --font-family-generic: "Liberation Sans", Arial, Sans-Serif;
--border-radius-small: calc(var(--border-radius-large) / 2);
--border-radius-large: 1rem;
--border-radius-leaf: var(--border-radius-small)
var(--border-radius-large);
--margin-pane: 1.5rem;
--spacing-horizontal: 0.75rem;
--spacing-menu-gap: 1rem;
--transition-fade: 0.4s ease-out; --transition-fade: 0.4s ease-out;
--transition-cut: none; --transition-cut: none;
--border-radius-large: 1rem; --transform-scale-x: scaleX(1.15);
--border-radius-small: calc(var(--border-radius-large) / 2);
--margin-pane: 1.5rem; body {
background-color: var(--background-0);
--spacing-menu-gap: 1rem; margin: 0;
color: var(--white-3);
}
} }
/* /*
@@ -79,11 +97,20 @@ ion-icon {
.viewport { .viewport {
/* Adds a margin otherwise for some reason. */ /* Adds a margin otherwise for some reason. */
margin: 0; margin: inherit;
background-color: var(--background-0);
color: var(--white-3);
display: flex; display: flex;
flex-flow: row wrap; flex-flow: row wrap;
align-items: flex-start; align-items: flex-start;
} }
.footer {
margin: 0;
padding: var(--spacing-horizontal);
background-color: var(--background-2);
border-top-right-radius: var(--border-radius-large);
position: absolute;
bottom: 0;
}

39
src/templates/error.html
View File

@@ -5,26 +5,29 @@
<title>Error Template | Cutieguwu</title> <title>Error Template | Cutieguwu</title>
<include src="includes/meta.html" /> <include src="includes/meta.html" />
</head> </head>
<body class="viewport"> <body>
<nav class="pane_nav"> <div class="viewport">
<include src="includes/nav_logo.html" /> <nav class="pane_nav">
<include src="includes/nav_menu.html" /> <include src="includes/nav_logo.html" />
<div class="location"> <include src="includes/nav_menu.html" />
<p class="location_header">You are here:</p> <div class="location">
<p class="location_page">Error Template</p> <p class="location_header">You are here:</p>
<p class="location_page">Error Template</p>
</div>
<include src="includes/nav_quick_links.html" />
</nav>
<div class="pane_error">
<h1>Error Code</h1>
<h2>Error Title</h2>
<hr />
<p>Error details and explaination.</p>
</div>
<div class="pane_spacer">
<div class="spacer_container"><p>#AD</p></div>
<div class="spacer_container"><p>#AD</p></div>
</div> </div>
<include src="includes/nav_quick_links.html" />
</nav>
<div class="pane_error">
<h1>Error Code</h1>
<h2>Error Title</h2>
<hr />
<p>Error details and explaination.</p>
</div>
<div class="pane_spacer">
<div class="spacer_container"><p>#AD</p></div>
<div class="spacer_container"><p>#AD</p></div>
</div> </div>
<include src="includes/footer.html" />
<include src="includes/scripts.html" /> <include src="includes/scripts.html" />
</body> </body>
</html> </html>

29
src/templates/main.html
View File

@@ -5,21 +5,24 @@
<title>Main Template | Cutieguwu</title> <title>Main Template | Cutieguwu</title>
<include src="includes/meta.html" /> <include src="includes/meta.html" />
</head> </head>
<body class="viewport"> <body>
<nav class="pane_nav"> <div class="viewport">
<include src="includes/nav_logo.html" /> <nav class="pane_nav">
<include src="includes/nav_menu.html" /> <include src="includes/nav_logo.html" />
<div class="location"> <include src="includes/nav_menu.html" />
<p class="location_header">You are here:</p> <div class="location">
<p class="location_page">Main Template</p> <p class="location_header">You are here:</p>
<p class="location_page">Main Template</p>
</div>
<include src="includes/nav_quick_links.html" />
</nav>
<div class="pane_main"></div>
<div class="pane_spacer">
<div class="spacer_container"><p>#AD</p></div>
<div class="spacer_container"><p>#AD</p></div>
</div> </div>
<include src="includes/nav_quick_links.html" />
</nav>
<div class="pane_main"></div>
<div class="pane_spacer">
<div class="spacer_container"><p>#AD</p></div>
<div class="spacer_container"><p>#AD</p></div>
</div> </div>
<include src="includes/footer.html" />
<include src="includes/scripts.html" /> <include src="includes/scripts.html" />
</body> </body>
</html> </html>