Update Toolz homepage

This commit is contained in:
Eduar Ursu 2021-08-24 12:16:54 +02:00
parent cf316731a4
commit 6e51b389a2
7 changed files with 68 additions and 38 deletions

View file

@ -173,6 +173,6 @@ background-image: linear-gradient(315deg, #f7b42c 0%, #fc575e 74%);
</div>
</main>
</body>
<script src="./src/js/404.js"></script>
<script src="./src/js/script.js"></script>
</html>

View file

@ -5,7 +5,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Toolz</title>
<link rel="shortcut icon" href="./src/svg/puzzle.svg" type="image/svg+xml">
<link rel="shortcut icon" href="./src/svg/toolz.svg" type="image/svg+xml">
<link href="src/css/style.css" rel="stylesheet">
</head>
@ -13,7 +13,19 @@
<header class="fixed">
<nav>
<a href="index.html">
<svg viewBox="0 0 12.002 12.7" xmlns="http://www.w3.org/2000/svg"><defs><linearGradient id="prefix__a"><stop offset="0" stop-color="#fc575e"/><stop offset="1" stop-color="#f7b42c"/></linearGradient></defs><g paint-order="stroke markers fill" stroke-width="10.32"><path d="M8 4.22c.581-.065 3.977.236 3.961.314L5.19 8.361.034 8.214z" fill-opacity=".831"/><path d="M3.579 4.385C1.42 4.27.047 2.012 0 0h3.982c3.437 0 4.025.013 4.24.044 2.282-.027 3.674 2.286 3.74 4.49M7.38 8.204c2.537.053 4.463 2.109 4.622 4.496l-7.9-.016c-1.18-.019-4.052-1.81-4.068-4.47"/></g></svg>
<svg viewBox="0 0 12.002 12.7" fill="var(--primary)" xmlns="http://www.w3.org/2000/svg">
<defs>
<linearGradient id="prefix__a">
<stop offset="0" stop-color="#fc575e" />
<stop offset="1" stop-color="#f7b42c" />
</linearGradient>
</defs>
<g paint-order="stroke markers fill" stroke-width="10.32">
<path d="M8 4.22c.581-.065 3.977.236 3.961.314L5.19 8.361.034 8.214z" fill-opacity=".831" />
<path
d="M3.579 4.385C1.42 4.27.047 2.012 0 0h3.982c3.437 0 4.025.013 4.24.044 2.282-.027 3.674 2.286 3.74 4.49M7.38 8.204c2.537.053 4.463 2.109 4.622 4.496l-7.9-.016c-1.18-.019-4.052-1.81-4.068-4.47" />
</g>
</svg>
</a>
<ul>
<li>
@ -57,50 +69,68 @@
</button>
</nav>
</header>
<main class="_pt-3">
<!-- Header -->
<div class="hero">
<div class="_aos-top card">
<div class="img-w">
<svg viewBox="0 0 123.861 131.067" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg"><defs><linearGradient id="prefix__a"><stop offset="0" stop-color="#fc575e"/><stop offset="1" stop-color="#f7b42c"/></linearGradient><linearGradient xlink:href="#prefix__a" id="prefix__b" x1="43.078" y1="111.56" x2="774.291" y2="715.75" gradientUnits="userSpaceOnUse" gradientTransform="translate(128.24 161.152)"/></defs><g paint-order="stroke markers fill"><path d="M82.57 43.56c5.988-.68 41.036 2.433 40.872 3.236l-69.89 39.492L.353 84.773z" fill="#9c2a24"/><path d="M267.83 332.194c-84.193-4.441-137.743-92.535-139.59-171.042h155.33c134.049 0 157.001.529 165.408 1.731 88.985-1.066 143.267 89.144 145.815 175.135M416.12 481.196c98.948 2.03 174.07 82.23 180.256 175.329l-308.118-.623c-46.077-.727-158.063-70.57-158.683-174.35" transform="matrix(.26458 0 0 .26458 -33.93 -42.638)" fill="url(#prefix__b)"/></g></svg>
</div>
<h4>Toolz</h4>
<p>A set of useful tools </p>
<svg fill="currentColor" viewBox="0 0 123.861 131.067" xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg">
<defs>
<linearGradient id="prefix__a">
<stop offset="0" stop-color="#fc575e" />
<stop offset="1" stop-color="#f7b42c" />
</linearGradient>
<linearGradient xlink:href="#prefix__a" id="prefix__b" x1="43.078" y1="111.56" x2="774.291"
y2="715.75" gradientUnits="userSpaceOnUse"
gradientTransform="translate(128.24 161.152)" />
</defs>
<g paint-order="stroke markers fill">
<path d="M82.57 43.56c5.988-.68 41.036 2.433 40.872 3.236l-69.89 39.492L.353 84.773z"
fill="#9c2a24" />
<path
d="M267.83 332.194c-84.193-4.441-137.743-92.535-139.59-171.042h155.33c134.049 0 157.001.529 165.408 1.731 88.985-1.066 143.267 89.144 145.815 175.135M416.12 481.196c98.948 2.03 174.07 82.23 180.256 175.329l-308.118-.623c-46.077-.727-158.063-70.57-158.683-174.35"
transform="matrix(.26458 0 0 .26458 -33.93 -42.638)" fill="url(#prefix__b)" />
</g>
</svg>
</div>
<h4>Toolz</h4>
<p>A set of useful tools </p>
</div>
</div>
<section>
<div class="_2-col" id="ext-grid">
<a href="" target="_blank">
<div class="card _aos-bottom">
<div class="img-w"><svg version="1.0" fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 106 106"><path d="M35 1.5c-9.1 2-22.1 6.3-25.9 8.6-4.3 2.6-4.9 4.8-4.6 16.6.8 25.7 13 51.2 32.8 68.7 8.2 7.2 13.1 10.6 15.5 10.6 4.9 0 20.6-13.4 29.6-25.4 12.6-16.7 18.8-35 19-55.9.1-10.6 0-10.9-2.6-13.2C95.7 8.8 87.9 5.7 77 2.8 67.2.2 44.4-.5 35 1.5zm36 6.6c7.5 1.4 22.7 6.6 23.7 8.2 1.1 1.8.5 14.1-1.1 22.2-2.3 11.6-8 25.8-14.1 35-4.6 7-18.5 21.4-23.4 24.4l-3.4 2-3.1-2.2C40 91.1 28.7 77.9 22.2 66c-3.6-6.6-8.7-20.7-9.7-27-.4-2.5-.9-5.2-1-6.1-.4-2-.7-10.2-.6-14.2.1-2.3.9-3.1 4.9-4.8 15.7-6.8 36.9-9 55.2-5.8z"/><path d="M44.7 13.6c-.1.1-2.4.4-5.2.8-5.8.7-14.8 3.2-18.9 5.3-2.9 1.5-2.9 1.5-2.3 9.1.6 9.1 3.3 21.2 5.1 23.8 1.3 1.7 1.5 1.7 6 0 2.5-1 4.6-2.2 4.6-2.7s.1-1.1.1-1.4c.1-.2.6-2.8 1-5.6C36.9 31.3 48.6 24 59.6 27.7 63.4 29 71 35.2 71 37.1c0 2.5 14.5-.3 16-3.1.5-1 1-4.1 1.1-7 .2-4.2-.2-5.6-1.7-6.7-2.3-1.7-13.6-5.2-18.9-5.9-4.2-.6-22.3-1.2-22.8-.8zM76.5 46.9c-2.3.5-3.3 1.5-4.5 4.7-5 13.2-19.1 17.9-29.7 9.8-3.1-2.3-3.6-2.4-6.9-1.2-5 1.8-5.9 3.9-3.7 8.6 2.5 5.3 18.2 21.2 21 21.2 2.9 0 14.1-10.5 19.9-18.6C79.4 61.9 85.8 47 83.1 47c-.5 0-1.5-.2-2.3-.4-.7-.2-2.6-.1-4.3.3z"/></svg></div>
<h5 class="_txt-center">Adblock Test</h5>
</div>
</a>
<a href="./fontlist.html" target="_blank">
<div class="card _aos-bottom">
<div class="img-w"><svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M216 120h272c13.3 0 24-10.7 24-24s-10.75-24-24-24H216c-13.3 0-24 10.75-24 24s10.7 24 24 24zm272 272H216c-13.3 0-24 10.7-24 24s10.75 24 24 24h272c13.25 0 24-10.75 24-24s-10.7-24-24-24zm0-160H216c-13.3 0-24 10.7-24 24s10.75 24 24 24h272c13.3 0 24-10.7 24-24s-10.7-24-24-24zM191.384 208.425L116.16 29.321c-3.344-7.975-16.469-7.975-19.813 0L21.123 208.425c-2.302 5.472.273 11.776 5.744 14.069a10.73 10.73 0 0014.07-5.745l15.129-36.022h100.388l15.13 36.022c1.71 4.124 5.695 6.587 9.904 6.587 1.386 0 2.799-.266 4.156-.84 5.471-2.295 8.068-8.608 5.74-14.07zM65.115 159.216l41.15-98.373 41.158 98.015H65.115zM153.843 356.303c10.402-10.045 16.92-24.107 16.92-39.687 0-30.523-24.822-55.358-55.358-55.358h-62.5c-5.915 0-10.714 4.8-10.714 10.715v178.571c0 5.938 4.8 10.714 10.714 10.714h76.786c30.536 0 55.357-24.821 55.357-55.357 0-21.83-12.812-40.58-31.205-49.598zM63.62 282.687h51.785c18.71 0 33.929 15.219 33.929 33.929s-15.223 33.928-33.929 33.928H63.62zM129.69 439.83H63.62v-67.857h66.071c18.71 0 33.929 15.218 33.929 33.928 0 18.71-15.224 33.929-33.929 33.929z"/></svg></div>
<h5 class="_txt-center">FontList</h5>
</div>
</a>
<div class="card _aos-bottom">
<div class="img-w"><img
src="./resources/adblock/icon.svg"
alt=""></div>
<a href="" target="_blank">
<div class="card _aos-bottom _txt">
<div class="img-w"><svg version="1.0" fill="currentColor" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 106 106">
<path
d="M35 1.5c-9.1 2-22.1 6.3-25.9 8.6-4.3 2.6-4.9 4.8-4.6 16.6.8 25.7 13 51.2 32.8 68.7 8.2 7.2 13.1 10.6 15.5 10.6 4.9 0 20.6-13.4 29.6-25.4 12.6-16.7 18.8-35 19-55.9.1-10.6 0-10.9-2.6-13.2C95.7 8.8 87.9 5.7 77 2.8 67.2.2 44.4-.5 35 1.5zm36 6.6c7.5 1.4 22.7 6.6 23.7 8.2 1.1 1.8.5 14.1-1.1 22.2-2.3 11.6-8 25.8-14.1 35-4.6 7-18.5 21.4-23.4 24.4l-3.4 2-3.1-2.2C40 91.1 28.7 77.9 22.2 66c-3.6-6.6-8.7-20.7-9.7-27-.4-2.5-.9-5.2-1-6.1-.4-2-.7-10.2-.6-14.2.1-2.3.9-3.1 4.9-4.8 15.7-6.8 36.9-9 55.2-5.8z" />
<path
d="M44.7 13.6c-.1.1-2.4.4-5.2.8-5.8.7-14.8 3.2-18.9 5.3-2.9 1.5-2.9 1.5-2.3 9.1.6 9.1 3.3 21.2 5.1 23.8 1.3 1.7 1.5 1.7 6 0 2.5-1 4.6-2.2 4.6-2.7s.1-1.1.1-1.4c.1-.2.6-2.8 1-5.6C36.9 31.3 48.6 24 59.6 27.7 63.4 29 71 35.2 71 37.1c0 2.5 14.5-.3 16-3.1.5-1 1-4.1 1.1-7 .2-4.2-.2-5.6-1.7-6.7-2.3-1.7-13.6-5.2-18.9-5.9-4.2-.6-22.3-1.2-22.8-.8zM76.5 46.9c-2.3.5-3.3 1.5-4.5 4.7-5 13.2-19.1 17.9-29.7 9.8-3.1-2.3-3.6-2.4-6.9-1.2-5 1.8-5.9 3.9-3.7 8.6 2.5 5.3 18.2 21.2 21 21.2 2.9 0 14.1-10.5 19.9-18.6C79.4 61.9 85.8 47 83.1 47c-.5 0-1.5-.2-2.3-.4-.7-.2-2.6-.1-4.3.3z" />
</svg></div>
<h5 class="_txt-center">Adblock Test</h5>
</div>
<div class="card _aos-bottom">
<div class="img-w"><img
src="./resources/adblock/icon.svg"
alt=""></div>
<h5 class="_txt-center">Adblock Test</h5>
</a>
<a href="./fontlist.html" target="_blank">
<div class="card _aos-bottom _txt">
<div class="img-w"><svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
<path fill="currentColor"
d="M216 120h272c13.3 0 24-10.7 24-24s-10.75-24-24-24H216c-13.3 0-24 10.75-24 24s10.7 24 24 24zm272 272H216c-13.3 0-24 10.7-24 24s10.75 24 24 24h272c13.25 0 24-10.75 24-24s-10.7-24-24-24zm0-160H216c-13.3 0-24 10.7-24 24s10.75 24 24 24h272c13.3 0 24-10.7 24-24s-10.7-24-24-24zM191.384 208.425L116.16 29.321c-3.344-7.975-16.469-7.975-19.813 0L21.123 208.425c-2.302 5.472.273 11.776 5.744 14.069a10.73 10.73 0 0014.07-5.745l15.129-36.022h100.388l15.13 36.022c1.71 4.124 5.695 6.587 9.904 6.587 1.386 0 2.799-.266 4.156-.84 5.471-2.295 8.068-8.608 5.74-14.07zM65.115 159.216l41.15-98.373 41.158 98.015H65.115zM153.843 356.303c10.402-10.045 16.92-24.107 16.92-39.687 0-30.523-24.822-55.358-55.358-55.358h-62.5c-5.915 0-10.714 4.8-10.714 10.715v178.571c0 5.938 4.8 10.714 10.714 10.714h76.786c30.536 0 55.357-24.821 55.357-55.357 0-21.83-12.812-40.58-31.205-49.598zM63.62 282.687h51.785c18.71 0 33.929 15.219 33.929 33.929s-15.223 33.928-33.929 33.928H63.62zM129.69 439.83H63.62v-67.857h66.071c18.71 0 33.929 15.218 33.929 33.928 0 18.71-15.224 33.929-33.929 33.929z" />
</svg></div>
<h5 class="_txt-center">FontList</h5>
</div>
</a>
<a href="./units.html" target="_blank">
<div class="card _aos-bottom _txt">
<div class="img-w">
<svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M464 272h-224v-224C240 21.6 218.4 0 192 0H48C21.6 0 0 21.6 0 48v416C0 490.4 21.6 512 48 512h416c26.4 0 48-21.6 48-48V320C512 293.6 490.4 272 464 272zM464 464h-416v-416H192v47.1H112c-8.836 0-16 7.162-16 16c0 8.836 7.164 16 16 16L192 128v64H112C103.2 192 96 199.2 96 208C96 216.8 103.2 224 112 224H192v64H112C103.2 288 96 295.2 96 304C96 312.8 103.2 320 112 320H192v80C192 408.8 199.2 416 208 416C216.8 416 224 408.8 224 400V320h64v80c0 8.836 7.164 16 16 16c8.838 0 16-7.164 16-16V320h64v80c0 8.836 7.164 16 16 16c8.838 0 16-7.164 16-16V320h48V464z"></path></svg>
</div>
<h5 class="_txt-center">Units</h5>
</div>
</a>
</div>
</section>
<footer class="_bg _radius _aos">

1
resources/toolz2.svg Normal file

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 6 KiB

View file

@ -9,7 +9,7 @@ html,
--red: #FF4132;
--orange: #FF851A;
--yellow: #ffcd36;
--primary: var(--txt);
--primary: #f3535b;
--accent: #E3F2FD;
--active: #ECEFF1;
--txt: #14191f;
@ -55,6 +55,7 @@ html,
--red: #ff564d;
--orange: #ff9f4d;
--yellow: #ffd24d;
--primary:var(--white);
--txt: #f2f4f7;
--txt-r: #14191f;
--bg3: #2c3844;
@ -145,9 +146,6 @@ dd {
margin-bottom: 0.4rem;
}
dt {
font-weight: bold;
}
/* ------------ Animation On Scroll ----------- */
[class*=_aos],

View file

Before

Width:  |  Height:  |  Size: 962 B

After

Width:  |  Height:  |  Size: 962 B

1
src/svg/toolz.svg Normal file
View file

@ -0,0 +1 @@
<svg width="483.78" height="483.78" viewBox="0 0 128 128" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg"><defs><linearGradient id="prefix__a"><stop offset="0" stop-color="#fc575e"/><stop offset="1" stop-color="#f7b42c"/></linearGradient><linearGradient xlink:href="#prefix__a" id="prefix__b" x1="43.078" y1="111.56" x2="774.291" y2="715.75" gradientUnits="userSpaceOnUse" gradientTransform="translate(-11.029 35.502) scale(1.54339)"/></defs><circle cx="64" cy="64" r="64" fill="#fffeff" paint-order="stroke markers fill"/><g paint-order="stroke markers fill" stroke-width="1.543"><path d="M77.374 49.763c3.88-.44 26.588 1.577 26.481 2.097L58.572 77.448l-34.469-.982z" fill="#9c2a24"/><path d="M267.83 332.194c-84.193-4.441-137.743-92.535-139.59-171.042h155.33c134.049 0 157.001.529 165.408 1.731 88.985-1.066 143.267 89.144 145.815 175.135M416.12 481.196c98.948 2.03 174.07 82.23 180.256 175.329l-308.118-.623c-46.077-.727-158.063-70.57-158.683-174.35" transform="matrix(.17143 0 0 .17143 1.89 -6.086)" fill="url(#prefix__b)"/></g></svg>

After

Width:  |  Height:  |  Size: 1 KiB