diff --git a/Portfolio-Websites/ZahinEkbal/README.md b/Portfolio-Websites/ZahinEkbal/README.md new file mode 100644 index 0000000..0f20938 --- /dev/null +++ b/Portfolio-Websites/ZahinEkbal/README.md @@ -0,0 +1,20 @@ +### Title +MY portfolio websites... + +# Link to my website + https://zahinekbal.github.io/my-portfolio.github.io/ + + ## Technologies which i used in my portfolio +- HTML +- CSS +- JAVASCRIPT + +# ******************************* + I used little bit of text animation with the help of css.... + and hover effect in all the pic.. + In javascript i used toggle function which toggle display of the html elements using javascript nd pass the elements id which u want to show/hide based on the visibility.. + Added media query function for fully responsiveness.. + + That's a lot there is not so much to say about my projects...... + + diff --git a/Portfolio-Websites/ZahinEkbal/backpic.jpg b/Portfolio-Websites/ZahinEkbal/backpic.jpg new file mode 100644 index 0000000..c4e37a0 Binary files /dev/null and b/Portfolio-Websites/ZahinEkbal/backpic.jpg differ diff --git a/Portfolio-Websites/ZahinEkbal/cssicon.png b/Portfolio-Websites/ZahinEkbal/cssicon.png new file mode 100644 index 0000000..fd48405 Binary files /dev/null and b/Portfolio-Websites/ZahinEkbal/cssicon.png differ diff --git a/Portfolio-Websites/ZahinEkbal/emailicon.png b/Portfolio-Websites/ZahinEkbal/emailicon.png new file mode 100644 index 0000000..7941b8e Binary files /dev/null and b/Portfolio-Websites/ZahinEkbal/emailicon.png differ diff --git a/Portfolio-Websites/ZahinEkbal/githubicon.png b/Portfolio-Websites/ZahinEkbal/githubicon.png new file mode 100644 index 0000000..6e293d3 Binary files /dev/null and b/Portfolio-Websites/ZahinEkbal/githubicon.png differ diff --git a/Portfolio-Websites/ZahinEkbal/htmlicon.png b/Portfolio-Websites/ZahinEkbal/htmlicon.png new file mode 100644 index 0000000..ef50a4a Binary files /dev/null and b/Portfolio-Websites/ZahinEkbal/htmlicon.png differ diff --git a/Portfolio-Websites/ZahinEkbal/index.html b/Portfolio-Websites/ZahinEkbal/index.html new file mode 100644 index 0000000..1731b8d --- /dev/null +++ b/Portfolio-Websites/ZahinEkbal/index.html @@ -0,0 +1,242 @@ + + + + + + MY WEBSITE + + + + + +
+
+
+

Hello

+

My Name Is

+

Zahin Ekbal

+ portfolio +
+
+
+ +
+
+
+

MY SKILLS

+

WHAT do I need TO study?
+ If you want to learn front-end you need learn HTML,CSS,
JAVASCRIPT andJQUERY.Those would help you + to create interactive and interesrting web pages.RECENTLY I FOUND MY INTEREST IN WEB DEVELOPEMENT.
THEN I STARTED LEARNING WEB + DEVELOPEMENT nd Completed Front-end part EX:- HTML,CSS,
JAVASCRIPT, + BOOTSTRAP,JQERY.
I have done front-end form Udemy,Progate,W3 schools + .Also have experience working with static website ,RESPONSIVE website,Bootstrap framework + and Right now I am learning Backend with nodeJS nd react from CODING BLOCKS
+ SKILLS & ENDORESMENTS

+
+
+
+
+

HTML

+

HTMLstands for Hyper Text Markup Language.IT is used to design web pages using Markup + language.HTML is used to manipulate text,images and other content to display it in required format. + HTML was declared by TIM BERNERS-LEE in 1991

+
+
+
+

CSS

+

CSSStands for "Cascading Style Sheet." Cascading style sheets are used to format the + layout of Web pages. They can be used to define text styles, table sizes, and other aspects of + Web pages that previously could only be defined in a page's HTML.

