diff --git a/css/main.css b/css/main.css deleted file mode 100644 index 7de1985..0000000 --- a/css/main.css +++ /dev/null @@ -1,20 +0,0 @@ -*{ - margin: 0; - padding: 0; -} -body{ - padding-left: 15%; - padding-right: 15%; -} -.header{ - display: flex; - background-color: red; -} -.header a{ - flex-direction: column; - background-color: blue; - margin: 5px; -} -.header a .right{ - justify-content: flex-end; -} \ No newline at end of file diff --git a/index.html b/index.html deleted file mode 100644 index 5aaf139..0000000 --- a/index.html +++ /dev/null @@ -1,73 +0,0 @@ - - - - - - - Filip Rojek - - - -
- Home - Projects - Blog - Contact me -
-
-

Vítej na mé stránce

-

Lorem ipsum dolor sit amet consectetur adipisicing elit. Temporibus ea totam debitis porro, incidunt quam tempora sint, cumque cupiditate aliquid libero neque inventore. Consequuntur exercitationem temporibus vero enim, labore earum.

-
-
-

Projekty

-
-
-

Fofrbazar

- link -

Lorem ipsum dolor sit amet consectetur adipisicing elit. Nisi necessitatibus sequi molestiae iste eos corrupti obcaecati voluptatibus tempora expedita libero. Consectetur, sunt voluptate. Similique, maiores magnam soluta natus animi doloremque.

-
-
-
    -
  • Php 7.4
    • -
  • Laravel 8
    • -
  • MySQL
    • -
  • Vue.js
    • -
-
-
- GitHub -
-
-
-
-

Portfolio

- link -

Lorem, ipsum dolor sit amet consectetur adipisicing elit. Earum maxime, quis enim, magni modi labore recusandae reiciendis nisi assumenda incidunt commodi quae sapiente pariatur? Recusandae, corporis minus. Eligendi, ducimus consectetur.

-
-
-
    -
  • Node.js
    • -
  • Express.js
    • -
  • REST Api
    • -
  • MongoDB
    • -
-
-
- GitHub -
-
-
- - - \ No newline at end of file diff --git a/v1/css/main.css b/v1/css/main.css new file mode 100644 index 0000000..2301e85 --- /dev/null +++ b/v1/css/main.css @@ -0,0 +1,80 @@ +:root{ + --fontFam: 'Poppins', sans-serif; +} + +*{ + margin: 0; + padding: 0; + box-sizing: border-box; + font-family: var(--fontFam); +} + +body{ + display: flex; + flex-direction: column; + align-items: center; + +} + +.page{ + width: 80%; + margin-top: 3rem; +} + +.page > *{ + margin: 2rem; +} + +.projects > *{ + margin-top: 2rem; +} + +.project > *{ + margin: 1rem; +} + +.header{ + position: fixed; + top: 0; + left: 0; + display: flex; + background-color: white; + z-index: 10; + justify-content: space-between; + padding: 1rem; + width: 100%; + box-shadow: rgb(0 0 0 / 5%) 0px 6px 24px 0px, rgb(0 0 0 / 8%) 0px 0px 0px 1px;} +.header a{ + margin: 5px; + text-decoration: none; + color: black; + font-size: 15px; +} + +header h3{ + position: relative; + z-index: 4; + color: blue; + font-size: 1.2rem; + filter: drop-shadow(0 0 0.25rem rgba(0,0,0,0.2)); +} + +header h3:after{ + content: ''; + position: absolute; + font-size: 1.9rem; + color: rgba(128, 128, 128, 0.219); + bottom: -15px; + right: -70px; + z-index: 1; +} + +header h3::before{ + content: '#BEZ tagů'; + position: absolute; + font-size: 1.5rem; + color: rgba(128, 128, 128, 0.219); + bottom: 5px; + z-index: 1; + left: -80px; +} \ No newline at end of file diff --git a/v1/index.html b/v1/index.html new file mode 100644 index 0000000..f0ea5ae --- /dev/null +++ b/v1/index.html @@ -0,0 +1,87 @@ + + + + + + + Filip Rojek + + + + + + + + +
+
+ Home + Projects + Blog +
+
+

Filip Roudžek

+
+
+ Contact me +
+
+
+
+

Vítej na mé stránce

+

Lorem ipsum dolor sit amet consectetur adipisicing elit. Temporibus ea totam debitis porro, incidunt quam tempora sint, cumque cupiditate aliquid libero neque inventore. Consequuntur exercitationem temporibus vero enim, labore earum.

+
+
+

Projekty

+
+
+

Fofrbazar

+ link +

Lorem ipsum dolor sit amet consectetur adipisicing elit. Nisi necessitatibus sequi molestiae iste eos corrupti obcaecati voluptatibus tempora expedita libero. Consectetur, sunt voluptate. Similique, maiores magnam soluta natus animi doloremque.

