diff --git a/img/avatar.jpeg b/img/avatar.jpeg new file mode 100644 index 0000000..ded12ac Binary files /dev/null and b/img/avatar.jpeg differ diff --git a/img/git_logo.png b/img/git_logo.png new file mode 100644 index 0000000..9490ffc Binary files /dev/null and b/img/git_logo.png differ diff --git a/img/logo-rsschool3.png b/img/logo-rsschool3.png new file mode 100644 index 0000000..2104b9e Binary files /dev/null and b/img/logo-rsschool3.png differ diff --git a/index.html b/index.html index dd86714..e3c3b23 100644 --- a/index.html +++ b/index.html @@ -3,10 +3,127 @@ - Document + CV Page Dmitry B. + + + -

Hello World

+
+ +
+
+
+
+
+
+ avatar +
+
+

Дмитрий Белов

+

Front - End developer

+
+
+
+
+
+
+

About me

+
I like to study and learn something new. + I like to read books, do physical education, listen to music of different genres. + I'm fond of good cars and bikes. I lead active and healhy lifestyle. + I like to work and see the results of my work. + Since childhood, I have had a predisposition to work with electronics and computers. + I like to disassemble, assemble and configure something. + I can build, configure, solve problems with computers. +
+
+
+
+
+

Skills

+
    +
  • HTML
  • +
  • CSS
  • +
  • JS
  • +
  • Git
  • +
  • Figma
  • +
+
+
+
+
+
+

Code Example

+
+
+
+                        
+                            function factorial(n) {
+                                if (n ❮ 0) return null;
+                                if (n === 0) return 1;
+                                return n * factorial(n-1);
+                               }
+                        
+                    
+
+
+
+
+
+

Language

+
+
    +
  • English - (A1-A2)
  • +
  • Russian - native
  • +
  • Ukranian - native
  • +
+
+
+
+
+
+

Contacts:

+
+ GitHub +
+
+ Telegram +
+
+ Discord +
+
+
+
+ \ No newline at end of file diff --git a/style.css b/style.css index 466d7ae..d04d746 100644 --- a/style.css +++ b/style.css @@ -1,3 +1,244 @@ -body { - background-color: aquamarine; +* { + box-sizing: border-box; + margin: 0; +} + +html { + .roboto-light { + font-family: "Roboto", sans-serif; + font-weight: 300; + font-style: normal; + } + + .roboto-regular { + font-family: "Roboto", sans-serif; + font-weight: 400; + font-style: normal; + } + + .roboto-medium { + font-family: "Roboto", sans-serif; + font-weight: 500; + font-style: normal; + } + + .roboto-bold { + font-family: "Roboto", sans-serif; + font-weight: 700; + font-style: normal; + } + + .roboto-black { + font-family: "Roboto", sans-serif; + font-weight: 900; + font-style: normal; + } +} + +.container { + max-width: 1140px; + margin: 0 auto; +} + +header { + background: #68768c; +} + +header nav .list { + padding: 15px 0; + display: flex; + justify-content: space-between; + list-style-type: none; + +} + +header nav .list_item_link { + color: #000; + font-family: Roboto; + font-weight: 500; + font-size: 16px; + text-decoration: none; +} + +header nav .list_item_link:hover{ + color: #ffffffe5; + font-family: Roboto; + font-weight: 500; + font-size: 16px; + text-decoration: none; +} + +main { + padding-top: 15px; + background-color: #FFFDD0; +} + + +.section_wrap { + display: flex; + justify-content: space-around; +} + +.section_wrap_foto_img { + max-width: 250px; + height: auto; + border-radius: 50%; +} + +.section_wrap_name { + padding-top: 100px; +} + +.section_wrap_name_sup { + font-family: Roboto; + font-weight: 900; + font-size: 24px; +} + +.section_wrap_name_sub { + font-family: Roboto; + font-weight: 700; + font-size: 18px; + text-align: center; +} + +/* section about */ + +.about { + padding-top: 15px; +} + +.about_h2 { + font-family: Roboto; + font-weight: 700; + font-size: 24px; + text-align: center; +} + +.about_descr { + padding-top: 15px; + font-family: Roboto; + font-weight: 300; + font-size: 18px; +} + +/* section skills */ + +.skills { + margin-top: 45px; +} + +.skills h2 { + font-family: Roboto; + font-weight: 700; + font-size: 24px; + text-align: center; +} + +.skills_list { + margin-top: 15px; + display: flex; + justify-content: space-around; + padding: 0; +} + +.skills_list_item { + font-family: Roboto; + font-weight: 500; + font-size: 24px; +} + +.code { + padding-top: 45px; +} + +.code_sup h2 { + font-family: Roboto; + font-weight: 700; + font-size: 24px; + text-align: center; +} + +/* language */ + +.language { + padding-top: 45px; +} + +.language_sup { + font-family: Roboto; + font-weight: 700; + font-size: 24px; + text-align: center; +} + +.language_list { + padding: 15px 0; + display: flex; + justify-content: center; +} + +.language_list ul li { + font-family: Roboto; + font-weight: 300; + font-size: 18px; +} + +.contacts { + padding: 15px 0; +} + +.contacts h2 { + text-align: center; +} + +.contacts_social { + text-align: center; + padding-top: 5px; +} + +footer { + padding: 15px; + background: #68768c; +} + +.box { + display: flex; + justify-content: space-around; +} + +.box_mygit { +display: flex; +} + +.box_mygit img { + display: block; + width: 50px; + height: 50px; +} + +.box_mygit_text { + padding: 10px 0 0 10px; + font-family: Roboto; + font-weight: 500; + font-size: 24px; +} + +.box_mygit_text a { + text-decoration: none; + color:#000 +} + +.box_date { + padding-top: 8px; + font-family: Roboto; + font-weight: 500; + font-size: 24px; +} +.box_school { + padding-top: 5px; +} + +.box_school img{ + width: 100px; } \ No newline at end of file