+
+
+
+

JAVASCRIPT

+

JavaScript is a programming language commonly used in web development. It was + originally developed by Netscape as a means to add dynamic and interactive elements + to websites. + Like server-side scripting languages, such as PHP and ASP, It can be inserted anywhere within the HTML of a webpage.

+
+
+
+

JQUERY

+

jQuery is a lightweight, "write less, do more", JavaScript library. The purpose of jQuery is to + make it much easier to use JavaScript on your website. jQuery takes a lot of common tasks that + require many lines of JavaScript code to accomplish, and wraps them into methods that you can call + with a single line of code.

+
+
+
+
+ +
+
+
+

Certificates

+
+
+
+
+

Certificate 1

+

Complete Front-end Web development

+

Completed "Front-end Web development" from #UDEMY.It taught me
+ *basic html to advanced html and css,
+ *JavaScript concepts
+ *JQERY,*Bootstrap basic. +

+
+
+ certificate +
+
+
+
+

Certificate 2

+

Bootstrap
and jQuery

+

Completed Bootstrap
development and Jquery development from #UDEMY.
It taught me, + *Bootstrap basic page
structure,tables,wells,Alerts,
Column layouts,Typography,Buttons, + Badges,Labels,Pager Pagination,Collapse panel,dynamics tabs and pills,Inputs,Carousel, + Tooltip.....etc
+ *JQERY syntex,Id class selector,Events handlers,Toggle,Fade in out,slide up down,Animation, + Callback functions,attribute menu,Toggle class....etc.

+
+
+ certificate +
+
+
+
+

Certificate 3

+

JQUERY for
Beginner

+

+ Completed Basics Of Jquery
for beginners from
#UDEMY.It taught me
+ * Juery Basics Like What is
jquery and downloading Jquery,
Selectors,filters,Replacing contents,Hover effect, + Fading,Animate,Slide.
+ * advanced selectors,Creating content,modifying content,Inserting content.

+
+
+ certificate +
+
+
+
+

Certificate 4

+

CSS Flexbox

+

Completed CSS flexbox from #UDEMY.It taught me
+ * Flex Axis,Flex-direction,Flex-direction,Flex-Wrap,Flex-Flow,property of justify and align Content
+ * Flex-grow,Flex-shrink,holy Grail Layout,Flexbox Prefixing,Nd creating a page with recipe cards.

+
+
+ certificate +
+
+
+
+ + +
+
+
+
+ image +
+
+
+

ABOUT ME

+

Front End Web Developer

+

I am an undergraduate Sophomore Year Student + currently undertaking a Bachelors course in Computer science and Engineering + at SATHYABAMA INSTITUTE OF SCIENCE AND TECHNOLOGY. + I am always energetic,hardworking and eager to learn new skills.I love to learn. + And Passionate whatever I choose to do..I can also call myself hardworking because + whatever I do, I do it diligently and till that work is done,I do not stop pursuing it. + I have an experience of working on front-end website.I completed front-end form w3 school,progate,udemy. + I've worked with front-end frameworks like BOOTSTRAP.I am currently working on Backend Development + (Web development with NOdeJS,and React JS).I am looking forward to building new projects.
+ programming languages :
C++,C,PYTHON,HTML,
+ CSS,JAVA,
+ JAVASCRIPT,JQUERY,
+ Algo++ and Datastructure
+ Database : SQL + Language Known : English,Hindi,Bengali

+ Download Resume +
+
+ + +
+
+

CONTACT INFO

+
+
+
+
+

PHONE

+

9540702942

+
+
+
+
+
+
+

EMAIL

+

zahinekbal834070@gmail.com

+

zeeavzee@gmail.com

+
+
+
+
+
+
+

LINKEDLN

+

https://www.linkedin.com/in/ +
zahin-ekbal-49016a16b

