phoenix/samples/bg/Getting Started/index.html at a65a767669242b0f3a8c0ac1116f8591124285b4 · phcode-dev/phoenix · GitHub

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
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
<!DOCTYPE html>
<html>

    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>ПЪРВИ СТЪПКИ С BRACKETS</title>
        <meta name="description" content="Интерактивно ръководство за Brackets.">
        <link rel="stylesheet" href="main.css">
    </head>
    <body>

        <h1>ПЪРВИ СТЪПКИ С BRACKETS</h1>
        <h2>Това е Вашето ръководство!</h2>

        <!--
            СЪЗДАДЕН С <3 И JAVASCRIPT
        -->

        <p>
            Добре дошли в Brackets, модерен редактор за код с отворен код, който разбира от уеб дизайн. Това е лек,
            но мощен редактор за код, който слива визуалните инструменти с редактора, така че да получавате достатъчно
            помощ, когато сте в нужда.
        </p>

        <!--
            КАКВО Е BRACKETS?
        -->
        <p>
            <em>Brackets е един различен вид редактор.</em>
            Brackets има някои уникални функционалности, като бързо редактиране, преглед на живо и други, които може да не
            откриете в други редактори. Brackets е написан на JavaScript, HTML и CSS. Това означава, че повечето от хората,
            които използват Brackets имат уменията и да го променят и подобряват. Всъщност, ние самите използваме Brackets
            всеки ден, за да градим Brackets. За да научите повече относно ключовите функционалности, продължавайте да четете.
        </p>

        <!--
            ПЪРВИ СТЪПКИ С ВАШИТЕ ФАЙЛОВЕ
        -->

        <h3>Проектите в Brackets</h3>
        <p>
            За да редактирате своя код в Brackets, трябва да отворите папката, съдържаща файловете Ви.
            Brackets смята текущо отворената папка за „проект“; функционалностите като подсказки за кода, преглед на живо и
            бързо редактиране работят само с файловете в текущо отворената папка.
        </p>

        <samp>
            След като приключите с разглеждането на този примерен проект и искате да редактирате собствен код, можете да
            използвате падащото меню в лявата странична лента, за да превключвате между папките. В момента там е избрано
            „Getting Started“ — това е папката, съдържаща файла, който разглеждате в момента. Щракнете върху падащото меню и
            изберете „Отваряне на папка…“, за да отворите своя собствена папка.
            Можете да използвате това падащо меню, за да се връщате обратно към папките, които сте отворили по-рано,
            включително този примерен проект.
        </samp>

        <!--
            ВРЪЗКАТА МЕЖДУ HTML, CSS И JAVASCRIPT
        -->
        <h3>Бързо редактиране на CSS и JavaScript</h3>
        <p>
            Без повече превключване между документи и забравяне къде сте били последно. Когато редактирате HTML, използвайте
            комбинацията <kbd>Cmd/Ctrl + E</kbd>, за да отворите бърз редактор на място, който показва използвания CSS.
            Променете CSS кода, натиснете <kbd>ESC</kbd> и се връщате към редактирането на HTML, или просто оставете
            CSS правилата отворени и те ще станат част от редактора Ви за HTML. Ако натиснете <kbd>ESC</kbd> извън
            вмъкнатия бърз редактор, всички такива ще се скрият. Бързото редактиране разпознава и правила, описани чрез
            LESS и SCSS, включително и вложени правила.
        </p>

        <samp>
            Искате да го видите в действие? Поставете курсора върху елемента <!-- <samp> --> по-горе и натиснете
            <kbd>Cmd/Ctrl + E</kbd>. Би трябвало да се появи бърз редактор за CSS, показващ CSS правилото, което
            се прилага към този елемент. Бързото редактиране може да работи също и за класове и идентификатори.
            Можете дори да го използвате с Вашите файлове с LESS и SCSS.

            Можете да създавате правила по същия начин. Щракнете върху един от елементите <!-- <p> --> по-гори и
            натиснете <kbd>Cmd/Ctrl + E</kbd>. В момента няма правила за тях, но можете да натиснете бутона
            „Ново правило“ и да добавите ново правило за <!-- <p> -->.
        </samp>

        <a href="screenshots/quick-edit.png">
            <img alt="Снимка на екрана, показваща бързото редактиране на CSS" src="screenshots/quick-edit.png" />
        </a>

        <p>
            Можете да използвате същата клавишна комбинация, за да редактирате и други неща — например функции на
            JavaScript, цветове и времеви функции за анимации; ние постоянно добавяме още.
        </p>
        <p>
            За сега редакторите на място не могат да се влагат един в друг, така че можете да използвате бързото
            редактиране само когато курсорът е в „пълния“ редактор.
        </p>

        <!--
            ПРЕГЛЕД НА ЖИВО
        -->
        <h3>Преглеждайте промените в HTML и CSS на живо в браузъра</h3>
        <p>
            Нали знаете как години наред си играем на „запазване и презареждане“? Играта, в която правите
            промяна в редактора си, натискате „запазване“, превключвате към браузъра и натискате „презареждане“,
            за да видите резултата?
            С Brackets, няма да ви се налага да я играете повече.
        </p>
        <p>
            Brackets ще отвори <em>жива връзка</em> с браузъра Ви и ще му праща промените в HTML и CSS кода
            докато пишете! Може би вече правите нещо подобно с различни инструменти, работещи в браузъра, но с Brackets
            няма да има нужда да копирате готовия код обратно в редактора. Кодът Ви работи в браузъра, но
            живее в редактора!
        </p>

        <h3>Осветява на HTML елементи и CSS правила на живо</h3>
        <p>
            С Brackets е лесно да видите как промените Ви в HTML и CSS ще променят страницата. Когато курсорът
            е върху CSS правило, Brackets ще осветява всички елементи, върху които то влияе, в браузъра. Също
            така, докато редактирате файл с HTML, Brackets ще осветява съответстващите елементи в браузъра.
        </p>

        <samp>
            Ако имате Google Chrome, може да опитате това. Щракнете иконката на светкавица в горния десен
            ъгъл на прозореца на Brackets или натиснете <kbd>Cmd/Ctrl + Alt + P</kbd>. Когато прегледът на живо
            е включен за даден HTML документ, всички свързани CSS документи могат да бъдат редактирани в реално време.
            Иконката ще смени цвета си от сив на златист, когато Brackets установи връзка с браузъра Ви.

            Сега поставете курсора си върху елемента <!-- <img> --> по-горе. Забележете синия контур,
            който се появява около изображението в Chrome. Сега натиснете <kbd>Cmd/Ctrl + E</kbd>, за да
            отворите CSS правилата. Опитайте да промените размера на рамката от 10 на 20 пиксела или
            променете цвета на фона от „transparent“ на „hotpink“. Ако Brackets и браузърът Ви работят
            един до друг, ще видите как промените Ви автоматично се виждат в браузъра. Яко, нали?
        </samp>

        <p class="note">
            Засега Brackets поддържа преглед на живо само за HTML и CSS. И все пак, в текущото издание, промените във
            файловете с код на JavaScript се презареждат автоматично при запазване на файла. В момента работим върху
            поддръжката на преглед на живо и за JavaScript. Прегледът на живо работи само с Google Chrome, но се надяваме
            да поддържаме всички основни браузъри в бъдеще.
        </p>

        <h3>Бърз преглед</h3>
        <p>
            Онези от нас, които не могат да запомнят съответствието между цветовете, изразени чрез шестнадесетични
            числа и стойности ЧЗС, Brackets прави лесна и бърза проверката на това кой цвят се използва. Както в CSS,
            така и в HTML, можете просто да посочите дадена цветова стойност или преливка, и Brackets ще Ви покаже как
            изглежда този цвят или преливка автоматично. Същото важи и за изображенията: просто посочете връзката към
            изображението в редактора и ще се появи миниатюрен изглед на това изображение.
        </p>

        <samp>
            За да опитате бързия преглед сами, поставете курсора върху елемента <!-- <body> --> в началото на този
            документ и натиснете <kbd>Cmd/Ctrl + E</kbd>, за да отворите бързия редактор на CSS. Сега просто посочете
            някоя стойност за цвят. Можете да видите това и при преливките, като отворите бърз редактор за
            елемента <!-- <html> --> и посочите някоя от стойностите за фона. За да опитате прегледа на изображения,
            поставете курсора върху снимката на екрана, която може да намерите по-нагоре в този документ.
        </samp>

        <h3>Имате нужда от повече? Опитайте някое разширение!</h3>
        <p>
            Освен всички приятни функционалности, вградени в Brackets, нашата огромна и постоянно нарастваща
            общност от разработчици на разширения е създала стотици такива, които добавят полезни и удобни функционалности.
            Ако има нещо, от което се нуждаете, но не намирате в Brackets, много вероятно е някой вече да е създал
            разширение за това. За да разгледате или претърсите списъка от налични разширения натиснете
            <strong>Файл > Управител на разширения…</strong> и изберете раздела „Налични“. Когато намерите това,
            което искате, просто натиснете бутона „Инсталиране“ до него.
        </p>

        <!--
            КАЖЕТЕ НИ КАКВО МИСЛИТЕ
        -->
        <h2>Включете се</h2>
        <p>
            Brackets е проект с отворен код. Разработчици от цял свят допринасят, за да изградим заедно
            един по-добър редактор за код. Много други създават разширения, които увеличават възможностите
            на Brackets. Кажете ни какво мислите, споделете идеите си или направо се включете в проекта!
        </p>
        <ul>
            <li><a href="http://brackets.io">Brackets.io</a></li>
            <li><a href="http://blog.brackets.io">Блогът на екипа зад Brackets</a></li>
            <li><a href="https://github.com/adobe/brackets">Brackets в GitHub</a></li>
            <li><a href="https://brackets-registry.aboutweb.com">Регистър на разширенията за Brackets</a></li>
            <li><a href="https://github.com/adobe/brackets/wiki">Уикито на Brackets</a></li>
            <li><a href="https://groups.google.com/forum/#!forum/brackets-dev">Пощенският списък на разработчиците на Brackets</a></li>
            <li><a href="https://twitter.com/brackets">@brackets в Туитър</a></li>
            <li>Пишете си с разработчиците на Brackets в IRC канала <a href="http://webchat.freenode.net/?channels=brackets&uio=d4">#brackets във Freenode</a></li>
        </ul>

    </body>
</html>
<!--

    [[[[[[[[[[[[[[[      ]]]]]]]]]]]]]]]
    [::::::::::::::      ::::::::::::::]
    [::::::::::::::      ::::::::::::::]
    [::::::[[[[[[[:      :]]]]]]]::::::]
    [:::::[                      ]:::::]
    [:::::[                      ]:::::]
    [:::::[                      ]:::::]
    [:::::[                      ]:::::]
    [:::::[     CODE THE WEB     ]:::::]
    [:::::[  http://brackets.io  ]:::::]
    [:::::[                      ]:::::]
    [:::::[                      ]:::::]
    [:::::[                      ]:::::]
    [:::::[                      ]:::::]
    [::::::[[[[[[[:      :]]]]]]]::::::]
    [::::::::::::::      ::::::::::::::]
    [::::::::::::::      ::::::::::::::]
    [[[[[[[[[[[[[[[      ]]]]]]]]]]]]]]]

-->