/
index.html
131 lines (123 loc) · 9.71 KB
/
index.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
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>^_^</title>
<!-- build:css styles/main.css -->
<link href="styles/normalize.css" rel="stylesheet">
<link href="styles/materialdesignicons.css" rel="stylesheet">
<link href="styles/main.css" rel="stylesheet">
<!-- endbuild -->
</head>
<body>
<div id="wallpaper" class="wallpaper"></div>
<main class="main">
<div class="main__item main__item--top quick-links">
<div class="brand-logo">
<a href="https://naustud.io" class="quick-links__link quick-links__link--svg svg-wrap" title="Nau Studio">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="57.774px" height="16px" viewBox="0 512 362.3 100.4" enable-background="new 0 512 362.3 100.4" xml:space="preserve"><path id="XMLID_28_" fill="#ffffff" d="M25.1,612.2v-75.1h21.5c7.8,0,14.7,4,17.1,11l24.3,64H116l-28.1-73.7c-1.2-5.6-10-26.3-34.5-26.3H0v100H25.1z"/><path id="XMLID_27_" fill="#ffffff" d="M337.2,512.2v75.1h-21.5c-8.2,0-14.5-5-17.1-11l-24.3-64h-28.1l28.1,73.7c3,9.8,12,26.3,34.5,26.3h53.4v-100H337.2z"/><polygon id="XMLID_26_" fill="#ffffff" points="167.6,612.2 141.5,612.2 132.1,587.1 158,587.1 "/><path id="XMLID_25_" fill="#ffffff" d="M232,590.7c0,0-26.1-69-26.5-69.8c-3.4-5.4-8.6-9-15.9-8.8h-21.9c0,0,8.6,6.2,14,21.5c0,0,24.9,65.8,25.5,67.2c2.6,7,8.8,11.6,14.7,11.6h24.3C246.1,612.2,237.4,605.7,232,590.7"/></svg>
</a>
</div>
<ul id="quicklinks" class="quick-links__list">
<li class="quick-links__li" id="gmail"><a href="https://mail.google.com" class="quick-links__link mdi mdi--gmail" title="GMail"></a></li>
<li class="quick-links__li" id="gcalendar"><a href="https://calendar.google.com" class="quick-links__link mdi mdi--calendar" title="Google Calendar"></a></li>
<li class="quick-links__li" id="gdrive"><a href="https://drive.google.com" class="quick-links__link mdi mdi--google-drive" title="Google Drive"></a></li>
<li class="quick-links__li" id="github"><a href="https://github.com" class="quick-links__link mdi mdi--github-circle" title="Github"></a></li>
<li class="quick-links__li" id="bitbucket"><a href="https://bitbucket.org" class="quick-links__link mdi mdi--bitbucket" title="Bitbucket"></a></li>
<li class="quick-links__li" id="trello"><a href="https://trello.com" class="quick-links__link mdi mdi--trello" title="Trello"></a></li>
<li class="quick-links__li" id="facebook"><a href="https://facebook.com" class="quick-links__link mdi mdi--facebook" title="Facebook"></a></li>
<li class="quick-links__li" id="twitter"><a href="https://twitter.com" class="quick-links__link mdi mdi--twitter" title="Twitter"></a></li>
<li class="quick-links__li" id="gplus"><a href="https://plus.google.com" class="quick-links__link mdi mdi--google-plus" title="Google +"></a></li>
<li class="quick-links__li" id="tuoitre"><a href="http://tuoitre.vn" class="quick-links__link quick-links__link--fw" title="Tuoitre.vn"><span class="u-serif-text">tt</span></a></li>
<li class="quick-links__li" id="vnexpress"><a href="http://vnexpress.net/" class="quick-links__link quick-links__link--fw" title="VNExpress"><span class="u-serif-text">vE</span></a></li>
<li class="quick-links__li" id="thanhnien"><a href="http://thanhnien.vn/" class="quick-links__link quick-links__link--fw" title="Thanhnien.vn"><span class="u-serif-text">Tn</span></a></li>
<li class="quick-links__li" id="gphotos"><a href="https://photos.google.com" class="quick-links__link mdi mdi--image" title="Google Photos"></a></li>
<li class="quick-links__li" id="youtube"><a href="https://youtube.com" class="quick-links__link mdi mdi--youtube-play" title="Youtube"></a></li>
<li class="quick-links__li" id="naujukebox"><a href="https://jukebox.naustud.io" class="quick-links__link mdi mdi--play" title="Nau Jukebox"></a></li>
</ul>
</div>
<div class="main__item main__item--center">
<div id="clock" class="clock">23:40</div>
<h1 id="greeting" class="greeting">
<span id="greeting-text">How's your day</span>,
<div id="greeting-name" class="greeting__name">
<input class="greeting__name__input" value="" placeholder="gorgeous">
<span class="greeting__name__output"></span>
</div>
</h1>
</div>
<div id="quotation" class="main__item main__item--bottom quotes">
<p class="quotes__text">I dream, therefore, I become!</p>
<p class="quotes__author"></p>
</div>
<div class="main__item main__item--bottom-left">
<button id="settings-btn" class="main__item--bottom-left__btn icon-btn mdi mdi--settings" type="button"></button>
<div id="photo-credit" class="main__item--bottom-left__text photo-credit"><!-- to generated by JS --></div>
</div>
</main>
<!-- modal settings popup -->
<div class="modal modal--slide-up" id="settings-modal">
<div class="modal__background"></div>
<h3 class="modal__title" i18n="settings">Settings</h3>
<button id="settings-close-btn" class="modal__close icon-btn mdi mdi--close"></button>
<div class="modal__content">
<form id="settings-panel" class="modal__body settings">
<fieldset>
<legend>Choose language / Chọn ngôn ngữ</legend>
<input id="setting-lang-en" type="radio" name="setting-language" value="en"><!--
--><label class="settings__label" for="setting-lang-en">
English
</label>
<input id="setting-lang-vi" type="radio" name="setting-language" value="vi"><!--
--><label class="settings__label" for="setting-lang-vi">
Tiếng Việt
</label>
</fieldset>
<fieldset>
<legend i18n="wallpaper_mode">Wallpaper Mode</legend>
<input id="setting-wallpaper-mode-unsplash" type="radio" name="setting-wallpaper-mode" value="unsplash"><!--
--><label class="settings__label" for="setting-wallpaper-mode-unsplash">
Unsplash
</label>
<input id="setting-wallpaper-mode-user" type="radio" name="setting-wallpaper-mode" value="user"><!--
--><label class="settings__label" for="setting-wallpaper-mode-user" i18n="your_photo">
Your Photo
</label>
<label id="setting-photo-selector" class="u-hidden file-input settings__label">
<input id="setting-photo-selector-input" type="file" class="u-hidden">
<i class="mdi mdi--file-image"></i>
<span id="setting-photo-selector-label" class="file-input__label">Choose a file</span>
</label>
<span id="selected-photo"></span>
</fieldset>
<fieldset id="setting-quicklinks">
<legend i18n="quick_links">Quick Links</legend>
<label title="https://mail.google.com" class="settings__label" ><input type="checkbox" data-link-id="gmail"> <i class="mdi mdi--gmail"></i> GMail</label>
<label title="https://calendar.google.com" class="settings__label" ><input type="checkbox" data-link-id="gcalendar"> <i class="mdi mdi--calendar"></i> Google Calendar</label>
<label title="https://drive.google.com" class="settings__label" ><input type="checkbox" data-link-id="gdrive"> <i class="mdi mdi--google-drive"></i> Google Drive</label>
<label title="https://github.com" class="settings__label" ><input type="checkbox" data-link-id="github"> <i class="mdi mdi--github-circle"></i> Github</label>
<label title="https://bitbucket.org" class="settings__label" ><input type="checkbox" data-link-id="bitbucket"> <i class="mdi mdi--bitbucket"></i> Bitbucket</label>
<label title="https://trello.com" class="settings__label" ><input type="checkbox" data-link-id="trello"> <i class="mdi mdi--trello"></i> Trello</label>
<label title="https://facebook.com" class="settings__label" ><input type="checkbox" data-link-id="facebook"> <i class="mdi mdi--facebook"></i> Facebook</label>
<label title="https://twitter.com" class="settings__label" ><input type="checkbox" data-link-id="twitter"> <i class="mdi mdi--twitter"></i> Twitter</label>
<label title="https://plus.google.com" class="settings__label" ><input type="checkbox" data-link-id="gplus"> <i class="mdi mdi--google-plus"></i> Google +</label>
<label title="http://tuoitre.vn" class="settings__label"><input type="checkbox" data-link-id="tuoitre"> <span class="u-serif-text">tt</span> Tuoitre.vn</label>
<label title="http://vnexpress.net/" class="settings__label"><input type="checkbox" data-link-id="vnexpress"> <span class="u-serif-text">vE</span> VNExpress</label>
<label title="http://thanhnien.vn/" class="settings__label"><input type="checkbox" data-link-id="thanhnien"> <span class="u-serif-text">Tn</span> Thanhnien.vn</label>
<label title="https://photos.google.com" class="settings__label" ><input type="checkbox" data-link-id="gphotos"> <i class="mdi mdi--image"></i> Google Photos</label>
<label title="https://youtube.com" class="settings__label" ><input type="checkbox" data-link-id="youtube"> <i class="mdi mdi--youtube-play"></i> Youtube</label>
<label title="https://jukebox.naustud.io" class="settings__label" ><input type="checkbox" data-link-id="naujukebox"> <i class="mdi mdi--play"></i> Nau Jukebox</label>
</fieldset>
<div class="copyright">
<small>© 2016 <a href="http://int3ractive.com">Thanh Tran</a>. <span i18n="oss_notice">Open source under Apache License v2.0</span>.</small>
<a class="icon-btn" href="https://github.com/trongthanh/nau-chrome-tab" title="Source code on Github"><i class="mdi mdi--github-circle"></i></a><!--
--><a class="icon-btn" href="https://chrome.google.com/webstore/detail/nau-tab/pimockeojlggmlnknhicajgckmlggifa?hl=en" title="Install this extension on Chrome Webstore"><i class="mdi mdi--google-chrome"></i></a>
</div>
</form>
</div>
</div>
<div class="modal-overlay"></div>
<script src="js/vendor.bundle.js"></script>
<script src="js/app.bundle.js"></script>
</body>
</html>