-
Notifications
You must be signed in to change notification settings - Fork 8
/
preferences.html
94 lines (86 loc) · 4.01 KB
/
preferences.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
90
91
92
93
94
<!DOCTYPE html>
<html>
<head>
<title>Preferences</title>
<link rel="stylesheet" href="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.css">
<link href="css/preferences.css" rel="stylesheet">
</head>
<body>
<div class="root">
<div class="mdc-layout-grid">
<div class="mdc-layout-grid__inner grid__inner--row">
<div class="mdc-text-field mdc-layout-grid__cell mdc-layout-grid__cell--span-2 grid__cell--align-center grid__cell--text-align-end">
<label for="search-keyword">Image categories: </label>
</div>
<div class="mdc-text-field mdc-layout-grid__cell grid__cell--align-center">
<input type="text" id="search-keyword" class="mdc-text-field__input" placeholder="nature,water,cat">
<div class="mdc-text-field__bottom-line"></div>
</div>
</div>
<div class="mdc-layout-grid__inner grid__inner--row">
<div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-2 grid__cell--align-center grid__cell--text-align-end">
<label>Image orientation: </label>
</div>
<div class="mdc-layout-grid__cell grid__cell--align-center">
<div class="mdc-form-field">
<div class="mdc-radio">
<input class="mdc-radio__native-control" type="radio" value="landscape" id="radio-orientation-landscape" name="radio-orientation"
checked>
<div class="mdc-radio__background">
<div class="mdc-radio__outer-circle"></div>
<div class="mdc-radio__inner-circle"></div>
</div>
</div>
<label class="radio-orientation-label" for="radio-orientation-landscape">Landscape</label>
<div class="mdc-radio">
<input class="mdc-radio__native-control" type="radio" value="portrait" id="radio-orientation-portrait" name="radio-orientation">
<div class="mdc-radio__background">
<div class="mdc-radio__outer-circle"></div>
<div class="mdc-radio__inner-circle"></div>
</div>
</div>
<label class="radio-orientation-label" for="radio-orientation-portrait">Portrait</label>
</div>
</div>
</div>
<div class="mdc-layout-grid__inner grid__inner--row">
<div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-2 grid__cell--align-center grid__cell--text-align-end">
<label>Image motion: </label>
</div>
<div class="mdc-layout-grid__cell grid__cell--align-center">
<div class="mdc-form-field">
<div class="mdc-radio">
<input class="mdc-radio__native-control" type="radio" value="enable" id="radio-motion-enable" name="radio-motion"
checked>
<div class="mdc-radio__background">
<div class="mdc-radio__outer-circle"></div>
<div class="mdc-radio__inner-circle"></div>
</div>
</div>
<label class="radio-motion-label" for="radio-motion-enable">Enable</label>
<div class="mdc-radio">
<input class="mdc-radio__native-control" type="radio" value="disable" id="radio-motion-disable" name="radio-motion">
<div class="mdc-radio__background">
<div class="mdc-radio__outer-circle"></div>
<div class="mdc-radio__inner-circle"></div>
</div>
</div>
<label class="radio-motion-label" for="radio-motion-disable">Disable</label>
</div>
</div>
</div>
<div class="mdc-layout-grid__inner grid__inner--row">
<div class="mdc-layout-grid__cell grid__cell--align-center">
<div class="save">
<button id="savePreferences" type="button" class="mdc-button mdc-button--raised">
Save
</button>
<span class="saveStatus">Preferences saved.</span>
</div>
</div>
</div>
</div>
</div>
<script defer src="js/preferences.js"></script>
</body>
</html>