@mitsuharu/vivliostyle-theme-iosdc-pamphlet 0.1.0
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/LICENSE +19 -0
- package/README.md +74 -0
- package/example/default.md +16 -0
- package/package.json +61 -0
- package/theme.css +264 -0
- package/vivliostyle.config.js +9 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
Copyright (c) 2024 Mitsuharu Emoto <mthr1982@gmail.com>
|
|
2
|
+
|
|
3
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
4
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
5
|
+
in the Software without restriction, including without limitation the rights
|
|
6
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
7
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
8
|
+
furnished to do so, subject to the following conditions:
|
|
9
|
+
|
|
10
|
+
The above copyright notice and this permission notice shall be included in all
|
|
11
|
+
copies or substantial portions of the Software.
|
|
12
|
+
|
|
13
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
|
14
|
+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
|
15
|
+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
|
|
16
|
+
IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,
|
|
17
|
+
DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR
|
|
18
|
+
OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE
|
|
19
|
+
OR OTHER DEALINGS IN THE SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
# @mitsuharu/vivliostyle-theme-iosdc-pamphlet
|
|
2
|
+
|
|
3
|
+
iOSDC Japan に投稿するパンフレット記事の Vivliostyle のテーマです。作者が iOSDC Japan 2023 および 2024 で投稿したものを元に作成しました。
|
|
4
|
+
|
|
5
|
+
This is a Vivliostyle theme for techbook of iOSDC Japan pamphlet.
|
|
6
|
+
|
|
7
|
+
## Required
|
|
8
|
+
|
|
9
|
+
- @vivliostyle/cli >= 8.16.0
|
|
10
|
+
|
|
11
|
+
## Use
|
|
12
|
+
|
|
13
|
+
In `vivliostyle.config.js`:
|
|
14
|
+
|
|
15
|
+
```js
|
|
16
|
+
module.exports = {
|
|
17
|
+
theme: [
|
|
18
|
+
'@mitsuharu/vivliostyle-theme-iosdc-pamphlet',
|
|
19
|
+
'@mitsuharu/vivliostyle-theme-noto-sans-jp', // use Noto Sans JP font (optional)
|
|
20
|
+
],
|
|
21
|
+
};
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
## Develop
|
|
25
|
+
|
|
26
|
+
### Files
|
|
27
|
+
|
|
28
|
+
```text
|
|
29
|
+
vivliostyle-theme-iosdc-pamphlet
|
|
30
|
+
├── LICENSE
|
|
31
|
+
├── README.md
|
|
32
|
+
├── example
|
|
33
|
+
│ ├── assets // auto generated
|
|
34
|
+
│ │ └── Logo (Mark + Type).png // auto generated
|
|
35
|
+
│ └── default.md // 🖋
|
|
36
|
+
├── package.json
|
|
37
|
+
├── theme.css // 🖋
|
|
38
|
+
└── vivliostyle.config.js
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
**example**: Contain sample manuscripts using your theme.
|
|
42
|
+
|
|
43
|
+
### Commands
|
|
44
|
+
|
|
45
|
+
Run `vivliostyle preview` to preview your `theme.css`.
|
|
46
|
+
|
|
47
|
+
To watch file changes, use `preview` script.
|
|
48
|
+
|
|
49
|
+
```bash
|
|
50
|
+
npm run preview
|
|
51
|
+
# or
|
|
52
|
+
yarn preview
|
|
53
|
+
```
|
|
54
|
+
|
|
55
|
+
You can specify your CSS file and manuscript file for preview in vivliostyle.config.js:
|
|
56
|
+
|
|
57
|
+
```js
|
|
58
|
+
module.exports = {
|
|
59
|
+
language: 'en',
|
|
60
|
+
theme: ['node_modules/@vivliostyle/theme-base', '.'],
|
|
61
|
+
entry: [
|
|
62
|
+
'example/default.md',
|
|
63
|
+
// and more...
|
|
64
|
+
],
|
|
65
|
+
}
|
|
66
|
+
```
|
|
67
|
+
|
|
68
|
+
Run `vivliostyle-theme-scripts validate` before publishing your package.
|
|
69
|
+
|
|
70
|
+
```bash
|
|
71
|
+
npm run validate
|
|
72
|
+
# or
|
|
73
|
+
yarn validate
|
|
74
|
+
```
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
# タイトル
|
|
2
|
+
|
|
3
|
+
<div class="author-info">
|
|
4
|
+
名前(所属)<BR />
|
|
5
|
+
SNS: アカウント
|
|
6
|
+
</div>
|
|
7
|
+
|
|
8
|
+
祇園精舎の鐘の声、諸行無常の響きあり。沙羅双樹の花の色、盛者必衰の理をあらはす。おごれる人も久しからず。ただ春の夜の夢のごとし。たけき者も遂にはほろびぬ、ひとへに風の前の塵に同じ。
|
|
9
|
+
|
|
10
|
+
## はじめに
|
|
11
|
+
|
|
12
|
+
寿限無寿限無五劫の擦り切れ海砂利水魚の水行末雲来末風来末食う寝る処に住む処やぶら小路の藪柑子パイポパイポパイポのシューリンガンシューリンガンのグーリンダイグーリンダイのポンポコピーのポンポコナーの長久命の長助
|
|
13
|
+
|
|
14
|
+
```swift
|
|
15
|
+
let test = "test"
|
|
16
|
+
```
|
package/package.json
ADDED
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@mitsuharu/vivliostyle-theme-iosdc-pamphlet",
|
|
3
|
+
"description": "It is vivliostyle Theme for iOSDC Pamphlet",
|
|
4
|
+
"version": "0.1.0",
|
|
5
|
+
"author": "Mitsuharu Emoto <mthr1982@gmail.com>",
|
|
6
|
+
"main": "theme.css",
|
|
7
|
+
"scripts": {
|
|
8
|
+
"start": "vivliostyle build && open ./book.pdf",
|
|
9
|
+
"build": "vivliostyle build",
|
|
10
|
+
"open": "open ./book.pdf",
|
|
11
|
+
"preview": "vivliostyle preview",
|
|
12
|
+
"validate": "vivliostyle-theme-scripts validate"
|
|
13
|
+
},
|
|
14
|
+
"dependencies": {
|
|
15
|
+
"@vivliostyle/theme-base": "latest",
|
|
16
|
+
"@vivliostyle/theme-techbook": "latest"
|
|
17
|
+
},
|
|
18
|
+
"devDependencies": {
|
|
19
|
+
"@vivliostyle/cli": "^8.16.0",
|
|
20
|
+
"vivliostyle-theme-scripts": "^0.3.5"
|
|
21
|
+
},
|
|
22
|
+
"peerDependencies": {
|
|
23
|
+
"@vivliostyle/cli": ">=8.16.0"
|
|
24
|
+
},
|
|
25
|
+
"peerDependenciesMeta": {
|
|
26
|
+
"@vivliostyle/cli": {
|
|
27
|
+
"optional": true
|
|
28
|
+
}
|
|
29
|
+
},
|
|
30
|
+
"files": [
|
|
31
|
+
"*.css",
|
|
32
|
+
"example",
|
|
33
|
+
"vivliostyle.config.js"
|
|
34
|
+
],
|
|
35
|
+
"keywords": [
|
|
36
|
+
"vivliostyle",
|
|
37
|
+
"vivliostyle-theme",
|
|
38
|
+
"iOSDC"
|
|
39
|
+
],
|
|
40
|
+
"license": "MIT",
|
|
41
|
+
"vivliostyle": {
|
|
42
|
+
"theme": {
|
|
43
|
+
"name": "vivliostyle-theme-iosdc-pamphlet",
|
|
44
|
+
"author": "Mitsuharu Emoto <mthr1982@gmail.com>",
|
|
45
|
+
"style": "theme.css",
|
|
46
|
+
"category": "misc",
|
|
47
|
+
"topics": [
|
|
48
|
+
"iOSDC"
|
|
49
|
+
]
|
|
50
|
+
}
|
|
51
|
+
},
|
|
52
|
+
"repository": "https://github.com/mitsuharu/vivliostyle-theme-iosdc-pamphlet",
|
|
53
|
+
"bugs": {
|
|
54
|
+
"url": "https://github.com/mitsuharu/vivliostyle-theme-noto-sans-jp/issues"
|
|
55
|
+
},
|
|
56
|
+
"homepage": "https://github.com/mitsuharu/vivliostyle-theme-noto-sans-jp#readme",
|
|
57
|
+
"publishConfig": {
|
|
58
|
+
"registry": "https://registry.npmjs.org/"
|
|
59
|
+
},
|
|
60
|
+
"packageManager": "yarn@4.5.3"
|
|
61
|
+
}
|
package/theme.css
ADDED
|
@@ -0,0 +1,264 @@
|
|
|
1
|
+
@charset "UTF-8";
|
|
2
|
+
|
|
3
|
+
code[class*=language-],
|
|
4
|
+
pre[class*=language-] {
|
|
5
|
+
color: #25292E;
|
|
6
|
+
background: none;
|
|
7
|
+
text-shadow: 0 1px rgba(0, 0, 0, 0.3);
|
|
8
|
+
font-weight: 500;
|
|
9
|
+
font-size: 1em;
|
|
10
|
+
text-align: left;
|
|
11
|
+
white-space: pre-wrap;
|
|
12
|
+
word-spacing: normal;
|
|
13
|
+
word-break: normal;
|
|
14
|
+
word-wrap: normal;
|
|
15
|
+
line-height: 1.5;
|
|
16
|
+
-moz-tab-size: 4;
|
|
17
|
+
-o-tab-size: 4;
|
|
18
|
+
tab-size: 4;
|
|
19
|
+
-webkit-hyphens: none;
|
|
20
|
+
-moz-hyphens: none;
|
|
21
|
+
-ms-hyphens: none;
|
|
22
|
+
hyphens: none;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
/* Code blocks */
|
|
26
|
+
pre[class*=language-] {
|
|
27
|
+
padding: 1em;
|
|
28
|
+
margin: 0.5em 0;
|
|
29
|
+
overflow: auto;
|
|
30
|
+
border-radius: 0.3em;
|
|
31
|
+
border-top: 0.5px solid;
|
|
32
|
+
border-bottom: 0.5px solid;
|
|
33
|
+
border-right: 0.5px solid;
|
|
34
|
+
border-left: 0.5px solid;
|
|
35
|
+
border-color: #1F2430;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
:not(pre) > code[class*=language-],
|
|
39
|
+
pre[class*=language-] {
|
|
40
|
+
background: #F8F8F8;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
/* Inline code */
|
|
44
|
+
:not(pre) > code[class*=language-] {
|
|
45
|
+
padding: 0.1em;
|
|
46
|
+
border-radius: 0.3em;
|
|
47
|
+
white-space: normal;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
.token.comment,
|
|
51
|
+
.token.prolog,
|
|
52
|
+
.token.doctype,
|
|
53
|
+
.token.cdata {
|
|
54
|
+
color: #76A363;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
.token.punctuation {
|
|
58
|
+
color: #25292E;
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
.namespace {
|
|
62
|
+
opacity: 0.7;
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
.token.property,
|
|
66
|
+
.token.tag,
|
|
67
|
+
.token.constant,
|
|
68
|
+
.token.symbol,
|
|
69
|
+
.token.deleted {
|
|
70
|
+
color: #f92672;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
.token.boolean,
|
|
74
|
+
.token.number {
|
|
75
|
+
color: #C4494A;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
.token.selector,
|
|
79
|
+
.token.attr-name,
|
|
80
|
+
.token.string,
|
|
81
|
+
.token.char,
|
|
82
|
+
.token.builtin,
|
|
83
|
+
.token.inserted {
|
|
84
|
+
color: #C13E2A;
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
.token.operator,
|
|
88
|
+
.token.entity,
|
|
89
|
+
.token.url,
|
|
90
|
+
.language-css .token.string,
|
|
91
|
+
.style .token.string,
|
|
92
|
+
.token.variable {
|
|
93
|
+
color: #25292E;
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
.token.atrule,
|
|
97
|
+
.token.attr-value {
|
|
98
|
+
color: #C4494A;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
.token.function {
|
|
102
|
+
color: #7C53D8;
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
.token.class-name {
|
|
106
|
+
color: #32565B;
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
.token.keyword {
|
|
110
|
+
color: #C4494A;
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
.token.regex,
|
|
114
|
+
.token.important {
|
|
115
|
+
color: #fd971f;
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
.token.important,
|
|
119
|
+
.token.bold {
|
|
120
|
+
font-weight: bold;
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
.token.italic {
|
|
124
|
+
font-style: italic;
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
.token.entity {
|
|
128
|
+
cursor: help;
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
code[class*=language-],
|
|
132
|
+
pre[class*=language-] {
|
|
133
|
+
margin: 1.5em 0;
|
|
134
|
+
line-height: 1.2 !important;
|
|
135
|
+
letter-spacing: 0.03rem !important;
|
|
136
|
+
border-radius: 0.2rem !important;
|
|
137
|
+
text-shadow: none !important;
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
:not(pre) > code {
|
|
141
|
+
padding: 0.1rem 0.3rem !important;
|
|
142
|
+
color: #34495e;
|
|
143
|
+
background-color: #ecf0f1;
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
:root {
|
|
147
|
+
font-weight: 400;
|
|
148
|
+
line-height: 1.7;
|
|
149
|
+
}
|
|
150
|
+
|
|
151
|
+
h1,
|
|
152
|
+
h2,
|
|
153
|
+
h3 {
|
|
154
|
+
font-feature-settings: "palt", "calt";
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
h1 {
|
|
158
|
+
font-size: 2.3rem;
|
|
159
|
+
line-height: 1.2;
|
|
160
|
+
}
|
|
161
|
+
|
|
162
|
+
h2 {
|
|
163
|
+
font-size: 1.8rem;
|
|
164
|
+
line-height: 1.2;
|
|
165
|
+
}
|
|
166
|
+
|
|
167
|
+
h3 {
|
|
168
|
+
font-size: 1.4rem;
|
|
169
|
+
line-height: 1.2;
|
|
170
|
+
}
|
|
171
|
+
|
|
172
|
+
a {
|
|
173
|
+
text-decoration: none;
|
|
174
|
+
/* color: #3498db; */
|
|
175
|
+
}
|
|
176
|
+
|
|
177
|
+
a:visited {
|
|
178
|
+
color: #9b59b6;
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
a:hover {
|
|
182
|
+
text-decoration: underline;
|
|
183
|
+
color: #e74c3c;
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
p {
|
|
187
|
+
font-feature-settings: "calt";
|
|
188
|
+
text-align: justify;
|
|
189
|
+
}
|
|
190
|
+
|
|
191
|
+
pre {
|
|
192
|
+
margin: 1.5rem 0;
|
|
193
|
+
box-decoration-break: clone;
|
|
194
|
+
}
|
|
195
|
+
|
|
196
|
+
@media print {
|
|
197
|
+
:root {
|
|
198
|
+
widows: 3;
|
|
199
|
+
orphans: 3;
|
|
200
|
+
hyphens: auto;
|
|
201
|
+
font-size: 14px;
|
|
202
|
+
}
|
|
203
|
+
.token {
|
|
204
|
+
font-size: 100%;
|
|
205
|
+
}
|
|
206
|
+
:not(.footnote) > a[href^='http']::before {
|
|
207
|
+
display: none;
|
|
208
|
+
}
|
|
209
|
+
:not(.footnote) > a[href^='http']::after {
|
|
210
|
+
display: none;
|
|
211
|
+
}
|
|
212
|
+
}
|
|
213
|
+
|
|
214
|
+
@page {
|
|
215
|
+
size: 210mm 297mm;
|
|
216
|
+
margin-top: 25mm;
|
|
217
|
+
margin-bottom: 21mm;
|
|
218
|
+
}
|
|
219
|
+
|
|
220
|
+
@page :left {
|
|
221
|
+
/* 偶数ページの設定 */
|
|
222
|
+
margin-left: 30mm;
|
|
223
|
+
margin-right: 25mm;
|
|
224
|
+
|
|
225
|
+
/* 下部のページ数と上部の表示を削除する */
|
|
226
|
+
--vs-page--mbox-content-top-left: "";
|
|
227
|
+
--vs-page--mbox-content-bottom-left: "";
|
|
228
|
+
}
|
|
229
|
+
|
|
230
|
+
@page :right {
|
|
231
|
+
/* 奇数ページの設定 */
|
|
232
|
+
margin-left: 25mm;
|
|
233
|
+
margin-right: 30mm;
|
|
234
|
+
|
|
235
|
+
/* 下部のページ数と上部の表示を削除する */
|
|
236
|
+
--vs-page--mbox-content-top-right: "";
|
|
237
|
+
--vs-page--mbox-content-bottom-right: "";
|
|
238
|
+
}
|
|
239
|
+
|
|
240
|
+
@media print {
|
|
241
|
+
:root {
|
|
242
|
+
/* フォントの基本サイズ */
|
|
243
|
+
/* 2023 は 14px を設定したが、書籍上では少し大きく感じた */
|
|
244
|
+
font-size: 12px;
|
|
245
|
+
}
|
|
246
|
+
.token {
|
|
247
|
+
/* ソースコードの文字サイズ */
|
|
248
|
+
/* 100% ならば基本サイズと同じ大きさになります */
|
|
249
|
+
font-size: 100%;
|
|
250
|
+
}
|
|
251
|
+
}
|
|
252
|
+
|
|
253
|
+
/* 著者紹介のブロック */
|
|
254
|
+
.author-info {
|
|
255
|
+
display: flex;
|
|
256
|
+
justify-content: flex-end;
|
|
257
|
+
text-align: left;
|
|
258
|
+
}
|
|
259
|
+
|
|
260
|
+
/* 改行しない */
|
|
261
|
+
.no-break {
|
|
262
|
+
word-wrap: break-word;
|
|
263
|
+
white-space: nowrap;
|
|
264
|
+
}
|