mv sig.png -> svg

css/style.css

@@ -966,7 +966,7 @@ text-align:right;
 }
 .dw-footer h4,
 .dw-footer h5 {
-  font-weight: 800;
+  font-weight: 900;
   line-height: 1.2;
   font-family: 'Playfair Display', serif;
 }
@@ -974,46 +974,10 @@ text-align:right;
   margin-top: 0 !important;
   margin-bottom: 4rem;
 }
-.dw-footer .hello .lead {
-  margin-bottom: 0;
-}
-.dw-footer .hello a {
-  font-weight: 700;
-  display: inline-block;
-  padding: 0;
-  position: relative;
-}
-.dw-footer .hello a:after {
-  content: '';
-  position: absolute;
-  z-index: -2;
-  bottom: -2px;
-  right: 0;
-  height: 1px;
-  width: 100%;
-  background: #ddd;
-}
-.dw-footer .hello a:after {
-  background: #535763;
-}
-.dw-footer .hello a:before {
-  display: none;
-}
-.dw-footer .hello a:before {
-  content: '';
-  position: absolute;
-  z-index: -1;
-  bottom: 5px;
-  right: 0;
-  height: 8px;
-  width: 0;
-  background: #d6f0ff;
-  -webkit-transition: width 0.2s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
-  transition: width 0.2s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
-}
-#dw-footer a {
-  color: #111;
-  fill: #111;
+
+#dw-footer {
+  background-color: #484C57;
+  color: #dadada;
 }
 #dw-footer a:hover {
   color: #111;
@@ -1072,21 +1036,7 @@ text-align:right;
   right: initial;
   width: 100%;
 }
-#dw-footer .footer-end {
-  margin: 4rem 0 0;
-  padding: 0;
-  font-size: 13px;
-  letter-spacing: .05em;
-  opacity: .75;
-}
-#dw-footer {
-  background-color: #535763;
-  color: #e3e3e3 !important;
-}
-#dw-footer {
-  background-color: #484C57;
-  color: #dadada;
-}
+
 #dw-footer a {
   color: #dadada;
   fill: #dadada;
@@ -1146,7 +1096,10 @@ text-align:right;
   opacity: .75;
 }
 #dw-footer .footer-end .footer-social {
-  font-size: 19px;
+  font-size: 21px;
+}
+#dw-footer .footer-end .footer-social .list-inline-item:not(:last-child) {
+  margin-right:0.1rem
 }
 @media (min-width: 768px) {
   #dw-footer {
@@ -1420,74 +1373,4 @@ text-align:right;
     url('/fonts/playfair-display-v20-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
     url('/fonts/playfair-display-v20-latin-700italic.svg#PlayfairDisplay') format('svg'); /* Legacy iOS */
   font-display: swap;
-}
-
-@font-face {
-  font-family: 'fontello';
-  src: url('/fonts/fontello.eot?25243633');
-  src: url('/fonts/fontello.eot?25243633#iefix') format('embedded-opentype'),
-       url('/fonts/fontello.woff2?25243633') format('woff2'),
-       url('/fonts/fontello.woff?25243633') format('woff'),
-       url('/fonts/fontello.ttf?25243633') format('truetype'),
-       url('/fonts/fontello.svg?25243633#fontello') format('svg');
-  font-weight: normal;
-  font-style: normal;
-  font-display: swap;
-}
-/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
-/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
-/*
-@media screen and (-webkit-min-device-pixel-ratio:0) {
-  @font-face {
-    font-family: 'fontello';
-    src: url('../font/fontello.svg?25243633#fontello') format('svg');
-  }
-}
-*/
-
-
-
- [class^="icon-"]:before, [class*=" icon-"]:before {
-  font-family: "fontello";
-  font-style: normal;
-  font-weight: normal;
-  speak: none;
-
-  display: inline-block;
-  text-decoration: inherit;
-  width: 1em;
-  margin-right: .2em;
-  text-align: center;
-  /* opacity: .8; */
-
-  /* For safety - reset parent styles, that can break glyph codes*/
-  font-variant: normal;
-  text-transform: none;
-
-  /* fix buttons height, for twitter bootstrap */
-  line-height: 1em;
-
-  /* Animation center compensation - margins should be symmetric */
-  /* remove if not needed */
-  margin-left: .2em;
-
-  /* you can be more comfortable with increased icons size */
-  /* font-size: 120%; */
-
-  /* Font smoothing. That was taken from TWBS */
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-
-  /* Uncomment for 3D effect */
-  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
-}
-
-.icon-pencil:before { content: '\e800'; } /* '' */
-.icon-book:before { content: '\e801'; } /* '' */
-.icon-twitter:before { content: '\f099'; } /* '' */
-.icon-facebook:before { content: '\f09a'; } /* '' */
-.icon-docs:before { content: '\f0c5'; } /* '' */
-.icon-desktop:before { content: '\f108'; } /* '' */
-.icon-github:before { content: '\f113'; } /* '' */
-.icon-file-code:before { content: '\f1c9'; } /* '' */
-.icon-wikipedia-w:before { content: '\f266'; } /* '' */
+}

