oliverdavies.uk/content/node.fdf6ccbc-7e57-4767-8c8d-7db48b2874cc.json

{
    "uuid": [
        {
            "value": "fdf6ccbc-7e57-4767-8c8d-7db48b2874cc"
        }
    ],
    "langcode": [
        {
            "value": "en"
        }
    ],
    "type": [
        {
            "target_id": "daily_email",
            "target_type": "node_type",
            "target_uuid": "8bde1f2f-eef9-4f2d-ae9c-96921f8193d7"
        }
    ],
    "revision_timestamp": [
        {
            "value": "2025-05-11T09:00:48+00:00"
        }
    ],
    "revision_uid": [
        {
            "target_type": "user",
            "target_uuid": "b8966985-d4b2-42a7-a319-2e94ccfbb849"
        }
    ],
    "revision_log": [],
    "status": [
        {
            "value": true
        }
    ],
    "uid": [
        {
            "target_type": "user",
            "target_uuid": "b8966985-d4b2-42a7-a319-2e94ccfbb849"
        }
    ],
    "title": [
        {
            "value": "Tailwind: Not just translating CSS to utility classes\n"
        }
    ],
    "created": [
        {
            "value": "2023-01-21T00:00:00+00:00"
        }
    ],
    "changed": [
        {
            "value": "2025-05-11T09:00:48+00:00"
        }
    ],
    "promote": [
        {
            "value": false
        }
    ],
    "sticky": [
        {
            "value": false
        }
    ],
    "default_langcode": [
        {
            "value": true
        }
    ],
    "revision_translation_affected": [
        {
            "value": true
        }
    ],
    "path": [
        {
            "alias": "\/daily\/2023\/01\/21\/tailwind-not-just-translating-css-to-utility-classes",
            "langcode": "en"
        }
    ],
    "body": [
        {
            "value": "\n          <p>Whilst a number of classes that Tailwind CSS generates are single-value utility classes such as <code>.block { display: block; }<\/code> and <code>.relative { position: relative; }<\/code>, it also includes additional things such as <a href=\"https:\/\/tailwindcss.com\/docs\/font-size#setting-the-font-size\">setting a default line height with a font size<\/a>, adding variants for <a href=\"https:\/\/tailwindcss.com\/docs\/hover-focus-and-other-states#styling-based-on-parent-state\">group-hover<\/a> and <a href=\"https:\/\/tailwindcss.com\/docs\/hover-focus-and-other-states#focus-within\">focus-within<\/a> (as well as various other pseudo states).<\/p>\n\n<p>It includes utilities for adding <a href=\"https:\/\/tailwindcss.com\/docs\/space#add-horizontal-space-between-children\">horizontal or vertical space<\/a> or <a href=\"https:\/\/tailwindcss.com\/docs\/divide-style\">styling dividers between elements<\/a>.<\/p>\n\n<p>As well prefixing a class using a screen modifier, such as <code>md:flex<\/code>, you can stack them and set a maximum screen value. For example, <code>md:max-lg:flex<\/code> will only flex between the <code>md<\/code> and <code>lg<\/code> breakpoints.<\/p>\n\n<p>If has official plugins for typography styles, forms, line-clamp (truncating text) and aspect ratios, as well as numerous community plugins and supports arbitrary values if you need them.<\/p>\n\n<p>If you take a look at the <a href=\"https:\/\/tailwindcss.com\/docs\">Tailwind CSS documentation<\/a>, you'll definitely find some interesting and useful things.<\/p>\n\n        ",
            "format": "full_html",
            "processed": "\n          <p>Whilst a number of classes that Tailwind CSS generates are single-value utility classes such as <code>.block { display: block; }<\/code> and <code>.relative { position: relative; }<\/code>, it also includes additional things such as <a href=\"https:\/\/tailwindcss.com\/docs\/font-size#setting-the-font-size\">setting a default line height with a font size<\/a>, adding variants for <a href=\"https:\/\/tailwindcss.com\/docs\/hover-focus-and-other-states#styling-based-on-parent-state\">group-hover<\/a> and <a href=\"https:\/\/tailwindcss.com\/docs\/hover-focus-and-other-states#focus-within\">focus-within<\/a> (as well as various other pseudo states).<\/p>\n\n<p>It includes utilities for adding <a href=\"https:\/\/tailwindcss.com\/docs\/space#add-horizontal-space-between-children\">horizontal or vertical space<\/a> or <a href=\"https:\/\/tailwindcss.com\/docs\/divide-style\">styling dividers between elements<\/a>.<\/p>\n\n<p>As well prefixing a class using a screen modifier, such as <code>md:flex<\/code>, you can stack them and set a maximum screen value. For example, <code>md:max-lg:flex<\/code> will only flex between the <code>md<\/code> and <code>lg<\/code> breakpoints.<\/p>\n\n<p>If has official plugins for typography styles, forms, line-clamp (truncating text) and aspect ratios, as well as numerous community plugins and supports arbitrary values if you need them.<\/p>\n\n<p>If you take a look at the <a href=\"https:\/\/tailwindcss.com\/docs\">Tailwind CSS documentation<\/a>, you'll definitely find some interesting and useful things.<\/p>\n\n        ",
            "summary": null
        }
    ],
    "feeds_item": [
        {
            "imported": "1970-01-01T00:33:45+00:00",
            "guid": null,
            "hash": "e964b8ae6d3a589e9ec7419ffe0d83bf",
            "target_type": "feeds_feed",
            "target_uuid": "90c85284-7ca8-4074-9178-97ff8384fe76"
        }
    ]
}