Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

hw added #672

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open

hw added #672

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
acbb194
hw added
progmari Mar 23, 2021
b98c7ee
fixed
progmari Mar 23, 2021
67a6cbe
fixed 2
progmari Mar 23, 2021
d81b085
Update style.css
progmari Mar 23, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,3 +11,4 @@ node_modules
# Generated files
backstop_data
dist
.cache
2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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",
Expand Down
20 changes: 10 additions & 10 deletions readme.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -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://progmari.github.io/layout_enclosures/) <br>
- [TEST REPORT LINK](https://progmari.github.io/layout_enclosures/report/html_report/)
2. Follow [this instructions](https://mate-academy.github.io/layout_task-guideline/)
___

Expand All @@ -13,22 +13,22 @@ Use this extension for Chrome to find out the right color [ColorZilla](https://c
* The width of each box is 350px (including all borders).
* You can find the exact values of colors by using an image editor program.
* The width of the redish border must be 1 pixel and color- #e95d49.
* The width of the bluish and yellowish borders must be 10 pixels (they, however,
* The width of the bluish and yellowish borders must be 10 pixels (they, however,
do not have to literally be borders of any HTML container).
* The space around the text must also be 10 pixels.
* The distance between the boxes and the edges of the page must be 20 pixels.
* The distance between the boxes themselves must be 40 pixels.

The text content in three languages follows:

> In programming languages, a closure is a technique for implementing lexically
scoped name binding in a language with first-class functions. Operationally, a
> 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.

> У програмуванні замиканням називають підпрограму, що виконується в середовищі,
яке містить одну або більше зв’язаних змінних. Підпрограма має доступ до цих
> У програмуванні замиканням називають підпрограму, що виконується в середовищі,
яке містить одну або більше зв’язаних змінних. Підпрограма має доступ до цих
змінних під час виконання.

> Замыкание в программировании — функция первого класса, в теле которой
присутствуют ссылки на переменные, объявленные вне тела этой функции в
окружающем коде и не являющиеся её параметрами.
> Замыкание в программировании — функция первого класса, в теле которой
присутствуют ссылки на переменные, объявленные вне тела этой функции в
окружающем коде и не являющиеся её параметрами.
47 changes: 36 additions & 11 deletions src/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,14 +1,39 @@
<!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>
<div class="block-blue" id="qa-block">
<div class="block-yellow">
<div class="block-gray">
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="block-blue">
<div class="block-yellow">
<div class="block-gray">
У програмуванні замиканням називають підпрограму, що виконується в середовищі, яке містить одну
або більше зв’язаних змінних.
Підпрограма має доступ до цих змінних під час виконання.
</div>
</div>
</div>
<div class="block-blue">
<div class="block-yellow">
<div class="block-gray">
Замыкание в программировании — функция первого класса, в теле которой присутствуют ссылки на переменные,
объявленные вне тела этой функции в окружающем коде и не являющиеся её параметрами.
</div>
</div>
</div>
</body>
</html>
28 changes: 28 additions & 0 deletions src/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
* {
box-sizing: border-box;
background-color: #000;
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

add background-color: #000 to body, not to ALL elements on the page

}

body {
margin: 20px;
}

.block-blue {
width: 350px;
background-color: #308dc0;
border: 1px solid #e95d49;
padding: 10px;
margin-bottom: 40px;
}

.block-yellow {
background-color: #ffa500;
border: 1px solid #e95d49;
padding: 10px;
}

.block-gray {
background-color: #ddd;
border: 1px solid #e95d49;
padding: 10px;
}