Migrate content to YAML
This commit is contained in:
parent
3d76aa0c3b
commit
9d5a930eab
4550 changed files with 93849 additions and 129734 deletions
69
content/node.4b7e6128-69d3-4511-a3ca-cfba25c6e002.yml
Normal file
69
content/node.4b7e6128-69d3-4511-a3ca-cfba25c6e002.yml
Normal file
|
@ -0,0 +1,69 @@
|
|||
uuid:
|
||||
- value: 4b7e6128-69d3-4511-a3ca-cfba25c6e002
|
||||
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: |
|
||||
Adding Tailwind CSS to an existing project
|
||||
created:
|
||||
- value: '2023-01-05T00: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/05/adding-tailwind-to-an-existing-project
|
||||
langcode: en
|
||||
body:
|
||||
- value: |
|
||||
<p>Tailwind's configuration file also makes it easy to add it to an existing codebase, whether it uses custom CSS or another CSS framework.</p>
|
||||
|
||||
<p>You can opt-out of Tailwind's CSS reset and normalisation by adding <code>corePlugins: { preflight: false }</code> to tailwind.config.js, and if you have duplicate classes with existing classes and Tailwind-generated ones, you can add <code>prefix: 'tw-'</code> to prefix all of Tailwind's class names and avoid the conflicts.</p>
|
||||
|
||||
<p>If you need to deal with specificity, you can mark Tailwind-generated classes as important by adding <code>important: true</code> so that they can override any existing styling. You can do the same in HTML code by prefixing a class name with an exclamation mark - e.g. <code>!flex</code>.</p>
|
||||
|
||||
<p>Or, if you know that your Tailwind styles will only be used within a certain element, like <code>#app</code>, instead of making all classes important, by adding <code>important: "#app"</code> to the configuration, Tailwind classes will be prefixed with that selector - making them more specific.</p>
|
||||
|
||||
<p>Once these options are set, you can start using Tailwind without affecting the existing styles.</p>
|
||||
|
||||
<p>Doing this, and starting small by using a small number of utilities can be a good step towards migrating an existing codebase to use Tailwind and removing the existing styles at a later date.</p>
|
||||
|
||||
|
||||
format: full_html
|
||||
processed: |
|
||||
<p>Tailwind's configuration file also makes it easy to add it to an existing codebase, whether it uses custom CSS or another CSS framework.</p>
|
||||
|
||||
<p>You can opt-out of Tailwind's CSS reset and normalisation by adding <code>corePlugins: { preflight: false }</code> to tailwind.config.js, and if you have duplicate classes with existing classes and Tailwind-generated ones, you can add <code>prefix: 'tw-'</code> to prefix all of Tailwind's class names and avoid the conflicts.</p>
|
||||
|
||||
<p>If you need to deal with specificity, you can mark Tailwind-generated classes as important by adding <code>important: true</code> so that they can override any existing styling. You can do the same in HTML code by prefixing a class name with an exclamation mark - e.g. <code>!flex</code>.</p>
|
||||
|
||||
<p>Or, if you know that your Tailwind styles will only be used within a certain element, like <code>#app</code>, instead of making all classes important, by adding <code>important: "#app"</code> to the configuration, Tailwind classes will be prefixed with that selector - making them more specific.</p>
|
||||
|
||||
<p>Once these options are set, you can start using Tailwind without affecting the existing styles.</p>
|
||||
|
||||
<p>Doing this, and starting small by using a small number of utilities can be a good step towards migrating an existing codebase to use Tailwind and removing the existing styles at a later date.</p>
|
||||
|
||||
|
||||
summary: null
|
||||
field_daily_email_cta: { }
|
Loading…
Add table
Add a link
Reference in a new issue