Новые уроки и полировка кода

public/data/id304.html

@@ -7,7 +7,7 @@
     <a href="https://vuetifyjs.com/ru/components/dialogs" target="_blank">https://vuetifyjs.com/ru/components/dialogs</a>,
     немного его модифицировав:
 
-    <div class="grey lighten-2" style="overflow-x: auto; border-radius: 5px;">
+    <div class="grey darken-3 white--text" style="overflow-x: auto; border-radius: 5px;">
         <pre>
 &lt;template>
     &lt;v-layout row justify-center>
@@ -21,7 +21,7 @@
                 &lt;v-card-text>{{ text }}&lt;/v-card-text>
                 &lt;v-card-actions>
                     &lt;v-spacer>&lt;/v-spacer>
-                    &lt;v-btn color="green darken-1" flat @click="dialog = false">Ok&lt;/v-btn>
+                    &lt;v-btn color="primary" flat @click="dialog = false">Ok&lt;/v-btn>
                 &lt;/v-card-actions>
             &lt;/v-card>
         &lt;/v-dialog>
@@ -48,7 +48,7 @@
     строку <code>MessageDialog</code>. Начало блока <code>&lt;sctipt>&lt;/script></code> должно выглядеть следующим
     образом:
 
-    <div class="grey lighten-2" style="overflow-x: auto; border-radius: 5px;">
+    <div class="grey darken-3 white--text" style="overflow-x: auto; border-radius: 5px;">
         <pre>
 &lt;script>
     import MessageDialog from './components/MessageDialog'
@@ -68,7 +68,7 @@
     <code>&ltMessageDialog ref="MessageDialog" /></code>, после чего останется только в коде скрипта добавить
     в секции .catch каждого обращения к Axios строки вызова нашего диалога с сообщением об ошибке:
 
-    <div class="grey lighten-2" style="overflow-x: auto; border-radius: 5px;">
+    <div class="grey darken-3 white--text" style="overflow-x: auto; border-radius: 5px;">
         <pre>
 .catch(error => {
     console.log(error);
@@ -87,7 +87,7 @@
     том, что оно работает, это нехорошо, давайте выводить при загрузке индикатор. Создадим компонент LoadingDialog.vue
     как всегда воспользовавшись шаблоном vuetify:
 
-    <div class="grey lighten-2" style="overflow-x: auto; border-radius: 5px;">
+    <div class="grey darken-3 white--text" style="overflow-x: auto; border-radius: 5px;">
         <pre>
 &lt;template>
     &lt;div class="text-xs-center">
@@ -139,7 +139,7 @@
 </p>
 <p>
     Справились? Теперь добавим код для отображения и скрытия диалога при загрузке файла в секцию mounted:
-    <div class="grey lighten-2" style="overflow-x: auto; border-radius: 5px;">
+    <div class="grey darken-3 white--text" style="overflow-x: auto; border-radius: 5px;">
         <pre>
 mounted () {
     this.$refs.LoadingDialog.dialog = true;
@@ -203,5 +203,5 @@ mounted () {
     P.S. Текст данной части можно взять тут: <a href="../data/id304.html" target="_blank">/data/id304.html</a>
 </p>
 <p>
-    P.P.S. Финальную версию можно скомпилировать командой <code>yarn build</code>.
+    P.P.S. Финальную версию можно скомпилировать командой <kbd>yarn build</kbd>.
 </p>