index.html

@@ -9,7 +9,7 @@
 <title>David Windham</title>
 <meta property="og:title" content="David Windham"/>
 <meta property="og:description" content="Something Else"/>
-<meta property="og:type" content="website"/><meta property="og:url" content="https://davidwindham.com"/><meta property="og:site_name" content="David Windham"/><meta property="og:image" content="img/og_image.jpg"/><meta property="fb:app_id" content="203136806559589" /><meta name="twitter:site" content="@windhamdavid"><meta name="twitter:creator" content="@windhamdavid"><meta name="twitter:title" content="David Windham"><meta name="twitter:description" content="Something Else"><meta name="twitter:image" content="img/ogt_image.jpg"><meta name="twitter:card" content="summary_large_image"><link rel="apple-touch-icon" sizes="180x180" href="img/apple-touch-icon.png"><link rel="icon" type="image/png" sizes="32x32" href="img/favicon-32x32.png"><link rel="icon" type="image/png" sizes="16x16" href="img/favicon-16x16.png"><link rel="manifest" href="img/site.webmanifest"><link rel="mask-icon" href="img/safari-pinned-tab.svg" color="#3f3f3f"><meta name="msapplication-TileColor" content="#000000"><meta name="theme-color" content="#ffffff">
+<meta property="og:type" content="website"/><meta property="og:url" content="https://davidwindham.com"/><meta property="og:site_name" content="David Windham"/><meta property="og:image" content="img/og_image.jpg"/><meta property="fb:app_id" content="203136806559589" /><meta name="twitter:site" content="@windhamdavid"><meta name="twitter:creator" content="@windhamdavid"><meta name="twitter:title" content="David Windham"><meta name="twitter:description" content="Something Else"><meta name="twitter:image" content="img/ogt_image.jpg"><meta name="twitter:card" content="summary_large_image"><link rel="apple-touch-icon" sizes="180x180" href="img/apple-touch-icon.png"><link rel="icon" type="image/png" sizes="32x32" href="img/favicon-32x32.png"><link rel="icon" type="image/png" sizes="16x16" href="img/favicon-16x16.png"><link rel="manifest" href="img/site.webmanifest"><!--<link rel="mask-icon" href="img/safari-pinned-tab.svg" color="#3f3f3f">--><meta name="msapplication-TileColor" content="#000000"><meta name="theme-color" content="#ffffff">
 <!-- build:css css/dw.css -->
 <link rel="stylesheet" href="./css/fullcalendar.css">
 <link rel="stylesheet" href="css/styles.css">
@@ -101,13 +101,12 @@
     <div class="container main">
       <div class="row">
         <div class="col-lg-6">
-          <h1>Hello Internet Visitor</h1>
+          <h1>Hello ✌🏼 Internet Visitor</h1>
           <p class="lead"></p>
-          <h2 class="">I help folks make good use of the web by crafting custom applications and sites.</h2>
+          <h3 class="">I help folks make good use of the web by crafting custom applications and sites.</h3>
         </div>
