To discuss: abstract font-size naming

[jackmakesthings]

Inspired partially by this and posts like it - https://richtabor.com/theme-json-font-sizes/ On recent projects, I've changed the keys on the font-size map from 1, 2, 3, etc... to x-small, small, medium, large, x-large, 2x-large, etc. I'm finding this makes them easier to work with mentally. I can get a more intuitive sense of the system & I don't have to look up the values as often.

[cssgirl]

In the updates from https://github.com/forumone/gesso-wp/pull/444 I did keep the numerical naming but open to changing that. I did initially gravitate towards the same type of naming scenario, but with so many values (15 total), I couldn't come up with enough unique names.

"fontSizes": [
        {
          "name": "1",
          "slug": "1",
          "size": "12px"
        },
        {
          "name": "2",
          "slug": "2",
          "size": "14px"
        },
        {
          "name": "3",
          "slug": "3",
          "size": "16px"
        },
        {
          "name": "4",
          "slug": "4",
          "size": "17px",
	      "fluid": {
		      "min": "17px",
		      "max": "18px"
	      }
        },
        {
          "name": "5",
          "slug": "5",
          "size": "195px",
	      "fluid": {
		      "min": "19px",
		      "max": "21px"
	      }
        },
        {
          "name": "6",
          "slug": "6",
          "size": "21px",
	      "fluid": {
		      "min": "21px",
		      "max": "23px"
	      }
        },
        {
          "name": "7",
          "slug": "7",
          "size": "23px",
	      "fluid": {
		      "min": "23px",
		      "max": "26px"
	      }
        },
        {
          "name": "8",
          "slug": "8",
          "size": "26px",
	      "fluid": {
		      "min": "26px",
		      "max": "30px"
	      }
        },
        {
          "name": "9",
          "slug": "9",
          "size": "28px",
	      "fluid": {
		      "min": "28px",
		      "max": "34px"
	      }
        },
        {
          "name": "10",
          "slug": "10",
          "size": "31px",
	      "fluid": {
		      "min": "31px",
		      "max": "39px"
	      }
        },
        {
          "name": "11",
          "slug": "11",
          "size": "34px",
	      "fluid": {
		      "min": "34px",
		      "max": "44px"
	      }
        },
        {
          "name": "12",
          "slug": "12",
          "size": "38px",
	        "fluid": {
		        "min": "38px",
		        "max": "50px"
	        }
        },
        {
          "name": "13",
          "slug": "13",
          "size": "41px",
	      "fluid": {
		      "min": "41px",
		      "max": "56px"
	      }
        },
        {
          "name": "14",
          "slug": "14",
          "size": "46px",
	      "fluid": {
		      "min": "46px",
		      "max": "64px"
	      }
        },
        {
          "name": "15",
          "slug": "15",
          "size": "50px",
	      "fluid": {
		      "min": "50px",
		      "max": "72px"
	      }
        }
      ]

[cssgirl]

We will keep numerical names for font-sizes.