diff --git a/cv.md b/cv.md new file mode 100644 index 0000000..95c4d57 --- /dev/null +++ b/cv.md @@ -0,0 +1,23 @@ +**Junior Developer Resume.** + + +1. My name is Yauheni Shypila. +2. My mobile phone number is: *+375293754811*. You can find me on *Telegram* and *Viber*. My Skype is *evshipilo*, my e-mail is *evshipilo@gmail.com*. +3. I really like to learn something new. My goal is to become a software developer and I will achieve it. +4. I was learning front end. I have studied HTML, SCC and JS basics. I have studied the *JAVA* basics too. I was working in *Intellij IDEA, WEB Storm* and *Brackets* IDEs. +5. Some JS code example: + ```javascript + function camelize(str) { + let arr = str.split('-'); + arr[0] = arr[0].toLowerCase(); + for (let i = 1; i < arr.length; i++) { + let a=arr[i]; + arr[i]=a[0].toUpperCase()+a.slice(1); + } + return (arr.join('')); + } + + ``` +6. [Here you can see my portfolio.](http://r29735qf.beget.tech/) +7. I was learning JAVA in online JAVA Rush courses. Now I am studying JS in Rolling Scopes School. +8. I am improving my English skills in offline courses and in *Duolingo* application. \ No newline at end of file diff --git a/img/avatar.jpg b/img/avatar.jpg new file mode 100644 index 0000000..06ac2f6 Binary files /dev/null and b/img/avatar.jpg differ diff --git a/img/call-answer.png b/img/call-answer.png new file mode 100644 index 0000000..0ed5028 Binary files /dev/null and b/img/call-answer.png differ diff --git a/img/github.png b/img/github.png new file mode 100644 index 0000000..08bba55 Binary files /dev/null and b/img/github.png differ diff --git a/img/global.png b/img/global.png new file mode 100644 index 0000000..337d473 Binary files /dev/null and b/img/global.png differ diff --git a/img/message-envelope.png b/img/message-envelope.png new file mode 100644 index 0000000..33c951d Binary files /dev/null and b/img/message-envelope.png differ diff --git a/img/skype.png b/img/skype.png new file mode 100644 index 0000000..b6a1e7a Binary files /dev/null and b/img/skype.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..77ca2bc --- /dev/null +++ b/index.html @@ -0,0 +1,113 @@ + + + + + HTML, CSS & Git Basics + + + + +
+
+ +
+
+

Yauheni Shypila

+

Beginner Front-End Developer

+
+
+ + avatar +
+
+

Contacts:

+ +
+
+

My projects:

+ +
+
+

My Goals:

+

I really like to learn something new. My goal is to become a software + developer and I will achieve it.

+
+
+

My Skills:

+

I was learning front end. I have studied HTML, SCC and JS basics. + I have studied the JAVA basics too. I was working in Intellij + IDEA, WEB Storm and Brackets IDEs.

+
+
+

+ Some JS code example: +

+ 
+function camelize(str) {
+   let arr = str.split('-');
+   arr[0] = arr[0].toLowerCase();
+   for (let i = 1; i < arr.length; i++) {
+       let a=arr[i];
+       arr[i]=a[0].toUpperCase()+a.slice(1);
+   }
+   return (arr.join(''));
+}
+
+
+ + + +
+ + + + \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..8753fef --- /dev/null +++ b/style.css @@ -0,0 +1,154 @@ +body { + font-family: 'Raleway', sans-serif; +} + +.container { + max-width: 1024px; + margin: auto; + display: grid; + grid-gap: 5px; + grid-template-columns: repeat(4, 1fr); + grid-template-areas: + " section0 header header section1 " + "section2 section2 section3 section3 " + "section4 section5 section6 section6 " + ". footer footer ."; +} + +.container > * { + /*background-color: cornsilk;*/ + border-radius: 10px; + border: 1px solid rgba(205, 214, 219, 0.5); + padding-left: 10px; + padding-right: 10px; +} + +header { + grid-area: header; + background-color: rgba(106, 158, 209, 0.15); +} + +.section0 { + grid-area: section0; + background-color: rgba(209, 106, 106, 0.15); +} + +.section1 { + grid-area: section1; + text-align: center; + background-color: rgba(209, 209, 106, 0.15); +} + +.section1 img { + border-radius: 50%; + padding-top: 4px; + opacity: 0.6; + width: 80%; +} + +.section2 { + grid-area: section2; + background-color: rgba(209, 106, 209, 0.15); +} + +.section3 { + grid-area: section3; + background-color: rgba(165, 14, 165, 0.15); +} + +.section4 { + grid-area: section4; + background-color: rgba(128, 75, 75, 0.15); +} + +.section5 { + grid-area: section5; + background-color: rgba(20, 20, 106, 0.15); +} + +.section6 { + grid-area: section6; + background-color: rgba(172, 100, 70, 0.15); +} + +footer { + grid-area: footer; + background-color: cornsilk; +} + +footer p { + display: inline-block; +} + +footer div { + float: right; +} + +footer img { + margin-left: 5px; + margin-top: 17px; +} + +ul { + list-style-type: none; + padding-left: 0; +} + +li { + margin-bottom: 10px; +} + +li img { + padding-right: 10px; +} + +a { + text-decoration: none; + color: black; +} + +a:hover { + color: red; + filter: blur(0.06rem); + transition: 0.5s; +} + +p { + text-align: justify; +} + +@media (max-width: 800px) { + .container { + + grid-template-columns: repeat(2, 1fr); + grid-template-areas: + " header section1 " + "section2 section3 " "section4 section5 " + "section6 section6" "footer footer"; + } + +} + +@media (max-width: 600px) { + .container { + + grid-template-columns: repeat(1, 1fr); + grid-template-areas: + " header " + "section1" + "section2" + "section3" + "section4" + "section5" + "section6" + "footer"; + } + + .section1 img { + max-width: 50%; + border-radius: 50%; + padding-top: 4px; + opacity: 0.6; + + } +}