Merge pull request AY2223S1-CS2103T-W16-2#251 from RichDom2185/week10…

…/fix-styling-bugs

Fix styling-related bugs in markdown files

docs/DeveloperGuide.md

@@ -223,8 +223,7 @@ Step 4. The user now decides that adding the item was a mistake, and decides to
 
 ![UndoRedoState3](images/UndoRedoState3.png)
 
-<div markdown="span" class="alert alert-info">:information_source: **Note:** If the `currentStatePointer` is at index 0, pointing to the initial FoodRem state, then there are no previous FoodRem states to restore. The `undo` command uses `Model#canUndoFoodRem()` to check if this is the case. If so, it will return an error to the user rather
-than attempting to perform the undo.
+<div markdown="span" class="alert alert-info">:information_source: **Note:** If the `currentStatePointer` is at index 0, pointing to the initial FoodRem state, then there are no previous FoodRem states to restore. The `undo` command uses `Model#canUndoFoodRem()` to check if this is the case. If so, it will return an error to the user rather than attempting to perform the undo.
 
 </div>
 
@@ -290,11 +289,9 @@ _{Explain here how the data archiving feature will be implemented}_
 
 ### Product scope
 
-**Target user profile**:
-Purchasing managers who are proficient with typing for small F&B businesses
+**Target user profile**: Purchasing managers who are proficient with typing for small F&B businesses
 
-**Value proposition**:
-This application will help small businesses to manage perishable goods within a single inventory
+**Value proposition**: This application will help small businesses to manage perishable goods within a single inventory
 (no support for multiple inventories).
 
 ### User stories
@@ -319,8 +316,7 @@ This application will help small businesses to manage perishable goods within a
 
 Given below are instructions to test the app manually.
 
-<div markdown="span" class="alert alert-info">:information_source: **Note:** These instructions only provide a starting point for testers to work on;
-testers are expected to do more *exploratory* testing.
+<div markdown="span" class="alert alert-info">:information_source: **Note:** These instructions only provide a starting point for testers to work on; testers are expected to do more *exploratory* testing.
 
 </div>
 

docs/UserGuide.md

@@ -5,18 +5,14 @@ show-toc: true
 ---
 ## About
 
-We want you to spend less time keeping track of perishable goods in your daily operations.
-FoodRem is a command line application that enables you to efficiently record, update and categorise food items.
-It is a convenient administrative tool that can answer the following questions in a flash:
+We want you to spend less time keeping track of perishable goods in your daily operations. FoodRem is a command line application that enables you to efficiently record, update and categorise food items. It is a convenient administrative tool that can answer the following questions in a flash:
 
 * What food items are about to expire?
 * How much of each condiment do I have?
 * Which food items are newly purchases?
 * ...and many more!
 
-With a few quick commands, you can have complete control of your perishable goods, so you can focus on what
-is important: serving your customers, improving menu recipes, and transforming your business into the next
-success story.
+With a few quick commands, you can have complete control of your perishable goods, so you can focus on what is important: serving your customers, improving menu recipes, and transforming your business into the next success story.
 
 ## Key Features
 
@@ -43,8 +39,7 @@ This app is targeted at small F&B businesses which may struggle in inventory man
 
 This guide is targeted at users using FoodRem who wants to find out more about the different commands to manage their inventory in a quicker and more efficient manner.
 
-Readers do not have to be familiar with the command line to use this guide effectively.
-The only expectation we have of you is to carefully read through the different sections.
+Readers do not have to be familiar with the command line to use this guide effectively. The only expectation we have of you is to carefully read through the different sections.
 
 {% include page-break.html %} <!-- Force a page break -->
 
@@ -54,8 +49,7 @@ The only expectation we have of you is to carefully read through the different s
 
 Thank you for choosing FoodRem! We are delighted to have you as a user and aim to serve you well!
 
