witch-house / pronoun.is

Show people how to use pronouns!
http://pronoun.is
GNU Affero General Public License v3.0
929 stars 103 forks source link

Rainbow Declensions! #95

Open morganastra opened 5 years ago

morganastra commented 5 years ago

Each pronoun declension should be assigned a distinctive color, and those colors should be used consistently in the example blocks and anywhere else on the site.

We won't know what the colors are supposed to be until we do the UI redesign/cleanup, but I'll accept a PR that adds support for this and just sets all the colors to ones that look nice-enough with the current color scheme.

tacosontitan commented 2 years ago

Are CSS classes specific to an element tag okay to support this? Similar to:

i.pronouns.she-her { color: #ff1493; }

The implementation would simply be something like:

<p>We currently support color coded pronouns, for example: <i class="pronouns she-her">she/her</i></p>

This would result in an appearance like:

Screenshot of an example in CodePen.

It can be simplified by removing the pronouns class, but I recommend leaving that in for maintenance/upgrading purposes, just-in-case you'd like to do something similar to the following at a later date:

Screenshot of another example in CodePen.

tacosontitan commented 2 years ago

I'm trying to test an implementation sometime between this afternoon and tomorrow evening. I'll post updates here, but to summarize, currently the CSS class is driven by the pronoun table, and all pronouns currently have their color set to default to allow each pronoun's color to be determined over time:

.pronouns.she.her.her.hers.herself { color: default; }

I also included an empty class definition for the base pronouns:

.pronouns { /* TODO: Perhaps add badge like styling? */ }

With this, is the current spacing in the table important? I know it makes it look pretty when viewing, but from a functional aspect, does the spacing serve any purpose? For example:

she her her hers    herself

vs.

she her her hers herself

The latter example helps to simplify the implementation so that others can understand it more readily, but, I'm not opposed to leaving it the way it currently is, if that's a requirement.