+
+
+
+
+
+ + + + + + + \ No newline at end of file diff --git a/Portfolio-Websites/ZahinEkbal/instaicon.png b/Portfolio-Websites/ZahinEkbal/instaicon.png new file mode 100644 index 0000000..c9980d9 Binary files /dev/null and b/Portfolio-Websites/ZahinEkbal/instaicon.png differ diff --git a/Portfolio-Websites/ZahinEkbal/javascripticon.png b/Portfolio-Websites/ZahinEkbal/javascripticon.png new file mode 100644 index 0000000..d7de135 Binary files /dev/null and b/Portfolio-Websites/ZahinEkbal/javascripticon.png differ diff --git a/Portfolio-Websites/ZahinEkbal/jqueryicon.png b/Portfolio-Websites/ZahinEkbal/jqueryicon.png new file mode 100644 index 0000000..9f97d63 Binary files /dev/null and b/Portfolio-Websites/ZahinEkbal/jqueryicon.png differ diff --git a/Portfolio-Websites/ZahinEkbal/linkedlnicon.png b/Portfolio-Websites/ZahinEkbal/linkedlnicon.png new file mode 100644 index 0000000..a410ebc Binary files /dev/null and b/Portfolio-Websites/ZahinEkbal/linkedlnicon.png differ diff --git a/Portfolio-Websites/ZahinEkbal/phoneicon.png b/Portfolio-Websites/ZahinEkbal/phoneicon.png new file mode 100644 index 0000000..67db125 Binary files /dev/null and b/Portfolio-Websites/ZahinEkbal/phoneicon.png differ diff --git a/Portfolio-Websites/ZahinEkbal/resp.js b/Portfolio-Websites/ZahinEkbal/resp.js new file mode 100644 index 0000000..dd437fe --- /dev/null +++ b/Portfolio-Websites/ZahinEkbal/resp.js @@ -0,0 +1,8 @@ +burger = document.querySelector('.burger') +navbar = document.querySelector('.navbar') +navList = document.querySelector('.nav-list') + +burger.addEventListener('click', ()=>{ + navList.classList.toggle('v-class-resp'); + navbar.classList.toggle('h-nav-resp'); +}); \ No newline at end of file diff --git a/Portfolio-Websites/ZahinEkbal/style.css b/Portfolio-Websites/ZahinEkbal/style.css new file mode 100644 index 0000000..85f7080 --- /dev/null +++ b/Portfolio-Websites/ZahinEkbal/style.css @@ -0,0 +1,769 @@ +*{ + padding: 0; + margin: 0; + box-sizing: border-box; +} +html{ + font-size: 20px; + font-family: 'Courier New', Courier, monospace; + scroll-behavior: smooth; +} +a{ + text-decoration: none; +} +.container{ + min-height: 100vh; + width: 100%; + display: flex; + align-items: center; + justify-content: center; +} +img{ + height: 100%; + width: 100%; + object-fit: cover; +} +.section-title{ + font-size: 4rem; + font-weight: 300; + font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; + color: red; + margin-bottom: 10px; + text-transform: uppercase; + letter-spacing: .2rem; + text-align: center; +} +.section-title span{ + color: black; +} +/*header section*/ +.navbar{ + display: flex; +} +.nav-list{ + display: flex; + align-items: center; + width: 100%; + height: 100%; + +} +.nav-list li{ + list-style: none; + padding: 26px 30px; + +} +.nav-list li a{ + text-align: center; + font-size: 1.3rem; + text-decoration: none; + color: white; + font-weight: bold; +} +.nav-list li a:hover{ + text-decoration: none; + color: brown; +} +.background{ + background: rgba(0, 0, 0, 0.5) url(backpic.jpg); + background-size: cover; + background-blend-mode: darken; +} +.burger{ + display: none; + position: absolute; + cursor: pointer; + right: 5%; + top: 10px; + +} +.line{ + width: 35px; + background-color: white; + height: 4px; + margin: 8px 5px; +} +/*end header*/ +#first{ + background-image: url(backpic.jpg); + background-size: cover; + background-position: top center; + background-repeat: no-repeat; + position: relative; + z-index: 1; +} +#first::after{ + content: ''; + position: absolute; + top: 0; + left: 0; + height: 100%; + width: 100%; + background-color: black; + opacity: -7; + z-index: -1; +} +#first .first { + max-width: 1200px; + margin: 0 auto; + padding: 0 54px; + justify-content: flex-start; +} +#first h1{ + display: block; + width: fit-content; + font-size: 3rem; + text-shadow: 0 0 20px maroon; + font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; + position: relative; + color: transparent; + animation: trans .5s ease forwards; + animation-delay: 1s; +} +#first h1:nth-child(1) { + animation-delay: 1s; +} +#first h1:nth-child(2) { + animation-delay: 2s; +} +#first h1:nth-child(3) { + animation: trans_box .5s ease forwards; + animation-delay: 3s; +} + +#first h1 span { + position: absolute; + top: 0; + left: 0; + height: 100%; + width: 0; + background-color: crimson; + animation: transition_box 1s ease; + animation-delay: 0.5s; +} +#first h1:nth-child(1) span{ + animation-delay: .5s; +} +#first h1:nth-child(2) span{ + animation-delay: 1.5s; +} +#first h1:nth-child(3) span{ + animation-delay: 2.5s; +} +#skill{ + background-image: url(backpic.jpg); + background-size: cover; + background-position: top center; + background-repeat: no-repeat; +} +#skill .section-title { + color: white; + font-weight: bold; + text-shadow: 0 0 25px black; + font-size: 4rem; + font-family: fantasy; + letter-spacing: .2rem; + margin-bottom: 65px; +} +#skill .skill{ + flex-direction: column; + text-align: center; + margin: 0 auto; + max-width: 1500px; + padding: 100px 0; +} +#skill .skill-top{ + width: 100%; + max-width: 0 auto; +} +#skill .skill-top p{ + font-size: 1rem; + margin-top: 5px; + margin-left: 50px; + margin-right: 50px; + line-height: 2rem; + font-weight: bold; + letter-spacing: .1rem; + font-family: Verdana, Geneva, Tahoma, sans-serif; +} +#skill .skill-bottom{ + display: flex; + align-items: center; + justify-content: center; + flex-wrap: wrap; + margin-top: 50px; +} +#skill .skill-items{ + flex-basis: 70%; + display: flex; + align-items: flex-start; + justify-content: center; + flex-direction: column; + padding: 30px; + border-radius: 30px; + background-image: url(backpic.jpg); + background-size: cover; + margin: 15px 5%; + position: relative; + z-index: 1; + overflow: hidden; +} +#skill .skill-items::after{ + content: ''; + position: absolute; + left: 0; + top: 0; + height: 100%; + width: 100%; + background-color: black; + opacity: .2; + z-index: -1; +} +#skill .skill-bottom .icon{ + height: 80px; + width: 90px; + margin-bottom: 10px; +} +#skill .skill-items h2{ + font-size: 1.7rem; + color: white; + margin-bottom: 10px; + text-transform: uppercase; +} +#skill .skill-items p{ + color: white; + margin-top: 5px; + line-height: 1.5rem; + text-align: left; + font-size: 2rem; + font-weight: bold; + letter-spacing: .05rem; + font-family: cursive; +} +#skill .skill-bottom { + display: flex; + align-items: center; + justify-content: center; + flex-wrap: wrap; +} +#skill .skill-items { + flex-basis: 80%; + display: flex; + align-items: flex-start; + justify-content: center; + flex-direction: column; + padding: 30px; +} +#projects{ + background-image: url(backpic.jpg); + background-repeat: no-repeat; + background-size: cover; +} +#projects .projects{ + display: flex; + flex-direction: column; + max-width: 1200px; + margin: 0 auto; + padding: 100px 0; +} +#projects .section-title { + font-weight: bold; + color: black; + font-size: 3.5rem; + font-family: fantasy; + letter-spacing: .2rem; +} +#projects .projects-header h1{ + margin-bottom: 50px; +} +#projects .all-projects{ + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; +} +#projects .projects-item { + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + width: 100%; + margin: 20px auto; + overflow: hidden; + border-radius: 20px; +} +#projects .projects-info{ + padding: 30px; + flex-basis: 50%; + height: 100%; + display: flex; + flex-direction: column; + background-image: url(backpic.jpg); + color: black; +} +#projects .projects-info h1{ + color: black; + text-shadow: 0 0 10px white; + font-size: 3rem; + font-weight: bold; + font-family: sans-serif; +} +#projects .projects-info h2{ + font-size: 2.5rem; + font-weight: bold; + text-shadow: 0 0 6px white; + margin-top: 10px; + font-family: 'Times New Roman', Times, serif; +} +#projects .projects-info p{ + margin-top: 10px; + color: white; + text-align: center; + font-size: 2rem; + font-weight: bold; + line-height: 1.2rem; + letter-spacing: .02rem; + font-family: cursive; +} +#projects .projects-img{ + flex-basis: 50%; + height: 500px; + overflow: hidden; +} +#projects .projects-img img{ + transition: .3s ease transform; +} +#projects .projects-item:hover .projects-img img{ + transform: scale(1.1); +} +#about { + display: flex; + flex-direction: column-reverse; + text-align: center; + justify-content: center; + width: 100%; + height: 100%; + margin: 0 auto; + background-image: url(backpic.jpg); + background-repeat: no-repeat; + background-size: cover; + background-position: top center; +} +#about .section-title{ + margin-top: 30px; + color: white; + font-size: 3rem; + font-weight: bold; + text-shadow: 0 0 18px black; + font-family: fantasy; + left: .2rem; +} +#about .right{ + width: 100%; +} +#about .left{ + width: 250px; + height: 250px; +} +#about .right h2{ + font-size: 2.5rem; + text-shadow: 0 0 20px white; + font-family: monospace; + +} +#about .right p{ + font-size: 1rem; + text-align: center; + font-weight: bold; + color: black; + margin-left: 50px; + margin-right: 50px; + margin-top: 10px; + margin-bottom: 5px; + justify-content: center; + font-family: cursive; +} +#about .left .about-img{ + margin-left: 480px; + overflow: hidden; + width: 75%; + height: 100%; + border: 10px solid rgb(20, 1, 1); + box-shadow: 10px 10px red; + +} +#about .right .ctn{ + color: white; + margin-bottom: 30px; +} +.ctn{ + display: inline-block; + padding: 10px 30px; + color: black; + font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif; + background-color: transparent; + border: 3px solid black; + font-size: 20px; + text-transform: uppercase; + letter-spacing: 0.1rem; + margin-top: 10px; + transition: 3s ease; + transition-property: background-color, color; +} +.ctn:hover{ + color: white; + background-color: brown; +} +#contact{ + background-image: url(backpic.jpg); +} +#contact .section-title{ + font-size: 1rem; + font-weight: bold; + color: white; + align-items: center; + text-align: center; + text-shadow: 0 0 20px black; + font-family: fantasy; + margin-top: 40px; + margin-bottom: 50px; +} +#contact .contact{ + display: flex; + flex-direction: column; + margin: 0 auto; +} +#contact .contact-items{ + width: 100%; +} +#contact .contact-item{ + width: 100%; + height: 50%; + padding: 20px; + text-align: center; + border-radius: 10px; + padding: 30px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + box-shadow: 0px 0px 18px 0 black; + transition: .4s ease box-shadow; +} +#contact .contact-item:hover{ + box-shadow: 0px 0px 5px 0 black; +} +#contact .icon{ + width: 100px; + margin: 0 auto; + margin-bottom: 10px; +} +#contact .contact-info h1{ + font-size: 2.5rem; + font-weight: bold; + font-family: fantasy; + letter-spacing: .1rem; + margin-bottom: 5px; + color: black; + text-shadow: 0 0 3px white; +} +#contact .contact-info h2{ + font-weight: bold; + font-family: fantasy; + color: black; + letter-spacing: .1rem; + text-shadow: 0 0 2px white; +} +#footer{ + display: flex; + flex-direction: column; + background-image: url(backpic.jpg); +} +#footer .footer{ + display: flex; + min-height: 200px; + flex-direction: column; + padding-top: 50px; + padding-bottom: 10px; +} +#footer h1{ + font-size: 2.5rem; + text-transform: uppercase; + color: white; + text-shadow: 0 0 9px black; + font-family: fantasy; +} +#footer h2{ + color: black; + font-weight: bold; + font-size: 2rem; + text-shadow: 0 0 5px white; + margin-top: 10px; + margin-bottom: 10px; + letter-spacing: .1rem; + font-family: fantasy; +} +#footer h3{ + color: wheat; + text-shadow: 0 0 6px black; + font-size: 2rem; + font-family: fantasy; + margin-top: 5px; +} +#footer .social-icon{ + display: flex; + flex-direction: row; + margin-top: 0; +} +#footer .social-item{ + height: 50px; + width: 50px; + margin: 0 12px; + top: 6px; +} +#footer .social-item img{ + filter: grayscale(1); + transition: .3s ease filter; +} +#footer .social-item:hover img{ + filter: grayscale(0); +} +#footer .form{ + display: flex; + flex-direction: column; + width: 50%; + height: 300px; +} +#footer .footer input{ + margin: 30px 0; + padding: 5px 3px; + width: 100%; + border: 4px solid black; + border-radius: 6px; +} +@keyframes transition_box{ + 50%{ + width: 100%; + left: 0; + } + 100%{ + width: 0; + left: 100%; + } +} +@keyframes trans{ + 100%{ + color: black; + } +} +@keyframes trans_box{ + 100%{ + color: white; + font-weight: bold; + } +} +/*media query for tablet*/ +@media only screen and (min-width: 765px) { + #skill .skill-bottom .skill-items{ + flex-basis: 45%; + margin: 1.5%; + } + #skill .skill-items P{ + font-size: .7rem; + } + #skill .skill-top p{ + font-size: 1rem; + } + #projects .projects-item{ + flex-direction: row; + } + #projects .projects-item:nth-child(even){ + flex-direction: row-reverse; + } + #projects .projects-item{ + height: 400px; + margin: 0; + width: 100%; + border-radius: 0; + } + #projects .all-projects .projects-info{ + height: 100%; + width: 50%; + } + #projects .all-projects .projects-img{ + margin-right: 50px; + height: 60%; + width: 60%; + } + #projects .projects-img{ + height: 100%; + width: 100%; + } + #projects .projects-info h1{ + font-size: 2rem; + } + #projects .projects-info h2{ + font-size: 1.5rem; + } + #projects .projects-info p{ + font-size: .8rem; + margin-top: 10px; + line-height: 0.9rem; + } + #about .left .about-img { + margin-left: auto; + margin-left: 350px; + } + #about .right h2{ + letter-spacing: 0; + } + #contact .section-title{ + font-size: 4rem; + } + #contact .contact-items{ + display: flex; + flex-direction: column; + align-items: center; + text-align: center; + justify-content: centers; + width: 100%; + + } + #contact .contact-item{ + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + align-items: center; + justify-content: centers; + } + #contact .contact-info h1{ + font-size: 2rem; + } + #contact .contact-info h2{ + font-size: 1rem; + } +} +/*end of media query*/ +/*media query of desktop */ +@media only screen and (min-width: 1200px) { + #skill .skill-bottom .skill-items { + flex-basis: 22%; + margin: 1.5%; + } + #about .left .about-img{ + margin-left: auto; + margin-left: 650px; + } + #projects .projects-info p{ + font-size: 0.8rem; + margin-top: 15px; + line-height: 1rem; + } +} +/*end of media query */ +@media only screen and (max-width: 750px){ + #skill .section-title{ + font-size: 3rem; + } + #skill .skill-top p{ + font-size: 1rem; + list-style: 1rem; + } + #skill .skill-items p{ + font-size: 1rem; + line-height: 1.5rem; + } + #projects .projects-info p{ + font-size: 1rem; + text-align: center; + margin-right: 30px; + margin-left: 30px; + font-family: italic; + } + #projects .projects-img{ + height: 100%; + width: 100%; + } + #projects .projects-info h1{ + font-size: 2rem; + } + #projects .projects-info h2{ + font-size: 1.5rem; + } + #projects .section-title{ + font-size: 2rem; + margin-bottom: 30px; + } + #about .section-title h1 { + font-size: 1rem; + letter-spacing: 0.01rem; + } + #about .section-title h2{ + font-size: 0.5rem; + } + #about .left .about-img{ + margin-left: auto; + margin-left: 80px; + margin-bottom: 1000px; + } + #contact .section-title{ + font-size: 2rem; + color: white; + text-shadow: 0 0 5px black; + } + #contact .contact-info h1{ + font-size: 2rem; + color: white; + text-shadow: 0 0 5px black; + } + #contact .contact-info h2{ + font-size: 1rem; + } + #contact .contact-item{ + width: 100%; + height: 50%; + padding: 20px; + text-align: center; + border-radius: 10px; + padding: 30px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + box-shadow: 0px 0px 18px 0 black; + transition: .4s ease box-shadow; + } + #contact .contact-item:hover{ + box-shadow: 0px 0px 5px 0 black; + } + #contact .contact-item { + margin-bottom: 30px; + } + #footer h1{ + font-size: 2rem; + } + #footer h2{ + font-size: 1.5rem; + } + #header .hamburger{ + margin-bottom: 295%; + margin-left: 115%; + } + .nav-list{ + flex-direction: column; + } + .navbar{ + height: 400px; + transition: all 0.7s ease-out; + flex-direction: column; + } + .burger{ + display: block; + } + .h-nav-resp{ + height: 70px; + } + .v-class-resp{ + opacity: 0; + } +} \ No newline at end of file diff --git a/Portfolio-Websites/ZahinEkbal/udemycerti1.jpg b/Portfolio-Websites/ZahinEkbal/udemycerti1.jpg new file mode 100644 index 0000000..d39632f Binary files /dev/null and b/Portfolio-Websites/ZahinEkbal/udemycerti1.jpg differ diff --git a/Portfolio-Websites/ZahinEkbal/udemycerti2.jpg b/Portfolio-Websites/ZahinEkbal/udemycerti2.jpg new file mode 100644 index 0000000..3beaf0d Binary files /dev/null and b/Portfolio-Websites/ZahinEkbal/udemycerti2.jpg differ diff --git a/Portfolio-Websites/ZahinEkbal/udemycerti3.jpg b/Portfolio-Websites/ZahinEkbal/udemycerti3.jpg new file mode 100644 index 0000000..e0a5308 Binary files /dev/null and b/Portfolio-Websites/ZahinEkbal/udemycerti3.jpg differ diff --git a/Portfolio-Websites/ZahinEkbal/udemyflex.jpg b/Portfolio-Websites/ZahinEkbal/udemyflex.jpg new file mode 100644 index 0000000..b9ab35a Binary files /dev/null and b/Portfolio-Websites/ZahinEkbal/udemyflex.jpg differ diff --git a/Portfolio-Websites/ZahinEkbal/zzz.jpg b/Portfolio-Websites/ZahinEkbal/zzz.jpg new file mode 100644 index 0000000..227308c Binary files /dev/null and b/Portfolio-Websites/ZahinEkbal/zzz.jpg differ diff --git a/README.md b/README.md index 23b41ce..ef3fd81 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,8 @@ -# -Find here in this repository all content for our first event ! +MY PORTFOLIO WEBSITE LINK + + +https://zahinekbal.github.io/my-portfolio.github.io/ + +i used html css nd little bit javascript..nd it is fully responsive.. +