Update index.html

d4tis · Feb 11, 2024 · 0d71b4e · 0d71b4e
1 parent bcb475e
commit 0d71b4e
Showing 1 changed file with 22 additions and 29 deletions.
diff --git a/index.html b/index.html
@@ -4,21 +4,24 @@
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>d4tis.me</title>
+ <!-- Font link -->
  <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=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap" rel="stylesheet">
+
  <style>
+ /* Internal CSS styles */
  body {
- font-family: 'Ubuntu', Arial, sans-serif;
+ font-family: 'Ubuntu', Arial, sans-serif; /* Applying Ubuntu font */
  margin: 0;
  padding: 0;
- background-color: #000;
+ background-color: #000; /* Black background */
  text-align: center;
- color: #fff;
+ color: #fff; /* White text */
  }
  .header {
- background-color: #cc5500;
- color: #fff;
+ background-color: #cc5500; /* Darker orange header */
+ color: #fff; /* White text */
  padding: 20px;
  font-weight: bold;
  }
@@ -27,8 +30,8 @@
  width: 150px;
  height: 150px;
  margin: 20px auto;
- background-color: #fff;
- border: 5px solid #cc5500;
+ background-color: #fff; /* White background for image box */
+ border: 5px solid #cc5500; /* Orange border */
  overflow: hidden;
  }
  .profile-picture img {
@@ -38,43 +41,33 @@
  }
  .container {
  padding: 20px;
- margin-bottom: 50px;
+ margin-bottom: 50px; /* Ensure space for the footer */
  }
  h1, h2, p, a {
- color: #fff;
- font-weight: bold;
+ color: #fff; /* White text */
+ font-weight: bold; /* Set font weight to bold */
  }
  .cta-button {
- display: inline-flex;
- align-items: center;
- justify-content: center;
- padding: 5px 20px;
- background-color: #cc5500;
- color: #000;
+ display: inline-block;
+ padding: 10px 20px;
+ background-color: #cc5500; /* Darker orange button */
+ color: #000; /* Black text */
  text-decoration: none;
  border-radius: 5px;
  transition: background-color 0.3s ease, color 0.3s ease;
  margin: 10px;
- height: 30px;
- line-height: 30px; /* Set line-height to match button height */
  }
  .cta-button:hover {
- background-color: #ff9933;
+ background-color: #ff9933; /* Lighter orange button on hover */
  }
  .footer {
- background-color: #000;
+ background-color: #000; /* Black footer background */
  padding: 10px;
- font-size: 12px;
+ font-size: 12px; /* Small font size */
  position: fixed;
  bottom: 0;
  width: 100%;
  }
- .cta-button img {
- display: block;
- width: 20px;
- height: auto;
- vertical-align: middle;
- }
  </style>
 </head>
 <body>
@@ -89,8 +82,8 @@ <h2>@d4tis</h2>
  <br>
  <a href="https://x.com/d4tis_" class="cta-button">X</a>
  <a href="https://primal.net/p/npub1cx2wtu40pu4xzu0qmcz0mkfup3uk86pztnkyjkq3nfr9ghvxe9xsafsp6k" class="cta-button">nostr</a>
- <a href="https://www.linkedin.com/in/d4tis" class="cta-button">In</a>
- <a href="lightning:zap@d4tis.me" class="cta-button"><img src="https://images.emojiterra.com/google/noto-emoji/unicode-15/animated/26a1.gif" alt="Lightning"></a>
+ <a href="https://www.linkedin.com/in/d4tis" class="cta-button">in</a>
+ <a href="lightning:zap@d4tis.me" class="cta-button">⚡</a>
  </div>
  <div class="footer">
  <p>Inflation=Theft</p>