Dev

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}

CNAME

@@ -1 +1 @@
-harindu.me
+links.harindu.dev

README.md

@@ -6,3 +6,4 @@
 <h4> https://harindulk.github.io </h4>
 
 #### Personal links page of Harindu Fonseka. 
+[![wakatime](https://wakatime.com/badge/user/77559b69-12a6-41ee-9b5f-b489fa0b0f73/project/6c61c4b8-0a17-4c7c-afef-68b80af345ed.svg)](https://wakatime.com/badge/user/77559b69-12a6-41ee-9b5f-b489fa0b0f73/project/6c61c4b8-0a17-4c7c-afef-68b80af345ed)

assets/css/style.css

@@ -1,13 +1,11 @@
 .bg {
-  /* From https://css.glass */
-  background: rgba(255, 255, 255, 0.31);
+  background: #19191B;
   border-radius: 16px;
-  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
+  box-shadow: 0 4px 30px rgba(0, 0, 0, .1);
   backdrop-filter: blur(12.1px);
   -webkit-backdrop-filter: blur(12.1px);
-  background-image: url("/assets/img/snow.webp");
-  background-attachment: fixed;
-
+  /*background-image: url(https://harindu.me/assets/img/snow.webp);
+  background-attachment: fixed*/
 }
 
 .profile-picture {
@@ -16,26 +14,25 @@
   margin-right: auto;
   height: auto;
   max-width: 100px;
-  border-radius: 50%;
-
+  border-radius: 50%
 }
 
 .profile-name {
   text-align: center;
   padding: 10px;
-  font-family: "Karla", sans-serif;
-  font-weight: bold;
-  color: white;
-  font-size: 20px;
+  font-family: Karla, sans-serif;
+  font-weight: 700;
+  color: #FEFFFE;
+  font-size: 20px
 }
 
 .profile-about {
   text-align: center;
   padding: 2px;
-  font-family: "Dosis", sans-serif;
-  color: white;
+  font-family: Dosis, sans-serif;
+  color: #FEFFFE;
   font-size: 15px;
-  letter-spacing: 2px;
+  letter-spacing: 2px
 }
 
 .links {
@@ -44,76 +41,77 @@
   margin-left: auto;
   margin-right: auto;
   padding: 15px;
-  border: 0.5px solid rgb(255, 255, 255);
+  border: .5px solid #27262B;
   border-width: 1px;
   display: block;
   border-radius: 10px;
-  font-family: "Karla", sans-serif;
+  font-family: Karla, sans-serif;
   position: relative;
   font-size: 17px;
   width: 680px;
   max-width: 95%;
-  transition: all 0.3s ease-in-out;
+  transition: all .3s ease-in-out
 }
 
+
 .links-in {
   padding: 5px;
-  border: 0.5px solid rgba(255, 255, 255, 0);
+  border: .5px solid #ffffff00;
   border-width: 1px;
   width: 30px;
   display: block;
   border-radius: 40px;
   left: 20px;
   position: absolute;
-  font-size: 20px;
+  font-size: 20px
 }
 
 .hover {
   text-decoration: none;
-  color: rgb(0, 0, 0);
-  transition: all 0.3s;
-  background: rgb(255, 255, 255);
+  color: #FEFFFE;
+  transition: all .3s;
+  background: #27262B
 }
 
 .hover:hover {
   text-decoration: none;
-  color: rgb(0, 0, 0);
-  background: rgb(255, 255, 255);
-  transition: all 0.2s;
-  transform: scale(1.03);
+  color: #FEFFFE;
+  background: #27262B;
+  transition: all .2s;
+  transform: scale(1.03)
 }
 
 .bottom-text {
   text-decoration: none;
   text-align: center;
   margin-top: 30px;
   font-size: 20px;
-  color: rgb(255, 255, 255);
-  font-family: "Handlee", cursive;
+  color: #FEFFFE;
+  font-family: Handlee, cursive
 }
 
 .link-hide {
-  text-decoration: none;
+  text-decoration: none
 }
 
 .link-hide:hover {
-  text-decoration: none;
+  text-decoration: none
 }
 
-@media (max-width: 548px) {
+@media (max-width:548px) {
   .profile-about {
     text-align: center;
     padding: 2px;
-    font-family: "Dosis", sans-serif;
-    color: white;
+    font-family: Dosis, sans-serif;
+    color: #FEFFFE;
     font-size: 15px;
-    letter-spacing: 1px;
+    letter-spacing: 1px
   }
 }
 
 .links-footer {
   padding: 4px;
-  border: 0.5px solid rgb(255, 255, 255);
+  border: .5px solid #FEFFFE;
   border-width: 1px;
   width: 40px;
   display: inline-block;
@@ -122,28 +120,26 @@
   text-align: center;
   margin: 10px;
   margin-top: 50px;
-  color: rgb(0, 0, 0);
+  color: #000;
   transition: color 1s;
-  transition: all 0.3s;
-  background: rgb(255, 255, 255);
-
+  transition: all .3s;
+  background: #FEFFFE
 }
 
 .links-footer:hover {
-  color: rgb(0, 0, 0);
-  background: rgb(255, 255, 255);
-  transition: all 0.3s;
+  color: #000;
+  background: #FEFFFE;
+  transition: all .3s
 }
 
-.space{
-  padding-top: 40px;
+.space {
+  padding-top: 40px
 }
 
 .drag {
   -webkit-user-drag: none;
   -khtml-user-drag: none;
   -moz-user-drag: none;
   -o-user-drag: none;
-  user-drag: none;
-}
-
+  -user-drag: none
+}