shindan_maker/
html_template.rs

1pub const HTML_TEMPLATE: &str = r#"<!DOCTYPE html>
2
3<html lang="en">
4<head>
5    <meta charset="utf-8">
6    <meta name="viewport" content="width=device-width">
7    <link rel="stylesheet" href="https://cn.shindanmaker.com/css/app.css?id=cbfb28ec9001aee269676b04e227a3b9">
8    <style>
9        :root {
10            --body-bg: #ffffff;
11            --text-body: #212529;
12            --bg-img-line: #ffffff;
13            --bg-img-fill: #ffffff;
14            --main-blue: #00c5ff;
15        }
16
17        html {
18            box-sizing: border-box;
19            font-family: sans-serif;
20            line-height: 1.15;
21            -webkit-tap-highlight-color: transparent;
22            max-width: 750px;
23        }
24
25        *, *::before, *::after {
26            box-sizing: inherit;
27        }
28
29        body {
30            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
31            font-size: 0.9rem;
32            font-weight: 400;
33            line-height: 1.6;
34            color: var(--text-body);
35            background-color: var(--body-bg);
36            background-image: repeating-linear-gradient(90deg, var(--bg-img-line) 1px, transparent 1px, transparent 15px),
37            repeating-linear-gradient(0deg, var(--bg-img-line) 1px, var(--bg-img-fill) 1px, var(--bg-img-fill) 15px);
38            background-size: 15px 15px;
39            margin: 0;
40            text-align: left;
41            overflow-wrap: break-word;
42            max-width: 750px;
43            height: 100%;
44        }
45
46        #main-container {
47            max-width: 750px;
48        }
49
50        #main {
51            min-height: 500px;
52        }
53
54        #title_and_result {
55            width: 100%;
56            margin-bottom: 1rem;
57            border: 1rem solid var(--main-blue);
58            font-size: 1.9rem;
59        }
60
61        #shindanResultAbove {
62            padding: 1.5rem;
63            text-align: center;
64            font-weight: 700;
65            font-size: 1.1em;
66            line-height: 1.2;
67        }
68
69        #shindanResultAbove span {
70            display: inline-block;
71            text-align: left;
72        }
73
74        #shindanResultAbove a {
75            font-weight: 700;
76            text-decoration: none;
77            color: var(--text-body);
78        }
79
80
81        #shindanResultTitle {
82            display: block;
83            overflow: hidden;
84            padding: 1.5rem 0.5rem;
85            white-space: nowrap;
86            text-align: center;
87            font-weight: 700;
88            background-color: var(--main-blue);
89            color: #fff;
90            line-height: 1.1em;
91            font-size: 0.9em;
92        }
93
94        #shindanResultContainer {
95            font-size: 1em;
96        }
97
98        #shindanResultHeight {
99            display: flex;
100            min-height: 200px;
101            width: 100%;
102            align-items: center;
103        }
104
105        #shindanResultCell {
106            width: 100%;
107        }
108
109        #shindanResultContent {
110            display: block;
111            padding: 1.5rem;
112            text-align: center;
113            word-break: break-word;
114        }
115
116        #shindanResult {
117            display: inline-block;
118            text-align: left;
119            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
120            line-height: 1.33;
121            white-space: break-spaces;
122        }
123
124        #shindanResult span {
125            font-weight: 700;
126        }
127
128        #title_and_result > .shindanTitleImageContainer {
129            font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
130            color: var(--text-body);
131            font-size: 1.9rem;
132            aspect-ratio: 40/21;
133            width: 100%;
134        }
135
136        #title_and_result > .shindanTitleImageContainer > a {
137            font-weight: 700;
138            color: #fff !important;
139            text-decoration: none !important;
140        }
141
142        #title_and_result > .shindanTitleImageContainer > a > img {
143            width: 100%;
144            height: auto;
145            display: block;
146            max-width: 960px;
147        }
148    </style>
149    <!-- SCRIPTS -->
150    <title>ShindanMaker</title>
151</head>
152
153<body>
154<div id="main-container">
155    <div id="main">
156        <!-- TITLE_AND_RESULT -->
157    </div>
158</div>
159</body>
160</html>"#;
shindan_maker/html_template.rs

shindan_maker/
html_template.rs