-To gain the most out from this User Guide, start off with the [Quick Start](#quick-start) section.
-This will give you a brief overview about how to use this application.
+To gain the most out from this User Guide, start off with the [Quick Start](#quick-start) section. This will give you a brief overview about how to use this application.
 
 It is **highly recommended** that you read through the User Guide in a **sequential order** up until the section
 [Features](#features) where you can find all the information you need for each command.
@@ -74,17 +68,14 @@ It is **highly recommended** that you read through the User Guide in a **sequent
 * Important syntax you will come across while reading the user
   guide such as `n/`, `bgt/` or `INDEX`, `ITEM_NAME`.
 
-If you are confident, you can immediately refer to the [Command Summary](#command-summary)
-after completing the [Quick Start](#quick-start).
+If you are confident, you can immediately refer to the [Command Summary](#command-summary) after completing the [Quick Start](#quick-start).
 
 Meaning of icons:
 
 * ℹ️ : additional info
 * ❗ : warning
 
-If you are stuck, refer to [Troubleshooting](#troubleshooting) or [FAQ](#faq).
-There is also a [Glossary](#glossary) that contains definitions of what common words
-used in this application mean.
+If you are stuck, refer to [Troubleshooting](#troubleshooting) or [FAQ](#faq). There is also a [Glossary](#glossary) that contains definitions of what common words used in this application mean.
 
 It is time for you to unleash the potential of a command line application!
 
@@ -156,16 +147,37 @@ Something goes here...
 
 (NOT COMPLETED)
 
-1. Food expiring soon / Date food bought
-   **Glorified search and sort**
-   a. Upgrade sort and search b. Sort food items by quantity c. Sort food items by name d. Sort food items by expiry
-   date e. Sort food items by purchase date
-1. Food buffer a. Rainbow UI / Dashboard b. Optional : Minimum acceptable quantity c. Optional : Percentage of stock
-   expiring
-1. Purchasing (Hard -> Will not see benefit immediately)
-   a. History + Statistics b. Inventory need a price of items
-1. (Last priority) Order management a. Grouping of items b. Creation of menu with specific items c. Record menu items
-   bought d. Statistics
+1. **Food expiring soon / Date food bought**
+
+1. **Glorified search and sort**
+
+   1. Upgrade sort and search
+   1. Sort food items by quantity
+   1. Sort food items by name
+   1. Sort food items by expiry date
+   1. Sort food items by purchase date
+   {: .lower-alpha}
+
+1. **Food buffer**
+
+   1. Rainbow UI / Dashboard
+   1. Optional : Minimum acceptable quantity
+   1. Optional : Percentage of stock expiring
+   {: .lower-alpha}
+
+1. **Purchasing (Hard -> Will not see benefit immediately)**
+
+   1. History + Statistics
+   1. Inventory need a price of items
+   {: .lower-alpha}
+
+1. **(Last priority) Order management**
+
+   1. Grouping of items
+   1. Creation of menu with specific items
+   1. Record menu items bought
+   1. Statistics
+   {: .lower-alpha}
 
 ## Acknowledgements
 

docs/_dg/Implementation.md

@@ -54,16 +54,19 @@ There is a `SortedList` obtained from an immutable item list. When the `SortComm
 Notably, the `SortedList` wraps around a `FilteredList`, which wraps around an immutable `ObservableList`.
 
 #### Receiving help for a command
+
 The `help` feature provides a user with instructions of how to use certain commands.
 
 #### How the `help` command works
+
 1. The user specifies a specific command that they need help with. This is done using the word needed to execute a particular command in FoodRem.
 1. If this is not provided, a general help message will be shown.
 1. The provided command is cross-referenced with all available commands in FoodRem. If the command that the user needs help with does not exist, an error would be thrown. This informs the user that the command does not exist. A general help is also shown to the user.
 1. The help is shown in a new window that will open upon successful execution of the command.
 
 #### Why it is implemented this way
-When the `HelpCommand` is executed we want users to receive help immediately instead of searching for it the user guide.
+
+When the `HelpCommand` is executed we want users to receive help immediately instead of searching for it the User Guide.
 
 ![HelpSequenceDiagram](images/HelpSequenceDiagram.png)
 

docs/_dg/TaggingFunctionality.md

@@ -3,8 +3,7 @@
 
 #### Implementation
 
-The tagging functionality is facilitated by the `UniqueTagList` stored in `FoodRem`.
-Additionally, each `Item` stores its own sets of associated `Tag` objects in an internal `Set<Tag>`.
+The tagging functionality is facilitated by the `UniqueTagList` stored in `FoodRem`. Additionally, each `Item` stores its own sets of associated `Tag` objects in an internal `Set<Tag>`.
 
 Creating, updating and deleting tags will modify the tags within the `UniqueTagList` which contains all existing `Tag` objects.
 
@@ -17,30 +16,35 @@ Given below is an UML diagram of `Tag` and the classes related to it:
 
 **Aspect: Storage of `Tag`**
 
-* **Alternative 1 (current choice):**
-Store `Tag` in a separate `UniqueTagList` and each `Item` stores its own set of associated `Tag`
+* **Alternative 1 (current choice):** Store `Tag` in a separate `UniqueTagList` and each `Item` stores its own set of associated `Tag`
 
   * Pros:
     * Easy to implement
     * Allows users to create and rename `Tag` to suit their own use case instead of just providing a preset list of `Tag` that cannot be modified or extended
+
   * Cons:
     * Unable to define association/relationship between different `Tag`
     * Additional storage used as compared to below alternatives
 
 * **Alternative 2:** Design a tree-like structure similar to a full type system where users can extend from to create new `Tag`
+
   * Pros:
     * Able to define association/relationship between different `Tag` (e.g `Apple` can be nested under `Fruits` so tagging an `Item` with `Apple` marks it as a `Fruits` as well)
     * Saves space
       * Only a single tree is needed, no need to store associated `Tag` within `Item`, the classification of `Item` and `Tag` is represented by the relationship represented by this tree
     * Easily extensible (defining a new `Tag` or `Item` can be as simple as creating a new node in the tree)
+
   * Cons:
     * Example of over engineering, unnecessarily complicates things as compared to alternative 1
     * Unlikely to have deeply nested relationships for `Tag`, adding each `Tag` to an `Item` is much simpler
     * Unlikely to need so many `Tag`, in which case alternative one would result in faster operations by using hash tables instead of a tree
+
 * **Alternative 3:** Use classes and inheritance to represent different classification to achieve similar tagging effect
+
   * Pros:
     * Less storage used as compared to storing associated `Tag` within `Set` in each `Item` as well as all `Tag` in `UniqueTagList`
     * Possibly more convenient when creating `Item` since users do not have to manually add associated `Tag` after creating the `Item`
+
   * Cons:
     * Users are unable to extend and edit classes similar to how they can edit `Tag`
     * Not scalable and poor developer experience in creating and maintaining a separate class for every new classification/tag users want to have

docs/_sass/foodrem.scss

@@ -207,6 +207,16 @@ html {
   }
 }
 
-article.post a {
-  color: #00769a;
+article.post {
+  a {
+    color: #00769a;
+  }
+
+  li p {
+    margin-bottom: 0;
+  }
+
+  .lower-alpha {
+    list-style-type: lower-alpha;
+  }
 }

docs/_sass/minima/_base.scss

@@ -280,7 +280,8 @@ table {
   /**
   * Prevents page break from cutting through content when printing
   */
-  body {
+  body,
+  main.page-content {
     display: block;
   }
   /**