Skip to content

Commit

Permalink
patch: new icons on home page boxes
Browse files Browse the repository at this point in the history
  • Loading branch information
TalhaFaisalglor committed May 2, 2024
1 parent 882d644 commit b9210cb
Show file tree
Hide file tree
Showing 3 changed files with 30 additions and 16 deletions.
1 change: 1 addition & 0 deletions src/assets/img/home-tile-icons/arrow.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
30 changes: 15 additions & 15 deletions src/pages/_includes/widgets/home-tiles.njk
Original file line number Diff line number Diff line change
@@ -1,41 +1,41 @@
{% from "widgets/svg-icons.njk" import rocketshipIcon, craneIcon, toolPanelIcon, personReadingIcon %}
{% from "widgets/svg-icons.njk" import rocketshipIcon, craneIcon, toolPanelIcon, personReadingIcon, externalLinkIcon, helpIcon, dumbbelIcon %}
<div id="home-tiles">
{% linkTile "/getting-started/" | url, "home-tile" %}
{{ personReadingIcon() }}
{{ toolPanelIcon() }}
<div class="text-wrapper">
<h2>Getting Started</h2>
<p>Start here to get up and running with Sprucebot.</p>
<h2>1. Getting Started</h2>
<p>Your journey starts with setting up the Development Theatre.</p>
</div>
{% endlinkTile %}
{% linkTile "/ideology/" | url, "home-tile" %}
{{ toolPanelIcon() }}
{{ personReadingIcon() }}
<div class="text-wrapper">
<h2>Ideology</h2>
<p>Delve deeper into the foundational principles that drive Sprucebot.</p>
<h2>2. Ideology</h2>
<p>After setup, dive into the core principles upon which Spruce is built.</p>
</div>
{% endlinkTile %}

{% linkTile "/concepts/" | url, "home-tile" %}
{{ craneIcon() }}
<div class="text-wrapper">
<h2>Concepts</h2>
<p>Gain a solid understanding of the fundamental concepts around Sprucebot.</p>
<h2>3. Concepts</h2>
<p>Now that you've got the core principles, let's talk about the building blocks.</p>
</div>
{% endlinkTile %}

{% linkTile "/training/" | url, "home-tile" %}
{{ rocketshipIcon() }}
{{ dumbbelIcon() }}
<div class="text-wrapper">
<h2>Training</h2>
<p>Training materials that ensure a seamless initiation process into the Sprucebot ecosystem.</p>
<h2>4. Training</h2>
<p>You've got the ideology, you get the concepts, it's time to get our hands dirty.</p>
</div>
{% endlinkTile %}

{% linkTile "/help/" | url, "home-tile" %}
{{ rocketshipIcon() }}
{{ helpIcon() }}
<div class="text-wrapper">
<h2>Help</h2>
<p>Get help with Sprucebot.</p>
<h2>5. Help</h2>
<p>Well that didn't go as expected. Review our help docs and join our Discord server.</p>
</div>
{% endlinkTile %}
</div>
15 changes: 14 additions & 1 deletion src/pages/_includes/widgets/svg-icons.njk
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@

{% macro githubLogo(fillColor = "currentcolor") %}
<svg viewBox="0 0 24 24" fill="{{fillColor}}" xmlns="http://www.w3.org/2000/svg"><title>Circle with shading containing number of developers watching project statistic</title>

