updated design and files

2020-06-29 20:17:03 -04:00
parent e9d38771fa
commit 8d95e0f2d5
39 changed files with 228770 additions and 239 deletions
@@ -0,0 +1,236 @@
+@keyframes AnimationName {
+    0%{background-position:0% 90%}
+    50%{background-position:100% 5%}
+    100%{background-position:0% 90%}
+}
+
+@font-face {
+    font-family: Playfair Display;
+    src: url(PlayfairDisplay-Regular.otf);
+  }
+  
+  div {
+    font-family: myFirstFont;
+  }
+
+* {
+    margin: 0;
+    padding: 0;
+}
+
+body {
+    background: linear-gradient(45deg, black, #444444);
+    background-size: 100% 600%;
+    animation: AnimationName 8s ease infinite;
+    cursor: url("sparkle.png"), auto;
+    height: 100vh;
+    padding:6rem;
+}
+
+#my-name {
+    display: flex;
+    flex-direction: column-reverse;
+}
+
+#my-photo {
+    width:250px;
+    height:250px;
+    border-radius: 50%;
+}
+
+#my-photo:hover {
+    opacity: 100;
+    transition: all 0.2s ease-in-out; 
+    transform: scale(1.2);
+}
+
+#linkture{
+    display: flex;
+    flex-direction: column;
+}
+
+h1 {
+    font-family:Playfair Display;
+    font-size:100px;
+    font-weight: 100;
+    margin-top: 6rem;
+    margin-bottom: 6rem;
+    color:rgb(112, 111, 111);
+
+}
+
+ul {
+    list-style:none;
+    padding:0;
+    line-height: 2;
+    font-family: lora;
+    font-size: 60px;
+}
+
+li {
+    font-family:'Lora';
+    letter-spacing: .25rem;
+    line-height:2.5;
+    color:rgb(112, 111, 111);
+}
+
+a {
+    text-decoration: none;
+    cursor: url("sparkle2.png"), auto;
+    color:rgb(112, 111, 111);
+}
+
+a h2 {
+    color:black;
+}
+
+footer {
+    padding-top: 5rem;
+    padding-bottom: 10rem;
+    padding-right: 5rem;
+    font-family:'lora';
+    font-style: italic;
+    font-size: 20px;
+    font-weight: bold;
+    letter-spacing: .2rem;
+    color:rgb(112, 111, 111);
+}
+
+h2 {
+    margin-top:3rem;
+    margin-bottom: 3rem;
+    width: fit-content;
+    font-family:'Glacial Indifference';
+    font-weight: bold;
+    font-size: 35px;
+    background-color:rgb(94, 92, 92);
+	color:balck;
+    line-height: initial;
+    padding:.5rem;
+    white-space: nowrap;
+    letter-spacing: 2px;
+}
+
+#home:hover{
+    background-color:#d9e021;
+}
+
+@media only screen and (min-width:1440px) {
+
+    /* POSITIONING */
+
+    * {
+        margin: 0;
+        padding: 0;
+    }
+
+    body {
+        height: calc(100vh - 8rem);
+        padding:8rem 16rem;
+        padding-bottom: 0;
+    }
+    
+    #my-name, #linkture, footer {
+        flex-direction: row;
+        margin:0;
+    }
+
+    #my-name h1, #my-links, #my-features {
+        flex:1;
+    }
+
+    #linkture {
+        margin-top: 3rem;
+        align-items: flex-end;
+    }
+
+    #my-skills {
+        padding-top: 4rem;
+    }
+
+    h1 a {
+        cursor: url("sparkle2.png"), auto;
+    }
+
+    li a:hover {
+        color:#d9e021;
+        font-style: italic;
+        font-size: 26px;
+    }
+   
+
+    #my-photo:hover {
+        opacity: 100;
+        transition: all 0.2s ease-in-out; 
+        transform: scale(1.2);
+    }
+
+    /* FONT FORMAT */
+
+    h1 {
+        font-size:100px;
+        margin:0;
+        padding:0;
+        margin-block-end:0;
+        line-height: 1;
+        padding-top: 2rem;
+        letter-spacing:3px;
+    }
+
+    h2 {
+        margin:0;
+        letter-spacing:2px;
+        font-size:14px;
+        padding:3px;
+        background-color:rgb(134, 134, 134);
+	    color:balck;
+    }
+
+    #my-skills li {
+        font-size: 28px;
+        margin-top: .8rem;
+        font-style: none;
+    }
+
+    #my-links li {
+        font-size: 20px;
+        margin-top:1rem;
+        position:top;
+    }
+
+    #my-features li {
+        font-size: 20px;
+        margin-top:1rem;
+    }
+
+    footer {
+        font-family:'lora';
+        font-style: italic;
+        font-size: 11px;
+        font-weight: bold;
+        padding: 0;
+        text-align: justify;
+        margin-bottom: 1rem;
+        color: white;
+        letter-spacing: .1rem;
+    }
+
+    footer:hover {
+        color:#d9e021;
+    }
+
+    #home h2:hover{
+        background-color:#d9e021;
+        cursor: url("sparkle2.png"), auto;
+    }
+
+    img#madhu:hover, img#sitar:hover, img#charity:hover {
+        opacity: 100;
+        transition: all 0.2s ease-in-out; 
+        transform: scale(1.1);
+    }
+
+    h2 a {
+        color:black;
+    }
+}