mate-academy · Namart · Mar 23, 2021 · Mar 23, 2021 · Mar 23, 2021 · aionova
diff --git a/.bemlintrc.json b/.bemlintrc.json
@@ -0,0 +1,16 @@
+{
+  "elementDivider": "__",
+  "modifierDivider": "_",
+  "ignore": [
+    "node_modules",
+    "dist"
+  ],
+  "rules": {
+    "one-block": true,
+    "one-element": true,
+    "element-inside-parent-block": true,
+    "no-double-element": true,
+    "no-neighbour-parent-block": true,
+    "modifiable-class": true
+  }
+}
diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
@@ -19,5 +19,11 @@ jobs:
       uses: actions/setup-node@v1
       with:
         node-version: ${{ matrix.node-version }}
-    - run: npm ci
+    - run: npm install
     - run: npm start & sleep 5 && npm test
+    - name: Upload HTML report(backstop data)
+      if: ${{ always() }}
+      uses: actions/upload-artifact@v2
+      with:
+        name: report
+        path: backstop_data
diff --git a/.gitignore b/.gitignore
@@ -11,3 +11,4 @@ node_modules
 # Generated files
 backstop_data
 dist
+.cache
diff --git a/package.json b/package.json
@@ -23,7 +23,7 @@
     "@mate-academy/bemlint": "^0.1.1",
     "@mate-academy/eslint-config": "*",
     "@mate-academy/linthtml-config": "0.0.1",
-    "@mate-academy/scripts": "^0.2.0",
+    "@mate-academy/scripts": "^0.8.4",
     "@mate-academy/stylelint-config": "*",
     "backstopjs": "^5.0.1",
     "eslint": "^5.16.0",

diff --git a/readme.md b/readme.md
@@ -1,7 +1,7 @@
 # Enclosures
 1. Replace `<your_account>` with your Github username in the links
-    - [DEMO LINK](https://<your_account>.github.io/layout_enclosures/) <br>
-    - [TEST REPORT LINK](https://<your_account>.github.io/layout_enclosures/report/html_report/)
+    - [DEMO LINK](https://Namart.github.io/layout_enclosures/) <br>
+    - [TEST REPORT LINK](https://Namart.github.io/layout_enclosures/report/html_report/)
 2. Follow [this instructions](https://mate-academy.github.io/layout_task-guideline/)
 ___
 

diff --git a/src/index.html b/src/index.html
@@ -1,14 +1,29 @@
 <!doctype html>
 <html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport"
-        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
-  <meta http-equiv="X-UA-Compatible" content="ie=edge">
-  <title>Enclosures</title>
-  <link rel="stylesheet" href="./style.css">
-</head>
-<body>
-  <h1>Enclosures</h1>
-</body>
+  <head>
+    <meta charset="UTF-8">
+    <meta name="viewport"
+          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>Enclosures</title>
+    <link rel="stylesheet" href="./style.css">
+  </head>
+  <body>
+    <!-- <h1>Enclosures</h1> -->
+    <div id="qa-block" class ="outer">
+      <div class="med">
+        <div class="inner">In programming languages, a closure is a technique for implementing lexically scoped name binding in a language with first-class functions. Operationally, a closure is a record storing a function together with an environment.</div>
+      </div>
+    </div >
+    <div  class ="outer">
+      <div class="med">
+        <div class="inner">У програмуванні замиканням називають підпрограму, що виконується в середовищі, яке містить одну або більше зв’язаних змінних. Підпрограма має доступ до цих змінних під час виконання.</div>
-        <div class="inner">У програмуванні замиканням називають підпрограму, що виконується в середовищі, яке містить одну або більше зв’язаних змінних. Підпрограма має доступ до цих змінних під час виконання.</div>
+        <div class="inner">
+          У програмуванні замиканням називають підпрограму, що виконується в середовищі, яке містить одну
+          або більше зв’язаних змінних. Підпрограма має доступ до цих змінних під час виконання.
+        </div>
-        <div class="inner">У програмуванні замиканням називають підпрограму, що виконується в середовищі, яке містить одну або більше зв’язаних змінних. Підпрограма має доступ до цих змінних під час виконання.</div>
+        <div class="inner">
+          У програмуванні замиканням називають підпрограму, що виконується в середовищі, яке містить одну
+          або більше зв’язаних змінних. Підпрограма має доступ до цих змінних під час виконання.
+        </div>
+      </div>
+    </div>
+    <div  class ="outer">
+      <div class="med">
+        <div class="inner">Замыкание в программировании — функция первого класса, в теле которой присутствуют ссылки на переменные, объявленные вне тела этой функции в окружающем коде и не являющиеся её параметрами.</div>
+      </div>
+    </div>
+  </body>
 </html>
diff --git a/src/style.css b/src/style.css
@@ -0,0 +1,32 @@
+body {
+  margin: 0;
+  background-color: #000;
+  font-size: 16px;
+}
+
+.outer {
+  box-sizing: border-box;
+  width: 350px;
+  padding: 10px;
+  margin: 40px 20px;
+  background-color: #0090c2;
+  border: 1px solid #e95d49;
+}
+
+.med {
+  box-sizing: border-box;
+  padding: 10px;
+  border: 1px solid #e95d49;
+  background-color: #ffa100;
+}
+
+.inner {
+  box-sizing: border-box;
+  padding: 10px;
+  border: 1px solid #e95d49;
+  background-color: #dedede;
+}
+
+.outer:first-child {
+  margin-top: 20px;
+}
-Original file line number
+Diff line change
@@ Expand Up / @@ -11,3 +11,4 @@ node_modules @@
     # Generated files
     backstop_data
     dist
+    .cache