mirror of
https://github.com/privacyguides/privacyguides.org.git
synced 2026-03-11 08:54:41 +00:00
Use markdown syntax for toolbox
This commit is contained in:
parent
1a24efd0c3
commit
cb8135bd25
3 changed files with 26 additions and 64 deletions
|
|
@ -21,5 +21,8 @@ For privacy to become a valued and respected human right, **we must work togethe
|
|||
|
||||
This section will progressively grow with more tools to support the community in its privacy advocacy and activism effort. The Privacy Activist Toolbox is the first part of this new development.
|
||||
|
||||
<style>.category-button {background-color: var(--pg-blue);}</style>
|
||||
[<div class="category-button" markdown>{.category-button-icon} Privacy Activist Toolbox</div>](toolbox/index.md)
|
||||
<div class="toolbox-button-grid" markdown>
|
||||
|
||||
[:fontawesome-solid-toolbox:{ .toolbox-button-icon } Privacy Activist Toolbox](toolbox/index.md){ .toolbox-button .toolbox-bg-legal }
|
||||
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -20,68 +20,23 @@ This page is also a resource to help digital rights organizations that would lik
|
|||
|
||||
<div class="toolbox-button-grid" markdown>
|
||||
|
||||
<a href="#check-your-laws">
|
||||
<button class="toolbox-button toolbox-bg-legal" markdown>
|
||||
{ .toolbox-button-icon }
|
||||
Check<br>Your Laws
|
||||
</button>
|
||||
</a>
|
||||
[:fontawesome-solid-scale-balanced:{ .toolbox-button-icon } Check<br>Your Laws](#check-your-laws){ .toolbox-button .toolbox-bg-legal }
|
||||
|
||||
<a href="#choose-your-tools">
|
||||
<button class="toolbox-button toolbox-bg-tools" markdown>
|
||||
{ .toolbox-button-icon }
|
||||
Choose<br>Your Tools
|
||||
</button>
|
||||
</a>
|
||||
[:fontawesome-solid-toolbox:{ .toolbox-button-icon } Choose<br>Your Tools](#choose-your-tools){ .toolbox-button .toolbox-bg-tools }
|
||||
|
||||
<a href="#expand-your-perspective">
|
||||
<button class="toolbox-button toolbox-bg-perspective" markdown>
|
||||
{ .toolbox-button-icon }
|
||||
Expand Your Perspective
|
||||
</button>
|
||||
</a>
|
||||
[:fontawesome-solid-users-rays:{ .toolbox-button-icon } Expand Your Perspective](#expand-your-perspective){ .toolbox-button .toolbox-bg-perspective }
|
||||
|
||||
<a href="#support-the-community">
|
||||
<button class="toolbox-button toolbox-bg-community" markdown>
|
||||
{ .toolbox-button-icon }
|
||||
Support The Community
|
||||
</button>
|
||||
</a>
|
||||
[:fontawesome-solid-hands-holding-circle:{ .toolbox-button-icon } Support The Community](#support-the-community){ .toolbox-button .toolbox-bg-community }
|
||||
|
||||
<a href="#build-alliances">
|
||||
<button class="toolbox-button toolbox-bg-alliances" markdown>
|
||||
{ .toolbox-button-icon }
|
||||
Build<br>Alliances
|
||||
</button>
|
||||
</a>
|
||||
[:fontawesome-solid-handshake-angle:{ .toolbox-button-icon } Build<br>Alliances](#build-alliances){ .toolbox-button .toolbox-bg-alliances }
|
||||
|
||||
<a href="#make-it-accessible">
|
||||
<button class="toolbox-button toolbox-bg-accessibility" markdown>
|
||||
{ .toolbox-button-icon }
|
||||
Make It Accessible
|
||||
</button>
|
||||
</a>
|
||||
[:fontawesome-solid-heart-circle-check:{ .toolbox-button-icon } Make It Accessible](#make-it-accessible){ .toolbox-button .toolbox-bg-accessibility }
|
||||
|
||||
<a href="#uphold-integrity">
|
||||
<button class="toolbox-button toolbox-bg-integrity" markdown>
|
||||
{ .toolbox-button-icon }
|
||||
Uphold<br>Integrity
|
||||
</button>
|
||||
</a>
|
||||
[:fontawesome-solid-star:{ .toolbox-button-icon } Uphold<br>Integrity](#uphold-integrity){ .toolbox-button .toolbox-bg-integrity }
|
||||
|
||||
<a href="#stay-persistent">
|
||||
<button class="toolbox-button toolbox-bg-persistence" markdown>
|
||||
{ .toolbox-button-icon }
|
||||
Stay<br>Persistent
|
||||
</button>
|
||||
</a>
|
||||
[:fontawesome-solid-heart:{ .toolbox-button-icon } Stay<br>Persistent](#stay-persistent){ .toolbox-button .toolbox-bg-persistence }
|
||||
|
||||
<a href="#take-action">
|
||||
<button class="toolbox-button toolbox-bg-action" markdown>
|
||||
{ .toolbox-button-icon }
|
||||
Take Action!
|
||||
</button>
|
||||
</a>
|
||||
[:fontawesome-solid-hand-fist:{ .toolbox-button-icon } Take<br>Action!](#take-action){ .toolbox-button .toolbox-bg-action }
|
||||
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -628,7 +628,7 @@ path[d="M20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-
|
|||
}
|
||||
|
||||
/* Category Button Style*/
|
||||
.category-button {
|
||||
.md-typeset .category-button {
|
||||
display:flex;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
|
|
@ -639,13 +639,13 @@ path[d="M20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-
|
|||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.category-button:hover {
|
||||
.md-typeset .category-button:hover {
|
||||
position: relative;
|
||||
transform: scale(1.01);
|
||||
box-shadow: 5px 10px 10px 5px rgba(0,0,0,0.3);
|
||||
}
|
||||
|
||||
.category-button a, .category-button a:hover {
|
||||
.md-typeset .category-button a, .md-typeset .category-button a:hover {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
|
|
@ -665,7 +665,7 @@ path[d="M20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-
|
|||
grid-gap: 0.7rem;
|
||||
}
|
||||
|
||||
.toolbox-button {
|
||||
.toolbox-button-grid .toolbox-button {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
|
|
@ -676,24 +676,28 @@ path[d="M20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-
|
|||
height: 7rem;
|
||||
width: 7rem;
|
||||
color: white;
|
||||
background-color: grey;
|
||||
padding: 5px;
|
||||
border: 2px solid var(--pg-light-border);
|
||||
border-radius: 12px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.toolbox-button:hover {
|
||||
.toolbox-button-grid .toolbox-button:hover {
|
||||
position: relative;
|
||||
transform: scale(1.08);
|
||||
box-shadow: 5px 10px 10px 5px rgba(0,0,0,0.3);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.toolbox-button-icon {
|
||||
.toolbox-button-grid .toolbox-button-icon {
|
||||
height: 5em;
|
||||
display: inline-flex;
|
||||
padding: 8px 30px 5px 30px;
|
||||
overflow: visible;
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
.toolbox-button-grid .toolbox-button-icon svg {
|
||||
width: 5em;
|
||||
}
|
||||
|
||||
/* Toolbox Button Colors*/
|
||||
|
|
|
|||
Loading…
Reference in a new issue