+
+
+
    +
  • Php 7.4
    • +
  • Laravel 8
    • +
  • MySQL
    • +
  • Vue.js
    • +
+
+
+ GitHub +
+
+
+
+

Portfolio

+ link +

Lorem, ipsum dolor sit amet consectetur adipisicing elit. Earum maxime, quis enim, magni modi labore recusandae reiciendis nisi assumenda incidunt commodi quae sapiente pariatur? Recusandae, corporis minus. Eligendi, ducimus consectetur.

+
+
+
    +
  • Node.js
    • +
  • Express.js
    • +
  • REST Api
    • +
  • MongoDB
    • +
+
+
+ GitHub +
+
+
+ +
+ + \ No newline at end of file diff --git a/v1/js/app.js b/v1/js/app.js new file mode 100644 index 0000000..7291e1d --- /dev/null +++ b/v1/js/app.js @@ -0,0 +1,8 @@ +const listItems = document.querySelectorAll('li') +const header = document.querySelectorAll('header') + +const Fíla = document.querySelector('.jmeno h3') +gsap.from(listItems,{ opacity: 0, stagger: 0.1, ease: 'power4.out', duration: .6, x: -30, delay: .3}) +gsap.from(header, {y:-100}) + +gsap.fromTo(Fíla, {opacity: 0, scale: .9}, {opacity:1, scale:1, delay: 1}) \ No newline at end of file diff --git a/v2/css/style.css b/v2/css/style.css new file mode 100644 index 0000000..62146a2 --- /dev/null +++ b/v2/css/style.css @@ -0,0 +1,70 @@ +@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap'); +:root{ + --text-color: black; +} +*{ + box-sizing: border-box; + padding: 0px; + margin: 0px; +} +html{ + height: 100%; +} +body{ + font-family: 'Open Sans', sans-serif; + min-height: 100vh; + display: flex; + flex-direction: column; +} +.header{ + display: flex; + justify-content: center; + margin-bottom: 1.5rem; + font-size: 1.5rem; +} +.header .left{ + display: flex; + gap: 1rem; +} +.header a{ + text-decoration: underline; + color: var(--text-color); +} +.header .jmeno{ + text-align: center; +} +.header > *{ + width: 100%; +} +.header .right{ + text-align: right; +} +.wrapper{ + margin-right: auto; + margin-left: auto; + max-width: 80%; + padding-right: 10px; + padding-left: 10px; +} +.page > *{ + margin-bottom: 3rem; +} +.projects > *:not(:first-child){ + margin-bottom: 1rem; +} +.projects > :first-child{ + margin-bottom: .5rem; +} +.footer{ + display: flex; + flex-direction: column; + align-items: center; + margin-top: auto; +} +.footer .text{ + font-size: 1.3rem; +} +.footer .links a{ + color: var(--text-color); + text-decoration: underline; +} \ No newline at end of file diff --git a/v2/index.html b/v2/index.html new file mode 100644 index 0000000..4b97b74 --- /dev/null +++ b/v2/index.html @@ -0,0 +1,83 @@ + + + + + + + Filip Rojek + + + + +
+
+ Home + Projects + Blog +
+
+

Filip Roudžek

+
+
+ Contact me +
+
+
+
+

Vítej na mé stránce

+

Lorem ipsum dolor sit amet consectetur adipisicing elit. Temporibus ea totam debitis porro, incidunt quam tempora sint, cumque cupiditate aliquid libero neque inventore. Consequuntur exercitationem temporibus vero enim, labore earum.

+
+
+

Projekty

+
+
+

Fofrbazar

+ link +

Lorem ipsum dolor sit amet consectetur adipisicing elit. Nisi necessitatibus sequi molestiae iste eos corrupti obcaecati voluptatibus tempora expedita libero. Consectetur, sunt voluptate. Similique, maiores magnam soluta natus animi doloremque.

+
+
+
    +
  • Php 7.4
    • +
  • Laravel 8
    • +
  • MySQL
    • +
  • Vue.js
    • +
+
+
+ GitHub +
+
+
+
+

Portfolio

+ link +

Lorem, ipsum dolor sit amet consectetur adipisicing elit. Earum maxime, quis enim, magni modi labore recusandae reiciendis nisi assumenda incidunt commodi quae sapiente pariatur? Recusandae, corporis minus. Eligendi, ducimus consectetur.

+
+
+
    +
  • Node.js
    • +
  • Express.js
    • +
  • REST Api
    • +
  • MongoDB
    • +
+
+
+ GitHub +
+
+
+
+ + + \ No newline at end of file diff --git a/v2/js/script.js b/v2/js/script.js new file mode 100644 index 0000000..e69de29