-        <div class="col col-lg-6 align-self-end">
+        <div class="col col-lg-6 float-end">
           <img width="200" src="./img/ddog.png" srcset="./img/ddog.png 2x" alt="David Windham"/>
-          <!--<img width="400" src="./img/dw.svg" srcset="./img/dw.svg 2x" alt="David Windham"/>-->
         </div>
       </div>
     </div>
@@ -118,7 +117,10 @@
   <section class="page-view hello">
     <div class="container">
       <div class="row">
-        <div class="col-lg-10">
+        <div class="col-lg-4">
+          <img width="400" src="./img/dw.svg" srcset="./img/dw.svg 2x" alt="David Windham"/>
+        </div>
+        <div class="col-lg-8 ps-5 pt-5 mt-5">
           <h1>Who?</h1>
           <p class="lead">
             I've been a web developer for almost 20 years.
@@ -127,7 +129,19 @@
             I focus on building custom web applications and
             I treat my development like mechanical works of art.
           </p>
-          <img width="300" src="./img/dw-sig.png" alt="David Windham signature">
+          <svg id="signature" x="0px" y="0px" viewBox="0 0 1000 300" width="300">
+            <style type="text/css"> .st0{fill:none;stroke:#535763;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;} </style>
+            <g id="daw">
+              <path class="st0" d="M188.28,63.54l25,148c0,0,4.98,30.96-2,33c-6.86,2-36.28-68.04-76-98c-28.32-21.36-111.67-55.04-112-76 C23,52.5,86.83,33.5,193,33.5c28,0,203.19,7.85,192.28,71.04c-18.28,105.96-251.24,177.92-266,164c-4.28-4.04,187-59,187-59 s20.28-6.22,37.08-11.57c11.16-3.55,14.63-0.47,20.92-5.43c4.87-3.85,4.48-10.62-1-8c-8.28,3.96,9.6,7.13,13,6c6-2,13.92,4.45,18,4 c9-1,8.72-7.96,14-8c5.72-0.04,4.06,4.87,10,5c4.6,0.1,22.6-5.11,28-10c2.65-2.4,3.74-9.43,4-13c0.47-6.31-1.1-18.96-3-25 c-2.25-7.17-11.77-36.08-14-36c-1.9,0.07,1.18,37.4,3,43c2.36,7.24,10.14,35.44,14,42c1.72,2.93,5.26,8.98,8,11c1.72,1.27,8,3,8,3" />
+              <polyline class="st0" points="383.28,154.54 381.28,159.54 387.28,157.54 	"/>
+              <path class="st0" d="M554.28,197.54c0,0-50-10-52-7c-3,4.5,12,18,12,18s-2.76-23.76-8.44-49c-6.34-28.17-15.57-58.16-13.56-59 c12-5,59.17,104.23,66,127"/>
+              <line class="st0" x1="572.28" y1="201.54" x2="569.28" y2="198.54"/>
+              <path class="st0" d="M603.28,163.54c0,0-4,5-4,14c0,8.85,11,27,24,26c6.07-0.47,15,0,23-8c3.25-3.25,8.41-12.79,13-13 c4.07-0.19,8.7,8.61,12,11c5.51,3.99,19.31,9.2,26,8c13.25-2.37,35-5,46-28c4.51-9.42,9.33-30.64,8-41 c-2.23-17.33-11.1-53.21-23-66c-13.02-14-28-32-68-35c-11.39-0.85-35.11,5.28-45,11c-2.75,1.59-9,6.82-9,10"/>
+              <polyline class="st0" points="726.28,132.54 727.28,133.54 730.28,131.54 	"/>
+              <path class="st0" d="M739.28,162.54c0,0,6.17,19.8,12,20c3.05,0.11,4.17-8.87,7-10c4.36-1.74,12.66,6.19,17,8 c3.49,1.45,11.34,2.94,15,2c3.7-0.95,7.18-5.95,11-6c2.15-0.03,6.81,3.58,9,3c3.42-0.91,8.54-6.78,10-10 c4.55-10.02,2.15-32.19,0-44c-2.42-13.3-16-57-19-55c-3.72,2.48-0.4,42.4,3,56c1.75,7,10.14,46.8,17.28,52.14 c6.44,4.82,11.72-35.14,11.72-35.14s3.72-26.04,2-26c-3.28,0.08-6,23-6,23s-3,32-2.19,32.57c3.28,2.3,4.19-7.57,7.19-7.57 c2.81,0,4.27,5.75,8,8c5.34,3.22,12.05,5,16,5c8,0,8.85-15,14-15c5,0,15.55,12.97,23,15c11,3,14-11,14-11s21.98,11.25,43,13 c12,1,24-11,24-11s2-2-1-3"/>
+            </g>
+          </svg>
+          <!--<img width="300" src="./img/dw-sig.png" alt="David Windham signature">-->
 
         </div>
       </div>
@@ -568,7 +582,7 @@
       <div class="col-lg-2 col-md-4 offset-md-2 mt-5 mt-md-0">
         <div class="br-widget">
           <ul class="footer-links">
-            <li><a href="https://davidawindham.com/desk/" rel="me"><i class="icon-pencil"></i>&nbsp; Desk</a></li>          
+            <li><a href="https://davidawindham.com/desk/" rel="me"><i class="bi bi-pencil"></i>&nbsp; Desk</a></li>          
             <li><a href="https://davidawindham.com/til/" rel="me"><i class="icon-book"></i>&nbsp; TIL</a></li>
           </ul>
         </div>
@@ -579,7 +593,7 @@
           <ul class="footer-links">
             <li><a href="https://davidawindham.com/cv/" rel="me"><i class="icon-docs"></i>&nbsp; CV</a></li>
             <li><a href="https://code.davidawindham.com/" rel="me"><i class="icon-file-code"></i>&nbsp; Code</a></li>
-            <li><a href="https://davidwindham.com/davidwindham.asc" rel="me"><i class="icon-folder-open-empty"></i>&nbsp; Key</a></li>
+            <li><a href="https://davidwindham.com/davidwindham.asc" rel="me"><i class="bi bi-key"></i>&nbsp; Key</a></li>
           </ul>
         </div>
       </div>
@@ -592,11 +606,13 @@
         </div>
         <div class="col-md-6 text-end">
           <ul class="footer-links footer-social list-inline">
-            <li class="list-inline-item"><a href="https://twitter.com/windhamdavid" class="twitter" rel="me"><i class="bi bi-twitter"></i></a></li>
-            <li class="list-inline-item"><a href="https://github.com/windhamdavid" class="github" rel="me"><i class="icon-github"></i></a></li>
             <li class="list-inline-item"><a href="https://en.wikipedia.org/wiki/User:Windhamdavid" class="wikipedia" rel="me"><i class="icon-wikipedia-w"></i></a></li>
-            <li class="list-inline-item"><a href="https://www.facebook.com/windhamdavid" class="facebook"><i class="icon-facebook"></i></a></li>
-            
+            <li class="list-inline-item"><a href="https://twitter.com/windhamdavid" class="twitter" rel="me"><i class="bi bi-twitter"></i></a></li>
+            <li class="list-inline-item"><a href="https://github.com/windhamdavid" class="github" rel="me"><i class="bi bi-github"></i></a></li>
+            <li class="list-inline-item"><a href="https://www.facebook.com/windhamdavid" class="facebook"><i class="bi bi-facebook"></i></a></li>
+            <li class="list-inline-item"><a href="https://www.reddit.com/windhamdavid" class="reddit"><i class="bi bi-reddit"></i></a></li>
+            <li class="list-inline-item"><a href="https://twitter.com/windhamdavid" class="spotify" rel="me"><i class="bi bi-spotify"></i></a></li>
+            <li class="list-inline-item"><a href="https://www.linkedin.com/in/windhamdavid" class="linkedin" rel="me"><i class="bi bi-linkedin"></i></a></li>
           </ul>
         </div>
       </div>