<path d="M12 0.296875C5.37 0.296875 0 5.66988 0 12.2969C0 17.5999 3.438 22.0969 8.205 23.6819C8.805 23.7949 9.025 23.4239 9.025 23.1049C9.025 22.8199 9.015 22.0649 9.01 21.0649C5.672 21.7889 4.968 19.4549 4.968 19.4549C4.422 18.0699 3.633 17.6999 3.633 17.6999C2.546 16.9559 3.717 16.9709 3.717 16.9709C4.922 17.0549 5.555 18.2069 5.555 18.2069C6.625 20.0419 8.364 19.5119 9.05 19.2049C9.158 18.4289 9.467 17.8999 9.81 17.5999C7.145 17.2999 4.344 16.2679 4.344 11.6699C4.344 10.3599 4.809 9.28988 5.579 8.44988C5.444 8.14688 5.039 6.92688 5.684 5.27388C5.684 5.27388 6.689 4.95188 8.984 6.50388C9.944 6.23688 10.964 6.10488 11.984 6.09888C13.004 6.10488 14.024 6.23688 14.984 6.50388C17.264 4.95188 18.269 5.27388 18.269 5.27388C18.914 6.92688 18.509 8.14688 18.389 8.44988C19.154 9.28988 19.619 10.3599 19.619 11.6699C19.619 16.2799 16.814 17.2949 14.144 17.5899C14.564 17.9499 14.954 18.6859 14.954 19.8099C14.954 21.4159 14.939 22.7059 14.939 23.0959C14.939 23.4109 15.149 23.7859 15.764 23.6659C20.565 22.0919 24 17.5919 24 12.2969C24 5.66988 18.627 0.296875 12 0.296875Z"
fill="{{fillColor}}" />
</svg>
Expand Down Expand Up @@ -211,4 +212,16 @@
<path d='M8.58211 0H5.70405C5.47328 0 5.28626 0.187021 5.28626 0.417788C5.28626 0.648555 5.47328 0.835576 5.70405 0.835576H7.61992L3.51989 4.9356C3.35665 5.09874 3.35665 5.36332 3.51989 5.52646C3.60146 5.60803 3.70842 5.64887 3.81527 5.64887C3.92213 5.64887 4.02908 5.60803 4.11066 5.52646L8.16432 1.47269V3.29575C8.16432 3.52652 8.35135 3.71354 8.58211 3.71354C8.81288 3.71354 8.9999 3.52652 8.9999 3.29575V0.417788C8.9999 0.187021 8.81288 0 8.58211 0Z' fill='{{encodedColor}}'/>
<path d='M7.13711 4.20733C6.90635 4.20733 6.71933 4.39435 6.71933 4.62512V7.92127C6.71933 8.07227 6.5918 8.19979 6.4408 8.19979H1.1141C0.9631 8.19979 0.835576 8.07227 0.835576 7.92127V2.59457C0.835576 2.44357 0.9631 2.31604 1.1141 2.31604H4.42189C4.65266 2.31604 4.83968 2.12902 4.83968 1.89826C4.83968 1.66749 4.65266 1.48047 4.42189 1.48047H1.1141C0.499761 1.48047 0 1.98023 0 2.59457V7.92127C0 8.53561 0.499761 9.03537 1.1141 9.03537H6.4408C7.05514 9.03537 7.5549 8.53561 7.5549 7.92127V4.62512C7.5549 4.39445 7.36788 4.20733 7.13711 4.20733Z' fill='{{$encodedColor}}'/>
</svg>
{% endmacro %}
{% endmacro %}

{% macro helpIcon(fillColor = 'currentColor') %}
<svg width="59" height="52" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
<path d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336h24V272H216c-13.3 0-24-10.7-24-24s10.7-24 24-24h48c13.3 0 24 10.7 24 24v88h8c13.3 0 24 10.7 24 24s-10.7 24-24 24H216c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z"/>
</svg>
{% endmacro %}

{% macro dumbbelIcon(fillColor = 'currentColor') %}
<svg width="59" height="52" viewBox="0 0 640 512" xmlns="http://www.w3.org/2000/svg">
<path d="M96 64c0-17.7 14.3-32 32-32h32c17.7 0 32 14.3 32 32V224v64V448c0 17.7-14.3 32-32 32H128c-17.7 0-32-14.3-32-32V384H64c-17.7 0-32-14.3-32-32V288c-17.7 0-32-14.3-32-32s14.3-32 32-32V160c0-17.7 14.3-32 32-32H96V64zm448 0v64h32c17.7 0 32 14.3 32 32v64c17.7 0 32 14.3 32 32s-14.3 32-32 32v64c0 17.7-14.3 32-32 32H544v64c0 17.7-14.3 32-32 32H480c-17.7 0-32-14.3-32-32V288 224 64c0-17.7 14.3-32 32-32h32c17.7 0 32 14.3 32 32zM416 224v64H224V224H416z"/>
</svg>
{% endmacro %}

0 comments on commit b9210cb

Please sign in to comment.