68 lines
3.1 KiB
YAML
68 lines
3.1 KiB
YAML
uuid:
|
|
- value: baa99cce-a9bf-442d-8c24-ea0eb92fbb25
|
|
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:04+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: 'Building different-looking UIs with consistent class names'
|
|
created:
|
|
- value: '2024-11-22T00:00:00+00:00'
|
|
changed:
|
|
- value: '2025-05-11T09:00:04+00:00'
|
|
promote:
|
|
- value: false
|
|
sticky:
|
|
- value: false
|
|
default_langcode:
|
|
- value: true
|
|
revision_translation_affected:
|
|
- value: true
|
|
path:
|
|
- alias: /daily/2024/11/22/building-different-looking-uis-with-consistent-class-names
|
|
langcode: en
|
|
body:
|
|
- value: |
|
|
<p>Something I've said when <a href="/presentations/taking-flight-with-tailwind-css.md">speaking about Tailwind CSS</a> and also during <a href="/daily/2024/11/19/tailwind-css-v4-is-so-easy-to-set-up">my recent consulting engagement</a>, is that you can build dramatically different-looking UIs even though you're using the same class names.</p>
|
|
|
|
<p>For example, I've rebuilt <a href="https://rebuilding-bartik.oliverdavies.uk">the Bartik theme</a>, <a href="https://rebuilding-acquia.oliverdavies.uk">the Acquia hosting dashboard</a> and <a href="https://rebuilding-bristol-js.oliverdavies.uk">various other UIs</a> for talk demos - none of which look the same or are even similar.</p>
|
|
|
|
<p>This website is themed with Tailwind CSS.</p>
|
|
|
|
<p>As the classes are very low-level, there is no "Tailwind-looking website" like there is with other CSS frameworks.</p>
|
|
|
|
<p>And, when you move to other application, the same classes are there and available to use.</p>
|
|
|
|
<p>You just need to customise them, use what you need and ignore what you don't.</p>
|
|
|
|
|
|
format: full_html
|
|
processed: |
|
|
<p>Something I've said when <a href="http://default/presentations/taking-flight-with-tailwind-css.md">speaking about Tailwind CSS</a> and also during <a href="http://default/daily/2024/11/19/tailwind-css-v4-is-so-easy-to-set-up">my recent consulting engagement</a>, is that you can build dramatically different-looking UIs even though you're using the same class names.</p>
|
|
|
|
<p>For example, I've rebuilt <a href="https://rebuilding-bartik.oliverdavies.uk">the Bartik theme</a>, <a href="https://rebuilding-acquia.oliverdavies.uk">the Acquia hosting dashboard</a> and <a href="https://rebuilding-bristol-js.oliverdavies.uk">various other UIs</a> for talk demos - none of which look the same or are even similar.</p>
|
|
|
|
<p>This website is themed with Tailwind CSS.</p>
|
|
|
|
<p>As the classes are very low-level, there is no "Tailwind-looking website" like there is with other CSS frameworks.</p>
|
|
|
|
<p>And, when you move to other application, the same classes are there and available to use.</p>
|
|
|
|
<p>You just need to customise them, use what you need and ignore what you don't.</p>
|
|
|
|
|
|
summary: null
|
|
field_daily_email_cta: { }
|