Adds customized animation to landing logo

ryanmr · ryanmr · commit a9a33c0b9d79 · 2020-10-13T23:27:08.000-05:00
diff --git a/src/css/tailwind.css b/src/css/tailwind.css
@@ -1,3 +1,33 @@
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
+
+/* custom styles below */
+
+[data-animated-logo] path {
+  stroke-dasharray: 17364.90625;
+  stroke-dashoffset: 17364.90625;
+  animation-name: animated-logo-animation;
+  animation-direction: normal;
+  animation-duration: 7s;
+  animation-timing-function: ease-out;
+  animation-fill-mode: forwards;
+}
+
+@keyframes animated-logo-animation {
+  from {
+    stroke-dashoffset: 17364.90625;
+  }
+  to {
+    stroke-dashoffset: 0;
+  }
+}
+
+.special-bg {
+  background-color: #ffffff;
+  background-image: url("data:image/svg+xml,%3Csvg width='84' height='48' viewBox='0 0 84 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h12v6H0V0zm28 8h12v6H28V8zm14-8h12v6H42V0zm14 0h12v6H56V0zm0 8h12v6H56V8zM42 8h12v6H42V8zm0 16h12v6H42v-6zm14-8h12v6H56v-6zm14 0h12v6H70v-6zm0-16h12v6H70V0zM28 32h12v6H28v-6zM14 16h12v6H14v-6zM0 24h12v6H0v-6zm0 8h12v6H0v-6zm14 0h12v6H14v-6zm14 8h12v6H28v-6zm-14 0h12v6H14v-6zm28 0h12v6H42v-6zm14-8h12v6H56v-6zm0-8h12v6H56v-6zm14 8h12v6H70v-6zm0 8h12v6H70v-6zM14 24h12v6H14v-6zm14-8h12v6H28v-6zM14 8h12v6H14V8zM0 8h12v6H0V8z' fill='%23e5cf5f' fill-opacity='0.10' fill-rule='evenodd'/%3E%3C/svg%3E");
+}
+
+.plc-4 > * {
+  @apply pl-4;
+}
diff --git a/src/includes/_logo.html b/src/includes/_logo.html
@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg
+  version="1.1"
+  viewBox="0 0 5066.654 5861.821"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <defs>
+    <clipPath id="a">
+      <path d="m0 5e3h5e3v-5e3h-5e3z" />
+    </clipPath>
+  </defs>
+  <g transform="matrix(1.333333 0 0 -1.333333 -800.012 6264.244)">
+    <g transform="translate(4400 3706.178)">
+      <path
+        d="m0 0-4.022-4.505-8.436 0.283-15.081 4.791-5.83-3.352-7.83-14.464-13.555-7.478-15.145-19.634-8.802-8.329-167.968-96.744-100.561-36.617-20.172-13.99-8.491-3.182-25.096-4.258-68.222-25.171-128.06-75.683-77.329-80.121-31.532-15.259-122.569-142.164-123.447-141.811-35.689-19.739-5.423-8.936-2.433-8.843-6.067-4.543-6.853-2.552-5.113-3.204-2.481-4.003-5.083-11.549-2.829-4.46-28.637-23.275-17.057-8.038-26.298-32.43-30.992-22.381-19.235-7.184-29.732-27.594-46.321-31.577-23.939-23.061-9.286-23.663 1.591-3.162-6.881-3.503-8.115-6.42-3.984-6.813-4.174-12.684-1.762-2.928-2.659-1.978-8.34-2.412-2.925-1.422-2.594-2.442-2.073-3.098-1.799-3.897-0.822-4.601-2.178-19.082-1.239-3.307-1.013-1.977-1.855-2.33-2.662-1.893-7.459-2.167-8.719-0.727-9.295 0.66-7.46 2.709-2.328 0.349-1.184-2.487 0.19-16.437 0.578-47.309 0.587-47.322 0.586-47.341 0.579-47.303 0.556-47.323 0.579-47.339 0.595-47.304 0.578-47.327 0.123-10.908 0.332-24.64-10.099-2.195-6.335-4.972-6.986-8.348-5.65-10.139-2.245-10.221-4.96-6.448-11.691 0.436-13.111 2.726-9.277 0.493-7.545-6.787-11.366-19.881-7.708-4.22-21.497-0.237-4.981-1.639-3.992-3.558-2.991-3.522-1.971-1.627-0.577-2.232-6.01-10.406-2.48-3.221-4.288-2.419-13.442-2.387-27.898-18.137-9.447-2.632-16.33-7.907-14.322-18.664-20.627-40.565 2.395-21.735-14.286-22.28-45.02-44.709-4.78-9.09-1.856-12.522-3.246-56.565 9.863-26.258 22.871-5.29 26.306 0.871 20.315-7.753 6.042-11.341 7.892-28.606 4.071-10.914 9.183-12.023 9.607-10.043 7.59-11.688 2.625-14.265-2.207-13.457-15.003-25.727-3.417-17.311-2.737-13.607-6.768-8.624-8.217-7.051-7.185-9.178-4.346-12.261-2.014-13.918-0.379-33.196-3.257-15.699-0.935-8.818 2.44-3.814 9.352-24.968 0.787-16.848-2.916-14.726-6.748-10.463-10.791-4.004-7.186-7.129 3.559-16.479 12.921-33.367 5.122-31.741 2.584-31.978-1.676-4.754-7.363-12.751-1.659-8.061 3.541-24.082 0.351-9.063-3.342-20.208-21.622-46.773 14.362-12.79 32.998-21.41 37.781-37.997 9.533-6.365 3.33-6.386 2.613-6.994 2.387-4.612 23.258-14.388 83.227-13.045 18.921-7.024 18.338-14.546 15.627-19.74 14.228-31.997 4.59-8.188 5.834-6.19 7.221-3.533 62.533-9.806 28.78-10.431 82.988-74.243 20.987-34.572 41.934-79.27 10.906-14.112 21.024-9.363 63.5-55.751 6.806-3.538 6.769-1.815 52.101 1.068 3.114-1.238 31.165-24.849 4.069-2.15 4.619-1.391 19.775-1.108 6.541-3.073 3.579-3.498 2.281-4.162 1.505-4.913 1.127-5.67 4.107-10.328 12.885-15.792 4.486-9.739 23.259-8.247 7.297-4.389 5.549-5.749 3.747-7.278 2.472-8.416 3.038-18.011 0.872-17.169-0.767-21.969 0.549-6.457 1.239-6.31 2.311-6.297 3.066-5.148 7.648-8.805 3.553-5.594 2.044-6.768 1.985-14.619 0.446-14.112-5.461-40.771 0.303-6.873 4.608-19.742 0.418-7.861-1.62-23.494 0.674-9.941 3.738-19.26 0.958-9.818-0.607-9.45-2.67-17.596-176.941-4.373-176.953-3.691-176.97-2.899-176.971-2.197-177.008-1.514-122.446-0.584-54.533-0.149-177 0.015-177.003 0.682-176.999 1.446-176.956 2.197-176.985 2.859-176.947 3.643-176.928 4.388-176.956 5.047-176.89 5.78-176.876 6.579 6.441 164.094 6.434 164.08 6.435 164.051 6.433 164.058 6.436 164.038 6.434 164.038 6.432 163.959 6.413 163.999 1.136 28.91 0.01 0.199-2.64 2.462-3.259 7.695-13.303 28.701-4.899 5.762-12.097 11.353-5.448 6.798-14.872 11.982-22.08 7.926-41.423 6.247-10.164 9.901-10.714 22.614-17.078 46.174-9.973 17.703-24.574 31.336-13.092 19.395 2.934 15.666 7.192 15.44 4.108 4.468 4.92 3.722 20.466 13.563 12.531 13.3 5.597 4.562 39.051 20.696 14.476 10.865 5.236 5.108 4.431 5.739 2.072 3.306 17.147 36.189 11.385 18.93 4.011 12.751 6.5 45.288 1.505 3.845 1.989 3.909 1.789 2.762 3.677 7.594-8.06 56.172 0.79 17.73 6.891 16.309 4.52 20.731 0.546 9.446-2.401 27.785-2.243 4.307 1.15 8.652 1.39 5.567-0.059 4.886-11.063 20.731-2.015 6.472-1.354 8.02-0.663 15.2 3.271 48.288-2.56 15.912-7.152 13.235-16.823 21.128-27.919 49.913-3.097 8.268-0.529 7.57 0.331 6.599-0.482 5.566-2.854 5.871-7.975 10.183-2.679 5.395 4.056 14.995 0.297 15.838-1.837 27.802-2.858 14.797-15.326 24.129-4.633 10.546-0.403 16.158 7.422 25.642 2.561 16.746-1.013 16.445-6.216 26.503-0.932 11.712 1.459 7.466 5.244 12.158 1.714 5.061 1.087 8.142 0.36 25.22 1.984 7.647 7.616 9.95 3.199 11.83 2.026 3.184 1.078 3.333-1.75 4.742-3.096 3.34-5.988 1.996-4.975 4.101-5.878 1.996-2.669 2.092 2.074-0.113v5.536l-1.403 9.875-5.872 11.968-2.386 6.873-0.659 9.878 5.871 48.846 0.1 14.93-5.615 30.907 0.256 8.745 1.707 7.392 2.004 6.336 1.072 5.604-1.059 16.053-5.991 36.54-0.952 16.925 7.984 94.815-1.666 7.505-4.136 6.598-4.344 5.453-2.382 3.788 0.918 15.542 9.65 37.353 0.457 10.906-4.28 12.912 0.094 13.158 1.581 14.805 0.174 17.965 0.802 2.729 1.811 3.464 1.529 4.203v4.77l-2.073 3.93-7.794 7.175-5.118 20.817-1.761 26.56-4.681 13.215-6.312 11.908-6.097 15.412-4.965 26.562-3.414 9.581-11.226 15.664-1.685 3.04-0.482 1.911-1.355 0.882-1.766 0.728-1.646 1.592-0.809 3.35 3.03 5.405 0.104 4.374-11.148 37.173-0.597 16.992 8.19 17.532-16.559 21.686-6.989 25.672-4.349 28.039-19.273 56.125-6.513 27.187-2.538 28.447 1.382 30.936 9.788 51.372-1.817 11.923-2.777 10.692-6.405 49.195 2.212 8.889 6.772 13.125 2.649 8.126 0.802 8.274-2.145 11.97-1.571 23.798-9.562 43.894 5.89 31.279 14.454 26.352 11.662 27.987-2.448 36.142-10.251 26.061-3.498 12.717-2.249 29.09-12.589 40.876-2.418 26.155-2.264 6.829-3.052 6.508-2.551 6.959-1.61 15.069-1.039 9.998-4.639 11.935-3.214 12.398 2.412 17.894 34.775-1.689 108.082-5.051 108.118-4.752 108.136-4.45 108.119-4.145 108.177-3.853 108.17-3.544 108.152-3.253 108.162-2.944 108.198-2.645 4.273 1.67 3.366 4.493 1.444 7.927 1.495 73.102 1.767 85.173 1.391 67.072 0.85 42.271 27.96-12.276 58.828 0.411 27.438-8.49 33.774-21.082 8.208-7.191 5.6-12.102 3.038-30.604 4.358-16.874 1.822-14.027-3.089-33.146 3.375-15.144 5.462-15.007 17.464-75.389 19.49-83.818-0.913-38.754-0.464-15.199-0.805-13.905 0.972-12.227 4.283-13.104 6.229-8.531 46.857-39.961 36.223-16.987 19.584-3.11 83.255 8.818 9.381-1.638 4.214-2.162 4.667-3.782 4.416-4.79 3.421-5.231 1.265-5.461 1.452-15.818 0.668-3.847 9.319-4.035 97.706-7.487 79.241-5.908 19.316-14.383 12.751-55.089 15.166-18.113 10.856-2.249 69.838 10.739 8.131-3.722 16.57 8.864 37.164 2.948 15.828 11.251 3.825 11.444-0.749 10.65 1.156 7.828 16.95 4.98 15.671 8.037 63.461 11.59 62.485-4.135 75.38-4.919 11.984-4.013 35.545-23.991 78.921-22.792 38.282-8.963 9.257-12.467 1.467-12.467-9.542-4.099-22.132-5.86-9.543-5.296-3.965-17.29 7.479-10.882 13.423-2.436 9.995-2.552 43.005 6.705 21.686-0.543 18.166-9.154 8.199-16.836 3.586-12.078 0.616-30.698 2.49-17.869 5.671-12.352 16.803-22.73 17.201-36.899 6.482-7.25 9.021 0.34 12.884 5.036 11.995 7.534 6.218 7.764-0.728 15.534-4.874 15.108-1.032 15.17 10.505 15.737 11.124 6.019 51.912 8.592 42.021-1.89 13.642-8.832 6.898-15.902 4.705-19.178 6.977-18.525 8.093-10.773 8.466-8.33 9.199-6.002 52.925-23.23 43.744-5.595 10.537-5.585 8.461-8.246 16.509-22.66-10.082-19.293 12.202-10.347 37.138-5.405 10.564 0.853 3.939-1.477 4.439-5.415 0.804-7.432-2.5-7.648-0.796-6.2 6.164-3.114 43.874 4.932 11.304-3.086 9.382-5.926 9.277-2.972 30.934 16.763 44.483 6.315 18.819 13.876 16.574 19.142 65.118 49.092 21.167 11.075 9.808 7.431 41.696 25.73 24.481 6.18 16.868-10.128 1.602-7.081-5.17-9.031-0.218-6.835 3.643-9.305 4.507-3.73 5.264-2.422 5.953-5.311 4.971-10.185 3.891-22.369 5.536-12.259 18.488-11.72 24.536 1.251 44.673 15.714 12.098 1.383 6.663-4.943 6.077-6.532 10.253-3.464 5.176 0.793 14.625 7.801 5.642 1.666 3.581-1.192 2.875-2.101 3.673-1.108 145.336 25.456 29.164 0.357 24.025-9.588 6.438-7.355 28.361-44.68 6.807-8.047 7.799-6.001 30.736-15.629 9.079-0.766 48.686 23.012 11.151 3.076 8.859 0.474 8.794-2.244 10.98-5.368 6.012-1.637 16.915 4.771 11.078-0.019 32.212-7.08z"
+        fill="#e5cf5f"
+      />
+      {# stroke="#000000" stroke-width="50" #}
+    </g>
+    <g clip-path="url(#a)">
+      <g transform="translate(1280.737 1655.265)">
+        <path
+          d="m0 0c-52.461 0-98.183 5.519-137.187 16.506v193.46c39.989-9.979 76.474-14.992 109.457-14.992 50.949 0 87.435 15.88 109.432 47.591 21.972 31.759 32.983 81.342 32.983 148.844l-9.739 735.441h232.393l9.739-733.978c0-127.95-29.241-225.412-87.723-292.41-58.482-66.949-144.933-100.462-259.355-100.462"
+        />
+      </g>
+      <g transform="translate(2550.899 1974.639)">
+        <path
+          d="m0 0c0-98.973-35.621-176.933-106.865-233.904-71.244-56.995-170.361-85.47-297.328-85.47-117.013 0-220.495 21.974-310.473 65.968v215.89c74.002-32.983 136.634-56.228 187.895-69.709 51.239-13.504 98.11-20.246 140.618-20.246 50.997 0 90.145 9.739 117.395 29.241 27.25 19.479 40.875 48.48 40.875 86.978 0 21.495-6.021 40.613-18.014 57.357-11.995 16.745-29.626 32.864-52.87 48.359-23.268 15.496-70.644 40.227-142.127 74.218-67.022 31.496-117.276 61.745-150.764 90.722-33.51 28.977-60.256 62.727-80.262 101.228-20.006 38.476-30.009 83.477-30.009 134.955 0 96.958 32.863 173.167 98.614 228.651 65.726 55.485 156.592 83.238 272.596 83.238 56.996 0 111.352-6.764 163.093-20.247 51.742-13.503 105.858-32.503 162.374-56.969l-74.962-180.678c-58.53 23.988-106.913 40.709-145.151 50.207-38.26 9.501-75.896 14.249-112.91 14.249-43.993 0-77.744-10.267-101.251-30.752-23.509-20.486-35.263-47.233-35.263-80.214 0-20.487 4.749-38.357 14.249-53.614 9.499-15.257 24.612-29.985 45.361-44.232 20.749-14.249 69.876-39.87 147.405-76.834 102.499-48.983 172.758-98.109 210.755-147.332 37.998-49.247 57.019-109.6 57.019-181.06"
+        />
+      </g>
+    </g>
+  </g>
+</svg>
