Guides Pages Redesign - Updated (Retry) (#3548)

* Guide Pages Redesign Files * Guide Pages Redesign Files (Updated) * Guide Pages Redesign Files (Updated) * Retry commit changes to Guide Redesign * Fix Lint SCSS / Lint SCSS and minor updates to JS * Updated font-sizes to headings, adjusted images, and applied active link to feedback form. * Updated md file. Shows bolded in section titles in sticky nav. * Updates to guides.html, scss, and md. * Update headings with font-weight:400.
hackforla · Sep 13, 2022 · b5fedfa · b5fedfa
1 parent 3bfa8f7
commit b5fedfa
Show file tree

Hide file tree

Showing 21 changed files with 1,246 additions and 0 deletions.
diff --git a/_guide-pages/how-to-set-reminders-in-slack.md b/_guide-pages/how-to-set-reminders-in-slack.md
@@ -0,0 +1,150 @@
+---
+layout: guides
+title: How to Set Reminders in Slack
+provider-link: "/how-to-set-reminders-in-slack"
+overview: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
+guide-author:
+  - name: "Maria Studnicka"
+    links:
+      linked-in: "https://www.linkedin.com/in/maria-studnicka/"
+      github: "https://github.com/mariastudnicka"
+    picture: https://avatars.githubusercontent.com/mariastudnicka
+  - name: "Katie Jensen" 
+    links:
+      linked-in: "https://www.linkedin.com/in/katie-jensen/"
+      github: 
+    picture: https://media-exp1.licdn.com/dms../assets/../assets/images/guides/how-to-set-reminders-in-slack/guides/how-to-set-reminders-in-slack-2/_image/C4E03AQFxH7i2p-BbAQ/profile-displayphoto-shrink_400_400/0/1623178954400?e=1650499200&v=beta&t=7JZ76Ux55xt-UhcvTWODpcMDYcP1v9nHa6Pymi9Hae4
+  - name: "Saasha Gilkes"
+    links:
+      linked-in: "https://www.linkedin.com/in/saashagilkes/"
+      github: "https://github.com/SaashaG"
+    picture: https://avatars.githubusercontent.com/SaashaG
+  - name: "Olivia Chiong"
+    links:
+      linked-in: "https://www.linkedin.com/in/chiongolivia/"
+      github: "https://github.com/Olivia-Chiong"
+    picture: https://avatars.githubusercontent.com/Olivia-Chiong
+  - name: "Alyssa Benipayo"
+    links:
+      linked-in: "https://www.linkedin.com/in/alyssabenipayo/"
+      github: "https://github.com/alyssabenipayo"
+    picture: https://avatars.githubusercontent.com/alyssabenipayo    
+  - name: "Bukola Ogunleye"
+    links:
+      linked-in: "https://www.linkedin.com/in/bukola-ogunleye-j/"
+      github: "https://github.com/SheIsBukki"
+    picture: https://avatars.githubusercontent.com/SheIsBukki   
+  - name: "Bonnie Wolfe" 
+    links:
+      linked-in: "https://www.linkedin.com/in/bonnieawolfe/"
+      github: "https://github.com/ExperimentsInHonesty"
+    picture: https://avatars.githubusercontent.com/ExperimentsInHonesty   
+---
+
+<style>
+
+  code {
+    color: #FA114F;
+  }
+
+  h1 {
+	font-size: 36px;
+  }
+
+  h2 {
+	font-size: 24px
+  }
+
+  h3 {
+	font-size: 20px;
+  }
+
+</style>
+
+
+# What <span style="font-weight: 400">is Slack?</span> ![alt_text](../assets/images/guides/how-to-set-reminders-in-slack/slack-icon.png "image_tooltip")
+
+Slack is a communication and collaboration platform that organizes conversations into topics, groups or private messages.  Each topic or group is called a Channel.  Hack for LA uses slack to allow teams to connect, discuss and work on projects collectively.  There are channels set up for both specific projects, and specific functional roles. 
+
+
+# When <span style="font-weight: 400">to use Reminders </span> ⏰
+
+Slack has a function that **allows you to set up an automatic reminder with a tailored message** sent out by the Bot at a specified time.  
+
+
+## Who Uses Reminders
+
+* Yourself 
+* Someone else 
+* The Whole Channel
+
+
+## Type of Reminders
+
+* Remind the team about upcoming team meetings
+* Remind people to update issues by a certain date
+* Remind yourself to check back in with someone at a certain time
+
+
+# How <span style="font-weight: 400">to Set Up Reminders</span> ✅
+
+Reminders can be set up in two ways: 
+
+
+## Option 1: by Navigation
+
+1. Navigate to the channel you want to set up the reminder.<br>
+  ![alt_text](../assets/images/guides/how-to-set-reminders-in-slack/image1.png#content "image_tooltip")
+
+2. Click the lightning bolt at the bottom of the message window.<br>
+  ![alt_text](../assets/images/guides/how-to-set-reminders-in-slack/image13.png#content "image_tooltip")
+
+3. Then either:
+
+   a. Filter for and select the reminder option in the Suggested list.
+    ![alt_text](../assets/images/guides/how-to-set-reminders-in-slack/image8.png#content "image_tooltip")
+    ![alt_text](../assets/images/guides/how-to-set-reminders-in-slack/image2.png#content "image_tooltip")
+
+   b. Type in “reminder”. Go ahead and set your reminder. Click on the “create” button.
+    ![alt_text](../assets/images/guides/how-to-set-reminders-in-slack/image14.png#content "image_tooltip")
+
+4. And you should see this confirmation. <br>
+  ![alt_text](../assets/images/guides/how-to-set-reminders-in-slack/image12.png#content "image_tooltip")  
+
+## Option 2: by Direct Entry
+
+1. In the message box, type /remind. <br>
+  ![alt_text](../assets/images/guides/how-to-set-reminders-in-slack/image10.png#content "image_tooltip")
+
+2. To Whom? @ or # <br>
+
+   `If to a specific person: @someone` <br>
+   `If the entire channel: #channel`
+
+3. In quotes write the reminder text you want the Bot to send out.
+
+4. Last, input day and time you want the Bot to send out the message. **NOTE: the time zone listed will be your time zone.**
+
+
+# Examples
+
+![alt_text](../assets/images/guides/how-to-set-reminders-in-slack/image6.png#examples "image_tooltip")
+![alt_text](../assets/images/guides/how-to-set-reminders-in-slack/image4.png#examples "image_tooltip")
+![alt_text](../assets/images/guides/how-to-set-reminders-in-slack/image7.png#examples "image_tooltip")
+![alt_text](../assets/images/guides/how-to-set-reminders-in-slack/image11.png#examples "image_tooltip")
+![alt_text](../assets/images/guides/how-to-set-reminders-in-slack/image3.png#examples "image_tooltip")
+
+
+
+<!-- # Guide Authors
+
+Peer-created guides are an important part of Hack for LA’s Culture.  They are created by our Volunteer Members based on effective processes developed on our projects.
+
+This guide was created and contributed to by: Maria Studnicka, Katie Jensen, Saasha Gilkes, Oliva Chiong, Alyssa Benipayo, Bukola Ogunleye and Bonnie Wolfe
+
+If you would like to contribute, please see the contribution methods available:
+
+If you are a member of the Hack for LA community you can post any comments directly in the iterative  version of this guide: [How to Set Reminders in Slack](https://www.google.com/)<span style="text-decoration:underline;">.</span>
+
+If you are outside the Hack for LA community, please use this [feedback form](https://www.google.com/) to provide suggestions for improvement or how the guide is useful for you. -->
+
diff --git a/_includes/toc.html b/_includes/toc.html
@@ -0,0 +1,182 @@
+{% capture tocWorkspace %}
+    {% comment %}
+        Copyright (c) 2017 Vladimir "allejo" Jimenez
+
+        Permission is hereby granted, free of charge, to any person
+        obtaining a copy of this software and associated documentation
+        files (the "Software"), to deal in the Software without
+        restriction, including without limitation the rights to use,
+        copy, modify, merge, publish, distribute, sublicense, and/or sell
+        copies of the Software, and to permit persons to whom the
+        Software is furnished to do so, subject to the following
+        conditions:
+
+        The above copyright notice and this permission notice shall be
+        included in all copies or substantial portions of the Software.
+
+        THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+        EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+        OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+        NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+        HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+        WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+        FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+        OTHER DEALINGS IN THE SOFTWARE.
+    {% endcomment %}
+    {% comment %}
+        Version 1.1.0
+          https://github.com/allejo/jekyll-toc
+
+        "...like all things liquid - where there's a will, and ~36 hours to spare, there's usually a/some way" ~jaybe
+
+        Usage:
+            {% include toc.html html=content sanitize=true class="inline_toc" id="my_toc" h_min=2 h_max=3 %}
+
+        Parameters:
+            * html         (string) - the HTML of compiled markdown generated by kramdown in Jekyll
+
+        Optional Parameters:
+            * sanitize      (bool)   : false  - when set to true, the headers will be stripped of any HTML in the TOC
+            * class         (string) :   ''   - a CSS class assigned to the TOC
+            * id            (string) :   ''   - an ID to assigned to the TOC
+            * h_min         (int)    :   1    - the minimum TOC header level to use; any header lower than this value will be ignored
+            * h_max         (int)    :   6    - the maximum TOC header level to use; any header greater than this value will be ignored
+            * ordered       (bool)   : false  - when set to true, an ordered list will be outputted instead of an unordered list
+            * item_class    (string) :   ''   - add custom class(es) for each list item; has support for '%level%' placeholder, which is the current heading level
+            * submenu_class (string) :   ''   - add custom class(es) for each child group of headings; has support for '%level%' placeholder which is the current "submenu" heading level
+            * base_url      (string) :   ''   - add a base url to the TOC links for when your TOC is on another page than the actual content
+            * anchor_class  (string) :   ''   - add custom class(es) for each anchor element
+            * skip_no_ids   (bool)   : false  - skip headers that do not have an `id` attribute
+
+        Output:
+            An ordered or unordered list representing the table of contents of a markdown block. This snippet will only
+            generate the table of contents and will NOT output the markdown given to it
+    {% endcomment %}
+
+    {% capture newline %}
+    {% endcapture %}
+    {% assign newline = newline | rstrip %} <!-- Remove the extra spacing but preserve the newline -->
+
+    {% capture deprecation_warnings %}{% endcapture %}
+
+    {% if include.baseurl %}
+        {% capture deprecation_warnings %}{{ deprecation_warnings }}<!-- jekyll-toc :: "baseurl" has been deprecated, use "base_url" instead -->{{ newline }}{% endcapture %}
+    {% endif %}
+
+    {% if include.skipNoIDs %}
+        {% capture deprecation_warnings %}{{ deprecation_warnings }}<!-- jekyll-toc :: "skipNoIDs" has been deprecated, use "skip_no_ids" instead -->{{ newline }}{% endcapture %}
+    {% endif %}
+
+    {% capture jekyll_toc %}{% endcapture %}
+    {% assign orderedList = include.ordered | default: false %}
+    {% assign baseURL = include.base_url | default: include.baseurl | default: '' %}
+    {% assign skipNoIDs = include.skip_no_ids | default: include.skipNoIDs | default: false %}
+    {% assign minHeader = include.h_min | default: 1 %}
+    {% assign maxHeader = include.h_max | default: 6 %}
+    {% assign nodes = include.html | strip | split: '<h' %}
+
+    {% assign firstHeader = true %}
+    {% assign currLevel = 0 %}
+    {% assign lastLevel = 0 %}
+
+    {% capture listModifier %}{% if orderedList %}ol{% else %}ul{% endif %}{% endcapture %}
+
+    {% for node in nodes %}
+        {% if node == "" %}
+            {% continue %}
+        {% endif %}
+
+        {% assign currLevel = node | replace: '"', '' | slice: 0, 1 | times: 1 %}
+
+        {% if currLevel < minHeader or currLevel > maxHeader %}
+            {% continue %}
+        {% endif %}
+
+        {% assign _workspace = node | split: '</h' %}
+
+        {% assign _idWorkspace = _workspace[0] | split: 'id="' %}
+        {% assign _idWorkspace = _idWorkspace[1] | split: '"' %}
+        {% assign htmlID = _idWorkspace[0] %}
+
+        {% assign _classWorkspace = _workspace[0] | split: 'class="' %}
+        {% assign _classWorkspace = _classWorkspace[1] | split: '"' %}
+        {% assign htmlClass = _classWorkspace[0] %}
+
+        {% if htmlClass contains "no_toc" %}
+            {% continue %}
+        {% endif %}
+
+        {% if firstHeader %}
+            {% assign minHeader = currLevel %}
+        {% endif %}
+
+        {% capture _hAttrToStrip %}{{ _workspace[0] | split: '>' | first }}>{% endcapture %}
+        {% assign header = _workspace[0] | replace: _hAttrToStrip, '' %}
+
+        {% if include.item_class and include.item_class != blank %}
+            {% capture listItemClass %} class="{{ include.item_class | replace: '%level%', currLevel | split: '.' | join: ' ' }}"{% endcapture %}
+        {% endif %}
+
+        {% if include.submenu_class and include.submenu_class != blank %}
+            {% assign subMenuLevel = currLevel | minus: 1 %}
+            {% capture subMenuClass %} class="{{ include.submenu_class | replace: '%level%', subMenuLevel | split: '.' | join: ' ' }}"{% endcapture %}
+        {% endif %}
+
+        {% capture anchorBody %}{% if include.sanitize %}{{ header | strip_html }}{% else %}{{ header }}{% endif %}{% endcapture %}
+
+        {% if htmlID %}
+            {% capture anchorAttributes %} href="{% if baseURL %}{{ baseURL }}{% endif %}#{{ htmlID }}"{% endcapture %}
+
+            {% if include.anchor_class %}
+                {% capture anchorAttributes %}{{ anchorAttributes }} class="{{ include.anchor_class | split: '.' | join: ' ' }}"{% endcapture %}
+            {% endif %}
+
+            {% capture listItem %}<a{{ anchorAttributes }}>{{ anchorBody }}</a>{% endcapture %}
+        {% elsif skipNoIDs == true %}
+            {% continue %}
+        {% else %}
+            {% capture listItem %}{{ anchorBody }}{% endcapture %}
+        {% endif %}
+
+        {% if currLevel > lastLevel %}
+            {% capture jekyll_toc %}{{ jekyll_toc }}<{{ listModifier }}{{ subMenuClass }}>{% endcapture %}
+        {% elsif currLevel < lastLevel %}
+            {% assign repeatCount = lastLevel | minus: currLevel %}
+
+            {% for i in (1..repeatCount) %}
+                {% capture jekyll_toc %}{{ jekyll_toc }}</li></{{ listModifier }}>{% endcapture %}
+            {% endfor %}
+
+            {% capture jekyll_toc %}{{ jekyll_toc }}</li>{% endcapture %}
+        {% else %}
+            {% capture jekyll_toc %}{{ jekyll_toc }}</li>{% endcapture %}
+        {% endif %}
+
+        {% capture jekyll_toc %}{{ jekyll_toc }}<li{{ listItemClass }}>{{ listItem }}{% endcapture %}
+
+        {% assign lastLevel = currLevel %}
+        {% assign firstHeader = false %}
+    {% endfor %}
+
+    {% assign repeatCount = minHeader | minus: 1 %}
+    {% assign repeatCount = lastLevel | minus: repeatCount %}
+    {% for i in (1..repeatCount) %}
+        {% capture jekyll_toc %}{{ jekyll_toc }}</li></{{ listModifier }}>{% endcapture %}
+    {% endfor %}
+
+    {% if jekyll_toc != '' %}
+        {% assign rootAttributes = '' %}
+        {% if include.class and include.class != blank %}
+            {% capture rootAttributes %} class="{{ include.class | split: '.' | join: ' ' }}"{% endcapture %}
+        {% endif %}
+
+        {% if include.id and include.id != blank %}
+            {% capture rootAttributes %}{{ rootAttributes }} id="{{ include.id }}"{% endcapture %}
+        {% endif %}
+
+        {% if rootAttributes %}
+            {% assign nodes = jekyll_toc | split: '>' %}
+            {% capture jekyll_toc %}<{{ listModifier }}{{ rootAttributes }}>{{ nodes | shift | join: '>' }}>{% endcapture %}
+        {% endif %}
+    {% endif %}
+{% endcapture %}{% assign tocWorkspace = '' %}{{ deprecation_warnings }}{{ jekyll_toc }}