Open mhulse opened 9 years ago
Once I get this 5ths grid figured out, add 24ths:
// 24ths-based units: [wg-col ~= "1/24"] { flex-basis: 1/24 * 100%; max-width: 1/24 * 100%; } [wg-col ~= "1/12"], [wg-col ~= "2/24"] { flex-basis: 1/12 * 100%; max-width: 1/12 * 100%; } [wg-col ~= "1/8"], [wg-col ~= "3/24"] { flex-basis: 1/8 * 100%; max-width: 1/8 * 100%; } [wg-col ~= "1/6"], [wg-col ~= "4/24"] { flex-basis: 1/6 * 100%; max-width: 1/6 * 100%; } [wg-col ~= "5/24"] { flex-basis: 5/24 * 100%; max-width: 5/24 * 100%; } [wg-col ~= "1/4"], [wg-col ~= "6/24"] { flex-basis: 1/4 * 100%; max-width: 1/4 * 100%; } [wg-col ~= "7/24"] { flex-basis: 7/24 * 100%; max-width: 7/24 * 100%; } [wg-col ~= "1/3"], [wg-col ~= "8/24"] { flex-basis: 1/3 * 100%; max-width: 1/3 * 100%; } [wg-col ~= "3/8"], [wg-col ~= "9/24"] { flex-basis: 3/8 * 100%; max-width: 3/8 * 100%; } [wg-col ~= "5/12"], [wg-col ~= "10/24"] { flex-basis: 5/12 * 100%; max-width: 5/12 * 100%; } [wg-col ~= "11/24"] { flex-basis: 11/24 * 100%; max-width: 11/24 * 100%; } [wg-col ~= "1/2"], [wg-col ~= "12/24"] { flex-basis: 1/2 * 100%; max-width: 1/2 * 100%; } [wg-col ~= "13/24"] { flex-basis: 13/24 * 100%; max-width: 13/24 * 100%; } [wg-col ~= "7/12"], [wg-col ~= "14/24"] { flex-basis: 7/12 * 100%; max-width: 7/12 * 100%; } [wg-col ~= "5/8"] { flex-basis: 5/8 * 100%; max-width: 5/8 * 100%; } [wg-col ~= "5/8"], [wg-col ~= "15/24"] { flex-basis: 5/8 * 100%; max-width: 5/8 * 100%; } [wg-col ~= "2/3"], [wg-col ~= "16/24"] { flex-basis: 2/3 * 100%; max-width: 2/3 * 100%; } [wg-col ~= "17/24"] { flex-basis: 17/24 * 100%; max-width: 17/24 * 100%; } [wg-col ~= "3/4"], [wg-col ~= "18/24"] { flex-basis: 3/4 * 100%; max-width: 3/4 * 100%; } [wg-col ~= "19/24"] { flex-basis: 19/24 * 100%; max-width: 19/24 * 100%; } [wg-col ~= "5/6"], [wg-col ~= "20/24"] { flex-basis: 5/6 * 100%; max-width: 5/6 * 100%; } [wg-col ~= "7/8"], [wg-col ~= "21/24"] { flex-basis: 7/8 * 100%; max-width: 7/8 * 100%; } [wg-col ~= "11/12"], [wg-col ~= "22/24"] { flex-basis: 11/12 * 100%; max-width: 11/12 * 100%; } [wg-col ~= "23/24"] { flex-basis: 23/24 * 100%; max-width: 23/24 * 100%; }
Once I get this 5ths grid figured out, add 24ths: