cmdesigns 0.1.2 → 0.1.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +4 -5
- package/src/BaseLayout.astro +27 -50
- package/src/MinimalLayout.astro +175 -0
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "cmdesigns",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.3",
|
|
4
4
|
"description": "An attempt at putting common chrissx Media design elements into a library.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"repository": {
|
|
@@ -15,14 +15,13 @@
|
|
|
15
15
|
"index.ts"
|
|
16
16
|
],
|
|
17
17
|
"dependencies": {
|
|
18
|
-
"astro-favicon": "^0.1.0"
|
|
19
|
-
"normalize.css": "^8.0.1"
|
|
18
|
+
"astro-favicon": "^0.1.0"
|
|
20
19
|
},
|
|
21
20
|
"devDependencies": {
|
|
22
|
-
"astro": "^
|
|
21
|
+
"astro": "^5.0.0"
|
|
23
22
|
},
|
|
24
23
|
"peerDependencies": {
|
|
25
|
-
"astro": "^
|
|
24
|
+
"astro": "^5.0.0-beta.0"
|
|
26
25
|
},
|
|
27
26
|
"license": "MIT"
|
|
28
27
|
}
|
package/src/BaseLayout.astro
CHANGED
|
@@ -1,60 +1,37 @@
|
|
|
1
1
|
---
|
|
2
2
|
import Favicon from "astro-favicon";
|
|
3
|
-
import "
|
|
3
|
+
import MinimalLayout from "./MinimalLayout.astro";
|
|
4
4
|
|
|
5
5
|
export interface Props {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
6
|
+
title: string;
|
|
7
|
+
favicon?: ImageMetadata | string;
|
|
8
|
+
lang: string;
|
|
9
|
+
description?: string;
|
|
10
|
+
themecolor?: string;
|
|
11
11
|
}
|
|
12
12
|
|
|
13
|
-
|
|
13
|
+
const { title, favicon, lang, description, themecolor } = Astro.props;
|
|
14
14
|
---
|
|
15
15
|
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
</head>
|
|
31
|
-
<body>
|
|
32
|
-
<slot />
|
|
33
|
-
</body>
|
|
34
|
-
</html>
|
|
35
|
-
<style is:global>
|
|
36
|
-
:root {
|
|
37
|
-
--cmred: 192, 32, 32;
|
|
38
|
-
--cmpurple: 128, 32, 240;
|
|
39
|
-
--cmblack: 32, 32, 32;
|
|
40
|
-
--transblue: 96, 208, 255;
|
|
41
|
-
--transpink: 255, 176, 192;
|
|
42
|
-
--fgorange: 192, 144, 64;
|
|
43
|
-
|
|
44
|
-
--unifont: Unifont, Menlo, Monaco, "Lucida Console", "Liberation Mono",
|
|
45
|
-
"DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Courier New",
|
|
46
|
-
monospace;
|
|
47
|
-
--minecraft: Minecraft, var(--unifont);
|
|
48
|
-
--impact: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
|
|
49
|
-
--woodcut: Woodcut, sans-serif;
|
|
50
|
-
--sans-serif: system-ui, -apple-system, BlinkMacSystemFont, Inter,
|
|
51
|
-
"Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans",
|
|
52
|
-
"Helvetica Neue", sans-serif;
|
|
53
|
-
}
|
|
16
|
+
<MinimalLayout {title} {lang}>
|
|
17
|
+
{
|
|
18
|
+
description && (
|
|
19
|
+
<meta name="description" content={description} slot="head" />
|
|
20
|
+
)
|
|
21
|
+
}
|
|
22
|
+
{themecolor && <meta name="theme-color" content={themecolor} slot="head" />}
|
|
23
|
+
{favicon && <Favicon src={favicon} slot="head" />}
|
|
24
|
+
<meta name="generator" content={Astro.generator} slot="head" />
|
|
25
|
+
<meta name="darkreader-lock" slot="head" />
|
|
26
|
+
<link rel="stylesheet" href="https://fonts.chrissx.de/" slot="head" />
|
|
27
|
+
<slot name="head" slot="head" />
|
|
28
|
+
<slot />
|
|
29
|
+
</MinimalLayout>
|
|
54
30
|
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
31
|
+
<style is:global>
|
|
32
|
+
body {
|
|
33
|
+
font-family: var(--unifont);
|
|
34
|
+
color: white;
|
|
35
|
+
background-color: black;
|
|
36
|
+
}
|
|
60
37
|
</style>
|
|
@@ -0,0 +1,175 @@
|
|
|
1
|
+
---
|
|
2
|
+
export interface Props {
|
|
3
|
+
title: string;
|
|
4
|
+
lang: string;
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
const { title, lang } = Astro.props;
|
|
8
|
+
---
|
|
9
|
+
|
|
10
|
+
<!doctype html>
|
|
11
|
+
<html {lang}>
|
|
12
|
+
<head>
|
|
13
|
+
<meta charset="UTF-8" />
|
|
14
|
+
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
|
15
|
+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
16
|
+
<title>{title}</title>
|
|
17
|
+
<slot name="head" />
|
|
18
|
+
</head>
|
|
19
|
+
<body>
|
|
20
|
+
<slot />
|
|
21
|
+
</body>
|
|
22
|
+
</html>
|
|
23
|
+
|
|
24
|
+
<style is:global>
|
|
25
|
+
:root {
|
|
26
|
+
--cmred: 192, 32, 32;
|
|
27
|
+
--cmpurple: 128, 32, 240;
|
|
28
|
+
--cmblack: 32, 32, 32;
|
|
29
|
+
--transblue: 96, 208, 255;
|
|
30
|
+
--transpink: 255, 176, 192;
|
|
31
|
+
--fgorange: 192, 144, 64;
|
|
32
|
+
|
|
33
|
+
--sans-serif: system-ui, -apple-system, BlinkMacSystemFont, Inter,
|
|
34
|
+
"Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans",
|
|
35
|
+
"Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
36
|
+
--unifont: Unifont, Menlo, Monaco, "Lucida Console", "Liberation Mono",
|
|
37
|
+
"DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Courier New",
|
|
38
|
+
monospace;
|
|
39
|
+
--minecraft: Minecraft, var(--unifont);
|
|
40
|
+
--impact: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
|
|
41
|
+
--woodcut: Woodcut, sans-serif;
|
|
42
|
+
}
|
|
43
|
+
/*
|
|
44
|
+
* A bunch of cherry-picked copy-paste from normalize.css and modern-normalize.css
|
|
45
|
+
* https://github.com/necolas/normalize.css/blob/master/normalize.css
|
|
46
|
+
* https://github.com/sindresorhus/modern-normalize/blob/main/modern-normalize.css
|
|
47
|
+
*/
|
|
48
|
+
body {
|
|
49
|
+
margin: 0;
|
|
50
|
+
}
|
|
51
|
+
html {
|
|
52
|
+
line-height: 1.15;
|
|
53
|
+
text-size-adjust: 100%;
|
|
54
|
+
}
|
|
55
|
+
h1 {
|
|
56
|
+
font-size: 2em;
|
|
57
|
+
margin: 0.67em 0;
|
|
58
|
+
}
|
|
59
|
+
hr {
|
|
60
|
+
box-sizing: content-box;
|
|
61
|
+
height: 0;
|
|
62
|
+
color: inherit;
|
|
63
|
+
overflow: visible;
|
|
64
|
+
}
|
|
65
|
+
pre {
|
|
66
|
+
font-family: monospace, monospace;
|
|
67
|
+
font-size: 1em;
|
|
68
|
+
}
|
|
69
|
+
abbr[title] {
|
|
70
|
+
text-decoration: underline;
|
|
71
|
+
text-decoration: underline dotted;
|
|
72
|
+
}
|
|
73
|
+
b,
|
|
74
|
+
strong {
|
|
75
|
+
font-weight: bolder;
|
|
76
|
+
}
|
|
77
|
+
code,
|
|
78
|
+
kbd,
|
|
79
|
+
samp,
|
|
80
|
+
pre {
|
|
81
|
+
font-family: monospace, monospace;
|
|
82
|
+
font-size: 1em;
|
|
83
|
+
}
|
|
84
|
+
small {
|
|
85
|
+
font-size: 80%;
|
|
86
|
+
}
|
|
87
|
+
sub,
|
|
88
|
+
sup {
|
|
89
|
+
font-size: 75%;
|
|
90
|
+
line-height: 0;
|
|
91
|
+
position: relative;
|
|
92
|
+
vertical-align: baseline;
|
|
93
|
+
}
|
|
94
|
+
sub {
|
|
95
|
+
bottom: -0.25em;
|
|
96
|
+
}
|
|
97
|
+
sup {
|
|
98
|
+
top: -0.5em;
|
|
99
|
+
}
|
|
100
|
+
table {
|
|
101
|
+
text-indent: 0;
|
|
102
|
+
border-color: inherit;
|
|
103
|
+
}
|
|
104
|
+
button,
|
|
105
|
+
input,
|
|
106
|
+
optgroup,
|
|
107
|
+
select,
|
|
108
|
+
textarea {
|
|
109
|
+
font-family: inherit;
|
|
110
|
+
font-size: 100%;
|
|
111
|
+
line-height: 1.15;
|
|
112
|
+
margin: 0;
|
|
113
|
+
}
|
|
114
|
+
button,
|
|
115
|
+
input {
|
|
116
|
+
overflow: visible;
|
|
117
|
+
}
|
|
118
|
+
button,
|
|
119
|
+
select {
|
|
120
|
+
text-transform: none;
|
|
121
|
+
}
|
|
122
|
+
button,
|
|
123
|
+
[type="button"],
|
|
124
|
+
[type="reset"],
|
|
125
|
+
[type="submit"] {
|
|
126
|
+
appearance: button;
|
|
127
|
+
}
|
|
128
|
+
::-moz-focus-inner {
|
|
129
|
+
border-style: none;
|
|
130
|
+
padding: 0;
|
|
131
|
+
}
|
|
132
|
+
:-moz-focusring {
|
|
133
|
+
outline: 1px dotted ButtonText;
|
|
134
|
+
}
|
|
135
|
+
fieldset {
|
|
136
|
+
padding: 0.35em 0.75em 0.625em;
|
|
137
|
+
}
|
|
138
|
+
:-moz-ui-invalid {
|
|
139
|
+
box-shadow: none;
|
|
140
|
+
}
|
|
141
|
+
legend {
|
|
142
|
+
box-sizing: border-box;
|
|
143
|
+
display: table;
|
|
144
|
+
max-width: 100%;
|
|
145
|
+
padding: 0;
|
|
146
|
+
white-space: normal;
|
|
147
|
+
}
|
|
148
|
+
progress {
|
|
149
|
+
vertical-align: baseline;
|
|
150
|
+
}
|
|
151
|
+
::-webkit-inner-spin-button,
|
|
152
|
+
::-webkit-outer-spin-button {
|
|
153
|
+
height: auto;
|
|
154
|
+
}
|
|
155
|
+
[type="search"] {
|
|
156
|
+
appearance: textfield;
|
|
157
|
+
outline-offset: -2px;
|
|
158
|
+
}
|
|
159
|
+
::-webkit-search-decoration {
|
|
160
|
+
appearance: none;
|
|
161
|
+
}
|
|
162
|
+
::-webkit-file-upload-button {
|
|
163
|
+
appearance: button;
|
|
164
|
+
font: inherit;
|
|
165
|
+
}
|
|
166
|
+
details {
|
|
167
|
+
display: block;
|
|
168
|
+
}
|
|
169
|
+
summary {
|
|
170
|
+
display: list-item;
|
|
171
|
+
}
|
|
172
|
+
template {
|
|
173
|
+
display: none;
|
|
174
|
+
}
|
|
175
|
+
</style>
|