Display Modules Position Badge Background Color based on the Active Template Positions

[YatharthVyas]

Pull Request for Issue #2

Summary of Changes

Added a new model getValidPositions that performs the following:

1. Fetch the active template from the database (1 Query)
2. Get the templateDetails.xml file corresponding to the template received as a result of Step 1
3. Store these positions in an array and return it

The array returned from the above model method will be used in the _getList function as:

1. Stored the result of the getValidPositions method in an array
2. After fetching all modules from the database for rendering, perform a check whether each module row's position exists in the array of step 1
   If yes, set $row->activePosition to true
   If no, set $row->activePosition to false

Finally, in the tmpl file, we use this activePosition flag to conditionally select between bg-primary and bg-secondary

Extra:
Added a few missing template positions to the XML file:
For example, Atum's cpanel-system:

---

Testing Instructions

Visit the database and change the value of one of the module's positions to a random string.

Note: Positions for multi-lingual website could be an edge case but I am unable to set up a multi-lingual site on my local workstation so I'm unable to confirm this

---

Actual result BEFORE applying this Pull Request

All badges have the same bg-primary class

---

Expected result AFTER applying this Pull Request

Badges for In-active (not of the active template) Positions have a bg-secondary class

---

Documentation Changes Required

I don't know

[YatharthVyas]

PR is ready for review.
Now it checks the position value with positions from all in-use templates.

[YatharthVyas]

You could add now an information (toolTip) which says something like "valid position" or "non-valid position", then it is mor accessible for allusers who are colour blind or don't know what the colour means.

The newest commit adds the tooltip for more accessibility. Thanks for the suggestion @chmst

[YatharthVyas]

https://docs.google.com/document/d/1Pl8JGa2hkYkmJzQOn9_mS8a4imDmqc2a/edit?disco=AAAAM787hHY

Now as we have different colours for valid and user-defined positions, we could add this here too

Positions are coloured as red if they are invalid:

[brianteeman]

Positions are coloured as red if they are invalid:

https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-without-color.html

[YatharthVyas]

https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-without-color.html

If I understood this correctly, the article advocates the need of a supplementary text indication along with the color based indication of a message (invalid position in this case).
I have also a tooltip that is displayed when the position badge is hovered over.

I hope this suffices the success criterion