├── .gitignore
├── Gemfile
├── Gemfile.lock
├── README.md
├── _config.yml
├── _includes
├── aside.html
├── counter.html
├── list-blocks.html
└── select-blocks.html
├── _layouts
└── nil.html
├── code-blocks-grabber.js
├── index.html
├── script.js
├── styles.css
└── useful-symbols.js
/.gitignore:
--------------------------------------------------------------------------------
1 | _site/
2 | *.log
3 |
--------------------------------------------------------------------------------
/Gemfile:
--------------------------------------------------------------------------------
1 | source 'https://rubygems.org'
2 | gem 'github-pages'
3 | gem 'nokogiri', '>= 1.10.8'
4 |
--------------------------------------------------------------------------------
/Gemfile.lock:
--------------------------------------------------------------------------------
1 | GEM
2 | remote: https://rubygems.org/
3 | specs:
4 | activesupport (6.0.3.1)
5 | concurrent-ruby (~> 1.0, >= 1.0.2)
6 | i18n (>= 0.7, < 2)
7 | minitest (~> 5.1)
8 | tzinfo (~> 1.1)
9 | zeitwerk (~> 2.2, >= 2.2.2)
10 | addressable (2.8.0)
11 | public_suffix (>= 2.0.2, < 5.0)
12 | coffee-script (2.4.1)
13 | coffee-script-source
14 | execjs
15 | coffee-script-source (1.11.1)
16 | colorator (1.1.0)
17 | commonmarker (0.17.13)
18 | ruby-enum (~> 0.5)
19 | concurrent-ruby (1.1.6)
20 | dnsruby (1.61.3)
21 | addressable (~> 2.5)
22 | em-websocket (0.5.1)
23 | eventmachine (>= 0.12.9)
24 | http_parser.rb (~> 0.6.0)
25 | ethon (0.12.0)
26 | ffi (>= 1.3.0)
27 | eventmachine (1.2.7)
28 | execjs (2.7.0)
29 | faraday (1.0.1)
30 | multipart-post (>= 1.2, < 3)
31 | ffi (1.12.2)
32 | forwardable-extended (2.6.0)
33 | gemoji (3.0.1)
34 | github-pages (204)
35 | github-pages-health-check (= 1.16.1)
36 | jekyll (= 3.8.5)
37 | jekyll-avatar (= 0.7.0)
38 | jekyll-coffeescript (= 1.1.1)
39 | jekyll-commonmark-ghpages (= 0.1.6)
40 | jekyll-default-layout (= 0.1.4)
41 | jekyll-feed (= 0.13.0)
42 | jekyll-gist (= 1.5.0)
43 | jekyll-github-metadata (= 2.13.0)
44 | jekyll-mentions (= 1.5.1)
45 | jekyll-optional-front-matter (= 0.3.2)
46 | jekyll-paginate (= 1.1.0)
47 | jekyll-readme-index (= 0.3.0)
48 | jekyll-redirect-from (= 0.15.0)
49 | jekyll-relative-links (= 0.6.1)
50 | jekyll-remote-theme (= 0.4.1)
51 | jekyll-sass-converter (= 1.5.2)
52 | jekyll-seo-tag (= 2.6.1)
53 | jekyll-sitemap (= 1.4.0)
54 | jekyll-swiss (= 1.0.0)
55 | jekyll-theme-architect (= 0.1.1)
56 | jekyll-theme-cayman (= 0.1.1)
57 | jekyll-theme-dinky (= 0.1.1)
58 | jekyll-theme-hacker (= 0.1.1)
59 | jekyll-theme-leap-day (= 0.1.1)
60 | jekyll-theme-merlot (= 0.1.1)
61 | jekyll-theme-midnight (= 0.1.1)
62 | jekyll-theme-minimal (= 0.1.1)
63 | jekyll-theme-modernist (= 0.1.1)
64 | jekyll-theme-primer (= 0.5.4)
65 | jekyll-theme-slate (= 0.1.1)
66 | jekyll-theme-tactile (= 0.1.1)
67 | jekyll-theme-time-machine (= 0.1.1)
68 | jekyll-titles-from-headings (= 0.5.3)
69 | jemoji (= 0.11.1)
70 | kramdown (= 1.17.0)
71 | liquid (= 4.0.3)
72 | mercenary (~> 0.3)
73 | minima (= 2.5.1)
74 | nokogiri (>= 1.10.4, < 2.0)
75 | rouge (= 3.13.0)
76 | terminal-table (~> 1.4)
77 | github-pages-health-check (1.16.1)
78 | addressable (~> 2.3)
79 | dnsruby (~> 1.60)
80 | octokit (~> 4.0)
81 | public_suffix (~> 3.0)
82 | typhoeus (~> 1.3)
83 | html-pipeline (2.12.3)
84 | activesupport (>= 2)
85 | nokogiri (>= 1.4)
86 | http_parser.rb (0.6.0)
87 | i18n (0.9.5)
88 | concurrent-ruby (~> 1.0)
89 | jekyll (3.8.5)
90 | addressable (~> 2.4)
91 | colorator (~> 1.0)
92 | em-websocket (~> 0.5)
93 | i18n (~> 0.7)
94 | jekyll-sass-converter (~> 1.0)
95 | jekyll-watch (~> 2.0)
96 | kramdown (~> 1.14)
97 | liquid (~> 4.0)
98 | mercenary (~> 0.3.3)
99 | pathutil (~> 0.9)
100 | rouge (>= 1.7, < 4)
101 | safe_yaml (~> 1.0)
102 | jekyll-avatar (0.7.0)
103 | jekyll (>= 3.0, < 5.0)
104 | jekyll-coffeescript (1.1.1)
105 | coffee-script (~> 2.2)
106 | coffee-script-source (~> 1.11.1)
107 | jekyll-commonmark (1.3.1)
108 | commonmarker (~> 0.14)
109 | jekyll (>= 3.7, < 5.0)
110 | jekyll-commonmark-ghpages (0.1.6)
111 | commonmarker (~> 0.17.6)
112 | jekyll-commonmark (~> 1.2)
113 | rouge (>= 2.0, < 4.0)
114 | jekyll-default-layout (0.1.4)
115 | jekyll (~> 3.0)
116 | jekyll-feed (0.13.0)
117 | jekyll (>= 3.7, < 5.0)
118 | jekyll-gist (1.5.0)
119 | octokit (~> 4.2)
120 | jekyll-github-metadata (2.13.0)
121 | jekyll (>= 3.4, < 5.0)
122 | octokit (~> 4.0, != 4.4.0)
123 | jekyll-mentions (1.5.1)
124 | html-pipeline (~> 2.3)
125 | jekyll (>= 3.7, < 5.0)
126 | jekyll-optional-front-matter (0.3.2)
127 | jekyll (>= 3.0, < 5.0)
128 | jekyll-paginate (1.1.0)
129 | jekyll-readme-index (0.3.0)
130 | jekyll (>= 3.0, < 5.0)
131 | jekyll-redirect-from (0.15.0)
132 | jekyll (>= 3.3, < 5.0)
133 | jekyll-relative-links (0.6.1)
134 | jekyll (>= 3.3, < 5.0)
135 | jekyll-remote-theme (0.4.1)
136 | addressable (~> 2.0)
137 | jekyll (>= 3.5, < 5.0)
138 | rubyzip (>= 1.3.0)
139 | jekyll-sass-converter (1.5.2)
140 | sass (~> 3.4)
141 | jekyll-seo-tag (2.6.1)
142 | jekyll (>= 3.3, < 5.0)
143 | jekyll-sitemap (1.4.0)
144 | jekyll (>= 3.7, < 5.0)
145 | jekyll-swiss (1.0.0)
146 | jekyll-theme-architect (0.1.1)
147 | jekyll (~> 3.5)
148 | jekyll-seo-tag (~> 2.0)
149 | jekyll-theme-cayman (0.1.1)
150 | jekyll (~> 3.5)
151 | jekyll-seo-tag (~> 2.0)
152 | jekyll-theme-dinky (0.1.1)
153 | jekyll (~> 3.5)
154 | jekyll-seo-tag (~> 2.0)
155 | jekyll-theme-hacker (0.1.1)
156 | jekyll (~> 3.5)
157 | jekyll-seo-tag (~> 2.0)
158 | jekyll-theme-leap-day (0.1.1)
159 | jekyll (~> 3.5)
160 | jekyll-seo-tag (~> 2.0)
161 | jekyll-theme-merlot (0.1.1)
162 | jekyll (~> 3.5)
163 | jekyll-seo-tag (~> 2.0)
164 | jekyll-theme-midnight (0.1.1)
165 | jekyll (~> 3.5)
166 | jekyll-seo-tag (~> 2.0)
167 | jekyll-theme-minimal (0.1.1)
168 | jekyll (~> 3.5)
169 | jekyll-seo-tag (~> 2.0)
170 | jekyll-theme-modernist (0.1.1)
171 | jekyll (~> 3.5)
172 | jekyll-seo-tag (~> 2.0)
173 | jekyll-theme-primer (0.5.4)
174 | jekyll (> 3.5, < 5.0)
175 | jekyll-github-metadata (~> 2.9)
176 | jekyll-seo-tag (~> 2.0)
177 | jekyll-theme-slate (0.1.1)
178 | jekyll (~> 3.5)
179 | jekyll-seo-tag (~> 2.0)
180 | jekyll-theme-tactile (0.1.1)
181 | jekyll (~> 3.5)
182 | jekyll-seo-tag (~> 2.0)
183 | jekyll-theme-time-machine (0.1.1)
184 | jekyll (~> 3.5)
185 | jekyll-seo-tag (~> 2.0)
186 | jekyll-titles-from-headings (0.5.3)
187 | jekyll (>= 3.3, < 5.0)
188 | jekyll-watch (2.2.1)
189 | listen (~> 3.0)
190 | jemoji (0.11.1)
191 | gemoji (~> 3.0)
192 | html-pipeline (~> 2.2)
193 | jekyll (>= 3.0, < 5.0)
194 | kramdown (1.17.0)
195 | liquid (4.0.3)
196 | listen (3.2.1)
197 | rb-fsevent (~> 0.10, >= 0.10.3)
198 | rb-inotify (~> 0.9, >= 0.9.10)
199 | mercenary (0.3.6)
200 | mini_portile2 (2.5.1)
201 | minima (2.5.1)
202 | jekyll (>= 3.5, < 5.0)
203 | jekyll-feed (~> 0.9)
204 | jekyll-seo-tag (~> 2.1)
205 | minitest (5.14.1)
206 | multipart-post (2.1.1)
207 | nokogiri (1.11.4)
208 | mini_portile2 (~> 2.5.0)
209 | racc (~> 1.4)
210 | octokit (4.18.0)
211 | faraday (>= 0.9)
212 | sawyer (~> 0.8.0, >= 0.5.3)
213 | pathutil (0.16.2)
214 | forwardable-extended (~> 2.6)
215 | public_suffix (3.1.1)
216 | racc (1.5.2)
217 | rb-fsevent (0.10.3)
218 | rb-inotify (0.10.1)
219 | ffi (~> 1.0)
220 | rouge (3.13.0)
221 | ruby-enum (0.7.2)
222 | i18n
223 | rubyzip (2.3.0)
224 | safe_yaml (1.0.5)
225 | sass (3.7.4)
226 | sass-listen (~> 4.0.0)
227 | sass-listen (4.0.0)
228 | rb-fsevent (~> 0.9, >= 0.9.4)
229 | rb-inotify (~> 0.9, >= 0.9.7)
230 | sawyer (0.8.2)
231 | addressable (>= 2.3.5)
232 | faraday (> 0.8, < 2.0)
233 | terminal-table (1.8.0)
234 | unicode-display_width (~> 1.1, >= 1.1.1)
235 | thread_safe (0.3.6)
236 | typhoeus (1.3.1)
237 | ethon (>= 0.9.0)
238 | tzinfo (1.2.7)
239 | thread_safe (~> 0.1)
240 | unicode-display_width (1.7.0)
241 | zeitwerk (2.3.0)
242 |
243 | PLATFORMS
244 | ruby
245 |
246 | DEPENDENCIES
247 | github-pages
248 | nokogiri (>= 1.10.8)
249 |
250 | BUNDLED WITH
251 | 1.17.2
252 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | Таблица символов Юникода
2 | ================
3 | Страница сделана с целью увидеть максимальное количество символов юникода.
4 |
5 | Посмотреть можно тут: yoksel.github.io/unicode-table/.
6 |
--------------------------------------------------------------------------------
/_config.yml:
--------------------------------------------------------------------------------
1 | # standard jekyll configuration
2 |
3 | permalink: /:title
4 | highlighter: rouge
5 | exclude: ['Rakefile', 'config.rb', 'README.md','gems']
6 | markdown: rdiscount
7 |
--------------------------------------------------------------------------------
/_includes/aside.html:
--------------------------------------------------------------------------------
1 |
24 |
36 |
37 |
40 |
--------------------------------------------------------------------------------
/_includes/counter.html:
--------------------------------------------------------------------------------
1 |
2 |
--------------------------------------------------------------------------------
/_includes/list-blocks.html:
--------------------------------------------------------------------------------
1 |
2 | - Basic Latin
3 | - Latin-1 Supplement
4 | - Latin Extended-A
5 | - Latin Extended-B
6 | - IPA Extensions
7 | - Spacing Modifier Letters
8 | - Combining Diacritical Marks
9 | - Greek and Coptic
10 | - Cyrillic
11 | - Cyrillic Supplement
12 | - Armenian
13 | - Hebrew
14 | - Arabic
15 | - Syriac
16 | - Arabic Supplement
17 | - Thaana
18 | - NKo
19 | - Samaritan
20 | - Mandaic
21 | - Syriac Supplement
22 | - Arabic Extended-A
23 | - Devanagari
24 | - Bengali
25 | - Gurmukhi
26 | - Gujarati
27 | - Oriya
28 | - Tamil
29 | - Telugu
30 | - Kannada
31 | - Malayalam
32 | - Sinhala
33 | - Thai
34 | - Lao
35 | - Tibetan
36 | - Myanmar
37 | - Georgian
38 | - Hangul Jamo
39 | - Ethiopic
40 | - Ethiopic Supplement
41 | - Cherokee
42 | - Unified Canadian Aboriginal Syllabics
43 | - Ogham
44 | - Runic
45 | - Tagalog
46 | - Hanunoo
47 | - Buhid
48 | - Tagbanwa
49 | - Khmer
50 | - Mongolian
51 | - Unified Canadian Aboriginal Syllabics Extended
52 | - Limbu
53 | - Tai Le
54 | - New Tai Lue
55 | - Khmer Symbols
56 | - Buginese
57 | - Tai Tham
58 | - Combining Diacritical Marks Extended
59 | - Balinese
60 | - Sundanese
61 | - Batak
62 | - Lepcha
63 | - Ol Chiki
64 | - Cyrillic Extended-C
65 | - Georgian Extended
66 | - Sundanese Supplement
67 | - Vedic Extensions
68 | - Phonetic Extensions
69 | - Phonetic Extensions Supplement
70 | - Combining Diacritical Marks Supplement
71 | - Latin Extended Additional
72 | - Greek Extended
73 | - General Punctuation
74 | - Superscripts and Subscripts
75 | - Currency Symbols
76 | - Combining Diacritical Marks for Symbols
77 | - Letterlike Symbols
78 | - Number Forms
79 | - Arrows
80 | - Mathematical Operators
81 | - Miscellaneous Technical
82 | - Control Pictures
83 | - Optical Character Recognition
84 | - Enclosed Alphanumerics
85 | - Box Drawing
86 | - Block Elements
87 | - Geometric Shapes
88 | - Miscellaneous Symbols
89 | - Dingbats
90 | - Miscellaneous Mathematical Symbols-A
91 | - Supplemental Arrows-A
92 | - Braille Patterns
93 | - Supplemental Arrows-B
94 | - Miscellaneous Mathematical Symbols-B
95 | - Supplemental Mathematical Operators
96 | - Miscellaneous Symbols and Arrows
97 | - Glagolitic
98 | - Latin Extended-C
99 | - Coptic
100 | - Georgian Supplement
101 | - Tifinagh
102 | - Ethiopic Extended
103 | - Cyrillic Extended-A
104 | - Supplemental Punctuation
105 | - CJK Radicals Supplement
106 | - Kangxi Radicals
107 | - Ideographic Description Characters
108 | - CJK Symbols and Punctuation
109 | - Hiragana
110 | - Katakana
111 | - Bopomofo
112 | - Hangul Compatibility Jamo
113 | - Kanbun
114 | - Bopomofo Extended
115 | - CJK Strokes
116 | - Katakana Phonetic Extensions
117 | - Enclosed CJK Letters and Months
118 | - CJK Compatibility
119 | - CJK Unified Ideographs Extension A
120 | - Yijing Hexagram Symbols
121 | - CJK Unified Ideographs
122 | - Yi Syllables
123 | - Yi Radicals
124 | - Lisu
125 | - Vai
126 | - Cyrillic Extended-B
127 | - Bamum
128 | - Modifier Tone Letters
129 | - Latin Extended-D
130 | - Syloti Nagri
131 | - Common Indic Number Forms
132 | - Phags-pa
133 | - Saurashtra
134 | - Devanagari Extended
135 | - Kayah Li
136 | - Rejang
137 | - Hangul Jamo Extended-A
138 | - Javanese
139 | - Myanmar Extended-B
140 | - Cham
141 | - Myanmar Extended-A
142 | - Tai Viet
143 | - Meetei Mayek Extensions
144 | - Ethiopic Extended-A
145 | - Latin Extended-E
146 | - Cherokee Supplement
147 | - Meetei Mayek
148 | - Hangul Syllables
149 | - Hangul Jamo Extended-B
150 | - High Surrogates
151 | - High Private Use Surrogates
152 | - Low Surrogates
153 | - Private Use Area
154 | - CJK Compatibility Ideographs
155 | - Alphabetic Presentation Forms
156 | - Arabic Presentation Forms-A
157 | - Variation Selectors
158 | - Vertical Forms
159 | - Combining Half Marks
160 | - CJK Compatibility Forms
161 | - Small Form Variants
162 | - Arabic Presentation Forms-B
163 | - Halfwidth and Fullwidth Forms
164 | - Specials
165 | - Linear B Syllabary
166 | - Linear B Ideograms
167 | - Aegean Numbers
168 | - Ancient Greek Numbers
169 | - Ancient Symbols
170 | - Phaistos Disc
171 | - Lycian
172 | - Carian
173 | - Coptic Epact Numbers
174 | - Old Italic
175 | - Gothic
176 | - Old Permic
177 | - Ugaritic
178 | - Old Persian
179 | - Deseret
180 | - Shavian
181 | - Osmanya
182 | - Osage
183 | - Elbasan
184 | - Caucasian Albanian
185 | - Linear A
186 | - Cypriot Syllabary
187 | - Imperial Aramaic
188 | - Palmyrene
189 | - Nabataean
190 | - Hatran
191 | - Phoenician
192 | - Lydian
193 | - Meroitic Hieroglyphs
194 | - Meroitic Cursive
195 | - Kharoshthi
196 | - Old South Arabian
197 | - Old North Arabian
198 | - Manichaean
199 | - Avestan
200 | - Inscriptional Parthian
201 | - Inscriptional Pahlavi
202 | - Psalter Pahlavi
203 | - Old Turkic
204 | - Old Hungarian
205 | - Hanifi Rohingya
206 | - Rumi Numeral Symbols
207 | - Yezidi
208 | - Old Sogdian
209 | - Sogdian
210 | - Chorasmian
211 | - Elymaic
212 | - Brahmi
213 | - Kaithi
214 | - Sora Sompeng
215 | - Chakma
216 | - Mahajani
217 | - Sharada
218 | - Sinhala Archaic Numbers
219 | - Khojki
220 | - Multani
221 | - Khudawadi
222 | - Grantha
223 | - Newa
224 | - Tirhuta
225 | - Siddham
226 | - Modi
227 | - Mongolian Supplement
228 | - Takri
229 | - Ahom
230 | - Dogra
231 | - Warang Citi
232 | - Dives Akuru
233 | - Nandinagari
234 | - Zanabazar Square
235 | - Soyombo
236 | - Pau Cin Hau
237 | - Bhaiksuki
238 | - Marchen
239 | - Masaram Gondi
240 | - Gunjala Gondi
241 | - Makasar
242 | - Lisu Supplement
243 | - Tamil Supplement
244 | - Cuneiform
245 | - Cuneiform Numbers and Punctuation
246 | - Early Dynastic Cuneiform
247 | - Egyptian Hieroglyphs
248 | - Egyptian Hieroglyph Format Controls
249 | - Anatolian Hieroglyphs
250 | - Bamum Supplement
251 | - Mro
252 | - Bassa Vah
253 | - Pahawh Hmong
254 | - Medefaidrin
255 | - Miao
256 | - Ideographic Symbols and Punctuation
257 | - Tangut
258 | - Tangut Components
259 | - Khitan Small Script
260 | - Tangut Supplement
261 | - Kana Supplement
262 | - Kana Extended-A
263 | - Small Kana Extension
264 | - Nushu
265 | - Duployan
266 | - Shorthand Format Controls
267 | - Byzantine Musical Symbols
268 | - Musical Symbols
269 | - Ancient Greek Musical Notation
270 | - Mayan Numerals
271 | - Tai Xuan Jing Symbols
272 | - Counting Rod Numerals
273 | - Mathematical Alphanumeric Symbols
274 | - Sutton SignWriting
275 | - Glagolitic Supplement
276 | - Nyiakeng Puachue Hmong
277 | - Wancho
278 | - Mende Kikakui
279 | - Adlam
280 | - Indic Siyaq Numbers
281 | - Ottoman Siyaq Numbers
282 | - Arabic Mathematical Alphabetic Symbols
283 | - Mahjong Tiles
284 | - Domino Tiles
285 | - Playing Cards
286 | - Enclosed Alphanumeric Supplement
287 | - Enclosed Ideographic Supplement
288 | - Miscellaneous Symbols and Pictographs
289 | - Emoticons
290 | - Ornamental Dingbats
291 | - Transport and Map Symbols
292 | - Alchemical Symbols
293 | - Geometric Shapes Extended
294 | - Supplemental Arrows-C
295 | - Supplemental Symbols and Pictographs
296 | - Chess Symbols
297 | - Symbols and Pictographs Extended-A
298 | - Symbols for Legacy Computing
299 | - CJK Unified Ideographs Extension B
300 | - CJK Unified Ideographs Extension C
301 | - CJK Unified Ideographs Extension D
302 | - CJK Unified Ideographs Extension E
303 | - CJK Unified Ideographs Extension F
304 | - CJK Compatibility Ideographs Supplement
305 | - CJK Unified Ideographs Extension G
306 | - Tags
307 | - Variation Selectors Supplement
308 | - Supplementary Private Use Area-A
309 | - Supplementary Private Use Area-B
310 |
311 |
--------------------------------------------------------------------------------
/_includes/select-blocks.html:
--------------------------------------------------------------------------------
1 |
414 |
--------------------------------------------------------------------------------
/_layouts/nil.html:
--------------------------------------------------------------------------------
1 | {{ content }}
2 |
--------------------------------------------------------------------------------
/code-blocks-grabber.js:
--------------------------------------------------------------------------------
1 | // Script for grabbing code blocks
2 | // http://unicode.org/charts/index.html#scripts
3 |
4 | const texts = document.querySelectorAll('td p');
5 | const options = [];
6 | let isStarted = false;
7 |
8 | texts.forEach(item => {
9 | const links = item.querySelectorAll('a');
10 | const space = item.classList.contains('sb') || item.classList.contains('pb')
11 | ? '• '
12 | : '';
13 | const groupPrefix = isStarted
14 | ? ``
15 | : '';
16 |
17 | if (item.classList.contains('sg')
18 | || (item.classList.contains('mb') && links.length === 0)) {
19 | options.push(`${groupPrefix}');
31 |
32 | console.log(options.join('\n'))
33 |
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 | ---
2 | layout: nil
3 | layout_type: mainpage
4 | ---
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 | Таблица символов Юникода
13 |
14 |
15 |
16 |
17 |
18 |
19 |
22 |
23 |
24 |
25 |
26 |
Страница была сделана из любопытства с целью увидеть максимальное количество символов юникода.
27 |
28 |
Для использования символа в HTML скопируйте код из зелёного поля, для использования в CSS - из голубого.
29 |
30 |
Кликните по символу, чтобы посмотреть как он поддерживается в разных шрифтах.
31 |
32 |
33 |
37 |
38 |
39 | Загрузка...
40 |
41 |
42 |
43 |
44 |
47 |
48 |
49 |
50 |
51 | {% include counter.html %}
52 |
53 |
54 |
55 |
--------------------------------------------------------------------------------
/script.js:
--------------------------------------------------------------------------------
1 | var separator = "..";
2 | var step = 10000;
3 | var content__title = document.querySelector(".content__title");
4 | var context = "";
5 | var fonts = ["Arial", "Arial Unicode MS", "Courier New", "Georgia", "Tahoma", "Times", "Trebuchet", "Verdana"];
6 | var default_title = "Полезные символыМоя подборка";
7 |
8 | initial();
9 |
10 | function print_symbols ( min, max ) {
11 |
12 | var out = "";
13 | var placeOutput = document.getElementById("symbols");
14 | placeOutput.innerHTML = "Загрузка";
15 |
16 | out += "";
17 |
18 | if ( !max )
19 | max = min;
20 |
21 | if ( max > 0 ){
22 | min = ( min >= 0 ) ? min : max - step + 1;
23 |
24 | for ( var i = min; i <= max; i++ ){
25 | out += get_symbol (i, max);
26 | }
27 | }
28 | else {
29 | for( var k = 0; k < useful.length; k++ ){
30 | out += get_symbol (useful[k], max);
31 | }
32 | }
33 |
34 | out += "
";
35 |
36 | placeOutput.innerHTML = out;
37 |
38 | add_action_to_symbols_list();
39 | }
40 |
41 |
42 | function change_data ( data_range, text ) {
43 |
44 | var range = get_range_from_string ( data_range );
45 | var min = range[0];
46 | var max = range[1];
47 |
48 | print_symbols ( min, max );
49 | content__title.innerHTML = text + "" + data_range + "";
50 | change_href ( data_range, text );
51 | remove_class("current");
52 | highlight_current ( data_range );
53 | }
54 |
55 | function add_action_to_range_select () {
56 |
57 | var select = document.querySelector(".content__select");
58 |
59 | select.addEventListener('change', function() {
60 | var elem = this.options[this.selectedIndex];
61 | var data_range = elem.value;
62 | var text = elem.text
63 | .replace("• ", "");
64 | context = "select";
65 |
66 | change_data ( data_range, text );
67 | });
68 |
69 | }
70 |
71 | function show_range_for_elem ( elem ){
72 |
73 | var data_range = elem.getAttribute('data-range');
74 | var text = elem.textContent;
75 | context = "list";
76 |
77 | change_data ( data_range, text );
78 | elem.classList.add('current');
79 |
80 | }
81 |
82 | function add_action_to_range_list () {
83 |
84 | var list_items = document.querySelectorAll(".list--blocks LI");
85 |
86 | for ( var i = 0; i < list_items.length; i++ ){
87 | var item = list_items[i];
88 |
89 | item.addEventListener('click', function() {
90 | show_range_for_elem ( this );
91 | }, false);
92 | }
93 | }
94 |
95 | function show_range_for_url () {
96 |
97 | var text = "";
98 | context = "href";
99 | var hash = decodeURI(document.location.hash)
100 | .substr(1)
101 | .replace("• ", "");
102 | var hash_arr = hash.split(" ");
103 | var data_range = hash_arr[0];
104 |
105 | var start = 1;
106 |
107 | if ( hash.indexOf("..") < 0 ){
108 | data_range = hash_arr[0] + " " + hash_arr[1];
109 | start = 2;
110 | }
111 |
112 | for ( var i = start; i < hash_arr.length; i++ ){
113 | text += hash_arr[i];
114 | if ( i < hash_arr.length - 1 ) {
115 | text += " ";
116 | }
117 | }
118 |
119 | change_data ( data_range, text );
120 | }
121 |
122 | function add_action_to_symbols_list () {
123 | var chars = document.querySelectorAll(".show-case");
124 | var class_name = "entities__item--wide";
125 |
126 | for ( var i = 0; i < chars.length; i++ ){
127 | var chars_item = chars[i];
128 |
129 | chars_item.addEventListener ('click', function() {
130 |
131 | var parent = this.parentNode;
132 | var parent_class = parent.classList;
133 | var text = this.textContent;
134 |
135 | if ( !parent_class.contains( class_name )){
136 | close_show_case ();
137 | parent.classList.add( class_name );
138 | this.innerHTML = create_fonts_list ( text );
139 | }
140 | });
141 | }
142 |
143 | }
144 |
145 | function create_fonts_list ( char_item ) {
146 | var show_case_content = "";
147 |
148 | for ( var k = 0; k < fonts.length; k++ ) {
149 | var font = fonts[k];
150 | var font_class = font.toLowerCase(font);
151 | font_class = "f-" + string_to_class ( font_class );
152 |
153 | show_case_content += "";
154 | show_case_content += "" + font + "";
155 | show_case_content += "" + char_item + "";
156 | show_case_content += "";
157 | }
158 |
159 | return show_case_content;
160 | }
161 |
162 | function add_action_to_close () {
163 |
164 | var elems = document.querySelectorAll(".close");
165 |
166 | for ( var i = 0; i < elems.length; i++ ){
167 | elems[i].addEventListener ("click", function() {
168 | close_show_case ();
169 | });
170 | }
171 | }
172 |
173 | function close_show_case () {
174 |
175 | var class_name = "entities__item--wide";
176 | var show_case = document.querySelector(".entities__item--wide .show-case");
177 |
178 | if ( show_case ){
179 | var show_case_content = show_case.getAttribute("data-char");
180 | show_case.innerHTML = show_case_content;
181 | remove_class ( class_name );
182 | }
183 | }
184 |
185 | //___________ Common ___________
186 |
187 | function num_to_hex ( num ){
188 | return num.toString(16);
189 | }
190 |
191 | function hex_to_num ( hex ){
192 | const int = parseInt(hex, 16);
193 | return isNaN(int)
194 | ? null
195 | : int;
196 | }
197 |
198 | function num_readable( num ) {
199 | var num = num + "";
200 | return num.slice(-9, -6) + " " + num.slice(-6, -3) + " " + num.slice(-3);
201 | }
202 |
203 | function initial() {
204 |
205 | if ( document.location.hash != "" ){
206 | show_range_for_url();
207 | }
208 | else {
209 | print_symbols ( 0, 0 );
210 | content__title.innerHTML = default_title;
211 | }
212 |
213 | add_action_to_range_select();
214 | add_action_to_range_list();
215 | add_action_to_close ();
216 | }
217 |
218 | function get_symbol( i, max ) {
219 | var out = "";
220 | var char_i = String.fromCodePoint(i);
221 |
222 | out += "&#" + i + "";
223 | out += "\\" + num_to_hex(i) + "
";
224 | out += "";
225 | out += "";
226 | out += "\n";
227 |
228 | if ( i < max
229 | && i > 0
230 | && i % 1000 == 0
231 | && context == "page" ) {
232 | out += "\n";
233 | out += "" + i + "
";
234 | out += "";
235 | }
236 |
237 | return out;
238 | }
239 |
240 | function highlight_current_list_item ( data_range ) {
241 | var list_items = document.querySelectorAll(".list--blocks LI");
242 |
243 | for (var i = 0; i < list_items.length; i++ ){
244 | var elem = list_items[i];
245 | var data_range_attr = elem.getAttribute("data-range");
246 |
247 | if ( data_range_attr == data_range ) {
248 | elem.classList.add("current");
249 | }
250 | }
251 | }
252 | function highlight_current_option ( data_range ) {
253 | var list_items = document.querySelectorAll(".content__select option");
254 |
255 | for (var i = 0; i < list_items.length; i++ ){
256 | var elem = list_items[i];
257 | var data_range_attr = elem.value;
258 |
259 | if ( data_range_attr == data_range ) {
260 | elem.selected = true;
261 | }
262 | }
263 | }
264 |
265 | function highlight_current( data_range ) {
266 | if ( context != "list") {
267 | highlight_current_list_item ( data_range );
268 | }
269 | if ( context != "select" ){
270 | highlight_current_option ( data_range );
271 | }
272 | }
273 |
274 | function remove_class ( class_name ) {
275 |
276 | var current_item = document.querySelector("." + class_name);
277 |
278 | if ( current_item ) {
279 | current_item.classList.remove( class_name );
280 | }
281 | }
282 |
283 | function change_href ( data_range, text ) {
284 |
285 | var current_href = document.location.href;
286 | var href_arr = current_href.split("#");
287 |
288 | document.location.href = href_arr[0] + "#" + data_range + " " + text;
289 | }
290 |
291 | function get_range_from_string ( data_range ) {
292 |
293 | var range = data_range.split(separator);
294 | var min = hex_to_num( range[0] );
295 | var max = hex_to_num( range[1] );
296 | return [ min, max ];
297 | }
298 |
299 | function string_to_class ( str ) {
300 | var replace = / /gi;
301 | return str.replace( replace, "-");
302 | }
303 |
--------------------------------------------------------------------------------
/styles.css:
--------------------------------------------------------------------------------
1 | /* ---------------------- *\
2 | Reset
3 | \* ---------------------- */
4 |
5 | html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
6 | margin: 0;
7 | padding: 0;
8 | border: 0;
9 | font-size: 100%;
10 | font: inherit;
11 | vertical-align: baseline;
12 | }
13 |
14 |
15 | /* HTML5 display-role reset for older browsers */
16 |
17 | article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
18 | display: block;
19 | }
20 |
21 | body {
22 | line-height: 1;
23 | }
24 |
25 | ol, ul {
26 | list-style: none;
27 | }
28 |
29 | blockquote, q {
30 | quotes: none;
31 | }
32 |
33 | blockquote:before, blockquote:after, q:before, q:after {
34 | content: '';
35 | content: none;
36 | }
37 |
38 | table {
39 | border-collapse: collapse;
40 | border-spacing: 0;
41 | }
42 |
43 |
44 | /* ---------------------- *\
45 | Common
46 | \* ---------------------- */
47 |
48 | BODY {
49 | background: #FFF;
50 | font: 16px/1.4 'Trebuchet Ms', sans-serif;
51 | }
52 |
53 | ::-moz-selection {
54 | background: darkorange;
55 | color: #FFF;
56 | }
57 |
58 | ::selection {
59 | background: darkorange;
60 | color: #FFF;
61 | }
62 |
63 | A {
64 | color: steelblue;
65 | }
66 |
67 | A:hover {
68 | text-decoration: none;
69 | }
70 |
71 |
72 | /* ---------------------- *\
73 | Headers
74 | \* ---------------------- */
75 |
76 | H1 {
77 | font-size: 50px;
78 | }
79 |
80 | @media ( max-width: 565px) {
81 | H1 {
82 | font-size: 40px;
83 | }
84 | }
85 |
86 | @media ( max-width: 480px) {
87 | H1 {
88 | font-size: 30px;
89 | }
90 | }
91 |
92 | @media ( max-width: 390px) {
93 | H1 {
94 | font-size: 25px;
95 | }
96 | }
97 |
98 | H2 {
99 | font-size: 40px;
100 | }
101 |
102 | H3 {
103 | font-size: 35px;
104 | }
105 |
106 | @media ( max-width: 950px) {
107 | H3 {
108 | font-size: 30px;
109 | }
110 | }
111 |
112 | @media ( max-width: 720px) {
113 | H3 {
114 | font-size: 25px;
115 | }
116 | }
117 |
118 | @media ( max-width: 565px) {
119 | H3 {
120 | font-size: 20px;
121 | }
122 | }
123 |
124 | H4 {
125 | font-size: 25px;
126 | }
127 |
128 |
129 | /* ---------------------- *\
130 | Parts
131 | \* ---------------------- */
132 |
133 | .example {
134 | font-size: 30px;
135 | }
136 |
137 | P {
138 | margin: 20px 0;
139 | }
140 |
141 | P:first-child {
142 | margin-top: 0;
143 | }
144 |
145 | /* ---------------------- *\
146 | Fonts
147 | \* ---------------------- */
148 |
149 | .f-arial {
150 | font-family: Arial, sans-serif;
151 | }
152 |
153 | .f-courier-new {
154 | font-family: "Courier New", monospace;
155 | ;
156 | }
157 |
158 | .f-georgia {
159 | font-family: Georgia, serif;
160 | }
161 |
162 | .f-tahoma {
163 | font-family: Tahoma, sans-serif;
164 | }
165 |
166 | .f-times {
167 | font-family: Times, serif;
168 | }
169 |
170 | .f-trebuchet {
171 | font-family: "Trebuchet MS";
172 | }
173 |
174 | .f-verdana {
175 | font-family: Verdana, sans-serif;
176 | }
177 |
178 |
179 | /* ---------------------- *\
180 | Layout
181 | \* ---------------------- */
182 |
183 | .page-wrapper {
184 | min-width: 300px;
185 | max-width: 1160px;
186 | margin: 50px auto;
187 | padding: 0 20px;
188 | }
189 |
190 | .page-header {
191 | margin-bottom: 30px;
192 | padding-bottom: 30px;
193 | border-bottom: 1px solid #DDD;
194 | text-align: center;
195 | }
196 |
197 | .page-main {
198 | width: 100%;
199 | float: left;
200 | }
201 |
202 | .content {
203 | margin-right: 340px;
204 | }
205 |
206 | .page-aside {
207 | width: 310px;
208 | float: left;
209 | margin-left: -310px;
210 | }
211 |
212 | @media (max-width: 950px) {
213 | .content {
214 | margin-right: 0;
215 | }
216 | .page-aside {
217 | width: 100%;
218 | margin-left: 0;
219 | }
220 | }
221 |
222 | .section:after,
223 | .header--symbols:after,
224 | .list--entities:after {
225 | content: "";
226 | display: table;
227 | width: 100%;
228 | clear: both;
229 | }
230 |
231 | /* ---------------------- *\
232 | Entities List Header
233 | \* ---------------------- */
234 |
235 | .desc {
236 | margin-bottom: 30px;
237 | }
238 |
239 | .content__header {
240 | border-top: 1px solid #DDD;
241 | padding-top: 30px;
242 | }
243 |
244 | .content__select {
245 | float: right;
246 | max-width: 100%;
247 | margin-top: 20px;
248 | min-height: 1em;
249 | }
250 |
251 | option[disabled] {
252 | margin: 3px 0;
253 | padding: 5px 3px;
254 | background: #DDD;
255 | text-align: center;
256 | line-height: 2em;
257 | font-weight: bold;
258 | color: #000
259 | }
260 |
261 | .content__title {
262 | margin-right: 300px;
263 | }
264 |
265 | .content__title SPAN {
266 | margin-left: 10px;
267 | font-size: 14px;
268 | color: #999;
269 | }
270 |
271 | @media (max-width: 1150px) {
272 | .content__select {
273 | margin-bottom: 20px;
274 | float: none;
275 | }
276 | .content__title {
277 | margin-right: 0;
278 | }
279 | }
280 |
281 | /* ---------------------- *\
282 | Entities List
283 | \* ---------------------- */
284 |
285 | .entities {
286 | display: flex;
287 | flex-wrap: wrap;
288 | margin: 30px 0;
289 | padding: 2px;
290 | border: 1px solid #DDD;
291 | font-family: "Arial Unicode MS", Arial, sans-serif;
292 | font-size: 32px;
293 | line-height: 1;
294 | }
295 |
296 | .entities__item {
297 | display: block;
298 | position: relative;
299 | flex-basis: 80px;
300 | flex-grow: 1;
301 | max-width: 100px;
302 | height: 90px;
303 | margin: 2px;
304 | -webkit-box-sizing: border-box;
305 | -moz-box-sizing: border-box;
306 | box-sizing: border-box;
307 | border: 1px solid #DDD;
308 | }
309 |
310 | .entities__item--wide {
311 | flex-basis: 100%;
312 | max-width: 100%;
313 | height: 130px;
314 | margin: 15px 2px;
315 | border-width: 5px 0;
316 | border-top-color: hsl(100, 59%, 80%);
317 | border-bottom-color: powderblue;
318 | }
319 |
320 | .show-case {
321 | display: inline-block;
322 | position: absolute;
323 | left: 0;
324 | bottom: 10px;
325 | width: 100%;
326 | text-align: center;
327 | cursor: pointer;
328 | }
329 |
330 | .entities__item--wide .show-case {
331 | cursor: default;
332 | /*bottom: 4px;*/
333 | }
334 |
335 | .font-item {
336 | display: inline-block;
337 | position: relative;
338 | width: auto;
339 | height: 50px;
340 | margin: 0 2px;
341 | padding: 0 5px;
342 | border: 1px solid #DDD;
343 | line-height: 1;
344 | text-align: center;
345 | vertical-align: middle;
346 | }
347 |
348 | .font-name {
349 | content: attr(data-name);
350 | display: block;
351 | position: relative;
352 | margin-top: -15px;
353 | font: 13px/1 Arial, sans-serif;
354 | color: #999;
355 | }
356 |
357 | .font-demo:before {
358 | content: "";
359 | display: inline-block;
360 | height: 60px;
361 | width: 0;
362 | vertical-align: middle;
363 | }
364 |
365 | .entities CODE {
366 | position: absolute;
367 | z-index: 10;
368 | top: 2px;
369 | right: 2px;
370 | font-size: 12px;
371 | color: #555;
372 | }
373 |
374 | .entities__item--wide CODE {
375 | left: 2px;
376 | right: auto;
377 | }
378 |
379 | .num, .hex {
380 | padding: 2px;
381 | }
382 |
383 | LI .num, LI .hex {
384 | display: block;
385 | margin: 0 0 2px 0;
386 | }
387 |
388 | .num {
389 | background: hsl(100, 59%, 80%);
390 | }
391 |
392 | .hex {
393 | background: powderblue;
394 | }
395 |
396 | .close {
397 | display: none;
398 | position: absolute;
399 | right: 2px;
400 | top: 5px;
401 | z-index: 100;
402 | width: 1.6em;
403 | height: 1.6em;
404 | background: #999;
405 | border-radius: 50%;
406 | cursor: pointer;
407 | text-align: center;
408 | font-size: 12px;
409 | line-height: 1.6;
410 | color: #FFF;
411 | transition: all .3s;
412 | }
413 |
414 | .close:hover {
415 | background: tomato;
416 | }
417 |
418 | .close:before {
419 | content: "\2715";
420 | }
421 |
422 | .entities__item--wide .close {
423 | display: block;
424 | }
425 |
426 | /* ---------------------- *\
427 | Ranges List
428 | \* ---------------------- */
429 |
430 | .page-aside H4 {
431 | margin-bottom: 15px;
432 | }
433 |
434 | .widget {
435 | margin-bottom: 30px;
436 | }
437 |
438 | @media (max-width: 950px) {
439 | .widget {
440 | float: left;
441 | width: 48%;
442 | }
443 | .widget:nth-child(2) {
444 | float: right;
445 | }
446 | }
447 |
448 | @media ( max-width: 640px) {
449 | .widget {
450 | float: none;
451 | width: 100%;
452 | }
453 | }
454 |
455 | .page-aside LI {
456 | margin: 0 0 3px 20px;
457 | font-size: 14px;
458 | }
459 |
460 | .list--blocks SPAN {
461 | border-bottom: 1px dashed steelblue;
462 | cursor: pointer;
463 | color: steelblue;
464 | }
465 |
466 | .current SPAN {
467 | border-bottom: 0;
468 | color: #000;
469 | }
470 |
471 | .current SPAN:before {
472 | content: "\2192";
473 | margin-right: 5px;
474 | color: #AAA;
475 | }
476 |
--------------------------------------------------------------------------------
/useful-symbols.js:
--------------------------------------------------------------------------------
1 | var useful = [ 8226, 8231, 8249, 8250, 8251, 8258, 8270, 8273, 8277, 8278,
2 | 8280, 8281, 8282, 8283, 8284, 8285, 8286, 8404, 8405, 8413,
3 | 8415, 8416, 8417, 8419, 8592, 8593, 8594, 8595, 8596, 8597,
4 | 8598, 8599, 8600, 8601, 8604, 8605, 8606, 8607, 8608, 8609,
5 | 8610, 8611, 8612, 8613, 8614, 8615, 8616, 8617, 8618, 8619,
6 | 8620, 8621, 8623, 8624, 8625, 8626, 8627, 8628, 8629, 8630,
7 | 8631, 8634, 8635, 8644, 8645, 8646, 8647, 8648, 8649, 8650,
8 | 8656, 8657, 8658, 8659, 8660, 8661, 8662, 8663, 8664, 8665,
9 | 8666, 8667, 8668, 8669, 8670, 8671, 8672, 8673, 8674, 8675,
10 | 8676, 8677, 8678, 8679, 8680, 8681, 8682, 8683, 8684, 8685,
11 | 8686, 8687, 8688, 8689, 8690, 8691, 8692, 8693, 8694, 8695,
12 | 8696, 8697, 8698, 8699, 8700, 8701, 8702, 8703, 8756, 8757,
13 | 8758, 8759, 9022, 9587, 9650, 9651, 9652, 9653, 9654, 9655,
14 | 9656, 9657, 9658, 9659, 9660, 9661, 9662, 9663, 9664, 9665,
15 | 9666, 9667, 9668, 9669, 9670, 9671, 9672, 9673, 9674, 9675,
16 | 9676, 9677, 9678, 9679, 9680, 9681, 9682, 9683, 9684, 9685,
17 | 9686, 9687, 9728, 9729, 9730, 9731, 9732, 9733, 9734, 9742,
18 | 9743, 9752, 9753, 9754, 9755, 9756, 9757, 9758, 9759, 9760,
19 | 9762, 9763, 9764, 9772, 9773, 9774, 9775, 9784, 9785, 9786,
20 | 9787, 9788, 9789, 9790, 9812, 9813, 9814, 9815, 9816, 9817,
21 | 9818, 9819, 9820, 9821, 9822, 9823, 9824, 9825, 9826, 9827,
22 | 9828, 9829, 9830, 9831, 9833, 9834, 9835, 9836, 9872, 9873,
23 | 9874, 9876, 9877, 9878, 9879, 9880, 9881, 9882, 9883, 9884,
24 | 9985, 9986, 9987, 9988, 9990, 9991, 9992, 9993, 9996, 9997,
25 | 9998, 9999, 10000, 10001, 10002, 10003, 10004, 10005, 10006,
26 | 10007, 10008, 10009, 10010, 10011, 10012, 10013, 10014, 10015,
27 | 10016, 10017, 10018, 10019, 10020, 10021, 10022, 10023, 10025,
28 | 10026, 10027, 10028, 10029, 10030, 10031, 10032, 10033, 10034,
29 | 10035, 10036, 10037, 10038, 10039, 10040, 10041, 10042, 10043,
30 | 10044, 10045, 10046, 10047, 10048, 10049, 10050, 10051, 10052,
31 | 10053, 10054, 10055, 10056, 10057, 10058, 10059, 10548, 10549,
32 | 10550, 10551, 10552, 10553, 10554, 10555, 10558, 10559, 11008,
33 | 11009, 11010, 11011, 11012, 11013, 11014, 11015, 11016, 11017,
34 | 11018, 11019, 11020, 11021, 11039, 11040, 11041, 11042, 11043,
35 | 11044, 11045, 11046, 11047, 11048, 11049, 11050, 11051, 11052,
36 | 11053, 11054, 11055, 11089, 11090, 11091, 11092
37 | ];
--------------------------------------------------------------------------------