Merge pull request avinash201199#233 from irmeenhusain/main

Adding Irmeen Husain portfolio
amintai · Oct 30, 2022 · ef76508 · ef76508
2 parents 2806863 + 56574e7
commit ef76508
Show file tree

Hide file tree

Showing 8 changed files with 221 additions and 0 deletions.
diff --git a/Irmeen Husain/css/style.css b/Irmeen Husain/css/style.css
@@ -0,0 +1,157 @@
+body {
+    margin: 0;
+    text-align: center;
+    font-family: 'Merriweather', serif;
+    color:#40514E ;
+}
+
+h1 {
+    margin: 50px auto 0 auto;
+    font-family: 'Sacramento', cursive;
+    font-size: 5.625rem;
+    color: #66BFBF;
+}
+
+h2 {
+    font-family: 'Montserrat', sans-serif;
+    font-size: 2.5rem;
+    margin-top: 0px;
+    padding-bottom: 10px;
+    color: #66BFBF;
+    font-weight: normal;
+}
+
+h3 {
+    font-family: 'Montserrat', sans-serif;
+    color:#11999E;
+}
+
+a{
+    color:#11999E;
+}
+
+p{
+    line-height: 2;
+}
+hr{
+  border: dotted #EAF6F6 6px;
+  border-bottom: none;
+  width:4%;
+  margin: 100px auto;
+}
+.top {
+    background-color: #E4F9F5;
+    margin: 0px;
+    padding: 100px;
+    position: relative;
+
+
+}
+
+
+.middle {
+    background-color: blueviolet;
+    width: 200px;
+    height: 200px;
+}
+
+.bottom-container{
+    background-color: #66BFBF;
+    margin: 0;
+    padding: 30px;
+}
+
+.pro {
+    text-decoration: underline;
+}
+
+.bottom-cloud {
+    position: absolute;
+    top: 450px;
+    left:250px
+}
+
+.top-cloud {
+    position: absolute;
+    right: 270px;
+    top: 50px;
+}
+
+.profile{
+    margin: 100px 0;
+
+}
+
+
+
+.skill-row{
+    width: 50%;
+    margin: 100px auto 100px auto;  
+    text-align: left;
+
+}
+
+.skill-1{
+    width: 25%;
+    float: left;
+    margin-right: 30px;
+}
+.skill-2{
+    width: 25%;
+    float: right;
+    margin-left: 30px;
+}
+
+
+
+
+
+.copywrite{
+    color: #EAF6F6;
+    font-size: 0.75rem;
+    padding: 20px 0;
+}
+
+
+.footer-link{
+    color: #11999E;
+    margin: 10px 20px;
+    text-decoration: none;
+
+
+a:hover{
+    color: #EAF6F6;
+}
+
+
+
+
+.btn {
+    background: #11cdd4;
+    background-image: -webkit-linear-gradient(top, #11cdd4, #11999e);
+    background-image: -moz-linear-gradient(top, #11cdd4, #11999e);
+    background-image: -ms-linear-gradient(top, #11cdd4, #11999e);
+    background-image: -o-linear-gradient(top, #11cdd4, #11999e);
+    background-image: linear-gradient(to bottom, #11cdd4, #11999e);
+    -webkit-border-radius: 8;
+    -moz-border-radius: 8;
+    border-radius: 8px;
+    font-family: 'Montserrat', sans-serif;;
+    color: #ffffff;
+    font-size: 20px;
+    padding: 10px 20px 10px 20px;
+    text-decoration: none;
+    line-height: 4;
+  }
+
+  .btn:hover {
+    background: #30e3cb;
+    background-image: -webkit-linear-gradient(top, #30e3cb, #2bc4ad);
+    background-image: -moz-linear-gradient(top, #30e3cb, #2bc4ad);
+    background-image: -ms-linear-gradient(top, #30e3cb, #2bc4ad);
+    background-image: -o-linear-gradient(top, #30e3cb, #2bc4ad);
+    background-image: linear-gradient(to bottom, #30e3cb, #2bc4ad);
+    text-decoration: none;
+  }
+
+
diff --git a/Irmeen Husain/favicon.ico b/Irmeen Husain/favicon.ico
diff --git a/Irmeen Husain/images/CSS - My Site Images/angela.png b/Irmeen Husain/images/CSS - My Site Images/angela.png
diff --git a/Irmeen Husain/images/CSS - My Site Images/chillies.png b/Irmeen Husain/images/CSS - My Site Images/chillies.png
diff --git a/Irmeen Husain/images/CSS - My Site Images/cloud.png b/Irmeen Husain/images/CSS - My Site Images/cloud.png
diff --git a/Irmeen Husain/images/CSS - My Site Images/computer.png b/Irmeen Husain/images/CSS - My Site Images/computer.png
diff --git a/Irmeen Husain/images/CSS - My Site Images/mountain.png b/Irmeen Husain/images/CSS - My Site Images/mountain.png
diff --git a/Irmeen Husain/index.html b/Irmeen Husain/index.html
@@ -0,0 +1,64 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Irmeen Husain</title>
+    <link rel="stylesheet" href="css/style.css" />
+    <link rel="icon" href="favicon.ico" />
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link href="https://fonts.googleapis.com/css2?family=Merriweather&family=Montserrat&family=Sacramento&display=swap"
+        rel="stylesheet" />
+</head>
+
+<body>
+    <div class="top">
+        <img class="top-cloud" src="images/CSS - My Site Images/cloud.png" alt="clouds" />
+        <h1>I'm Irmeen</h1>
+        <h2>a <span class="pro">pro</span>grammer</h2>
+        <img class="bottom-cloud" src="images/CSS - My Site Images/cloud.png" alt="clouds-img" />
+        <img src="images/CSS - My Site Images/mountain.png" alt="mountain-img" />
+    </div>
+    <div class="middle-container">
+        <div class="profile">
+          <img src="https://cdn-icons.flaticon.com/png/128/4323/premium/4323051.png?token=exp=1649008172~hmac=b0a67c75ba274c8bb8a1211601abc44f" alt="profile-pic">
+          <h2>Hello.</h2>
+          <p >I am a Web Developer</p>
+        </div>
+        <hr>
+        <div class="skills">
+          <h2>My Skills.</h2>
+          <div class="skill-row">
+            <img class="skill-1" src="https://media3.giphy.com/media/iIGT8Y1rOYhBpdHh1C/200.webp?cid=ecf05e47yy3n3n9wfrvdr0e2cmjp8dn94v2fzek18gu3v57j&rid=200.webp&ct=s" alt="coding-img">
+            <h3>Front-End Developer</h3>
+            <p>Develope and design applications using HTML, CSS, JS</p>
+          </div>
+          <div class="skill-row">
+            <img class="skill-2" src="https://media1.giphy.com/media/WFZvB7VIXBgiz3oDXE/200w.webp?cid=ecf05e47e60a9qwxktaxghuj3c2jsy1sdn0tqyl35tgtjusd&rid=200w.webp&ct=s" alt="laptop-image">
+            <h3>Programming</h3>
+            <p>Code to develope application using C/C++</p>
+          </div>
+        </div>
+        <hr>
+        <div class="contact-me">
+          <h2>Get In Touch</h2>
+          <h3>If you love coding as much as I do</h3>
+          <p>Let's talk about exciting stuff and code together.</p>
+          <a class="btn" href="mailto:irmeenhusain001@gmail.com">CONTACT ME</a>
+        </div>
+      </div>
+
+
+      <div class="bottom-container">
+        <a class="footer-link" href="https://www.linkedin.com/">LinkedIn</a>
+        <a class="footer-link" href="https://twitter.com/">Twitter</a>
+        <a class="footer-link" href="https://www.appbrewery.co/">Website</a>
+        <p class="copywrite">© Irmeen Husain.</p>
+      </div>
+
+</body>
+
+</html>