-
Notifications
You must be signed in to change notification settings - Fork 0
/
popup.html
89 lines (76 loc) · 3.24 KB
/
popup.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
<!DOCTYPE html>
<meta charset="UTF-8">
<html>
<head>
<title>設定</title>
<link rel="stylesheet" href="./styles.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css">
</head>
<body>
<h2>Kawaii-Kusa</h2>
<!-- 色の設定 -->
<!-- 色の設定 -->
<div class="color_panel">
<label>Less</label>
<!-- Level 0 -->
<div class="setting_container" id="level0_container">
<div class="color_preview" id="level0_preview"></div>
<input type="color" class="color_input" id="level0" style="display:none;">
<input type="file" class="image_input" id="level0_img" style="display:none;">
</div>
<!-- Level 1 -->
<div class="setting_container" id="level1_container">
<div class="color_preview" id="level1_preview"></div>
<input type="color" class="color_input" id="level1" style="display:none;">
<input type="file" class="image_input" id="level1_img" style="display:none;">
</div>
<!-- Level 2 -->
<div class="setting_container" id="level2_container">
<div class="color_preview" id="level2_preview"></div>
<input type="color" class="color_input" id="level2" style="display:none;">
<input type="file" class="image_input" id="level2_img" style="display:none;">
</div>
<!-- Level 3 -->
<div class="setting_container" id="level3_container">
<div class="color_preview" id="level3_preview"></div>
<input type="color" class="color_input" id="level3" style="display:none;">
<input type="file" class="image_input" id="level3_img" style="display:none;">
</div>
<!-- Level 4 -->
<div class="setting_container" id="level4_container">
<div class="color_preview" id="level4_preview"></div>
<input type="color" class="color_input" id="level4" style="display:none;">
<input type="file" class="image_input" id="level4_img" style="display:none;">
</div>
<label>More</label>
</div>
<button id="set_default">Default</button>
<select id="presetDropdown">
<option value="">プリセットを選択</option>
<!-- ここにプリセットのオプションが動的に追加される -->
</select>
<div class="preset_import_container">
<input type="text" id="importShareId" placeholder="プリセットIDを入力">
<button id="import_preset">読み込む</button>
</div>
<div class="bottom_button">
<button id="save">Save</button>
</div>
<div class="preset_save_container">
<input type="text" id="presetShareId" placeholder="共有するためのIDを入力">
<div class="bottom_save">
<button id="save_preset">プリセットを保存&共有</button>
</div>
</div>
<div id="customDropdown" style="display:none; position:absolute; background-color:#fff; border:1px solid #ccc; z-index:100;">
<div id="colorChoice">色を選択</div>
<div id="imageChoice">画像をアップロード</div>
</div>
<input type="hidden" id="level0_img_hidden">
<input type="hidden" id="level1_img_hidden">
<input type="hidden" id="level2_img_hidden">
<input type="hidden" id="level3_img_hidden">
<input type="hidden" id="level4_img_hidden">
<script src="./dist/popup.js"></script>
</body>
</html>