Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Fluid Styleguide – Living Styleguide für TYPO3

Avatar for Simon Praetorius Simon Praetorius
September 12, 2019
Technology
0
180

Fluid Styleguide – Living Styleguide für TYPO3

TODO

https://fluidcomponents.sitegeist.de/

#dmexco #typo3

Avatar for Simon Praetorius

Simon Praetorius

September 12, 2019
Tweet

More Decks by Simon Praetorius

See All by Simon Praetorius
The State of Fluid (2025)
Avatar for Simon Praetorius s2b
0
260
Vite – TYPO3's nimble frontend companion
Avatar for Simon Praetorius s2b
0
460
Pragmatic Responsive Images
Avatar for Simon Praetorius s2b
0
270
Expedition into the Frontend Jungle
Avatar for Simon Praetorius s2b
0
800
Vite & TYPO3
Avatar for Simon Praetorius s2b
0
1.4k
The [r]evolution of Fluid Components
Avatar for Simon Praetorius s2b
0
690
Daily Business with a Living Styleguide
Avatar for Simon Praetorius s2b
0
320
TranslateLabels – Einfache Übersetzungen in TYPO3
Avatar for Simon Praetorius s2b
0
110
Fluid Components in Production
Avatar for Simon Praetorius s2b
0
880

Other Decks in Technology

See All in Technology
Claude Codeを駆使した初めてのiOSアプリ開発 ~ゼロから3週間でグローバルハッカソンで入賞するまで~
Avatar for Oikon oikon48
10
4.3k
AI Agent Dojo #2 watsonx Orchestrateフローの作成
Avatar for Akira Onishi (IBM) oniak3ibm
PRO
0
120
能登半島地震において デジタルができたこと・できなかったこと
Avatar for Masakatsu Sugii ditccsugii
0
220
難しいセキュリティ用語をわかりやすくしてみた
Avatar for Yuta3110 yuta3110
0
140
「れきちず」のこれまでとこれから - 誰にでもわかりやすい歴史地図を目指して / FOSS4G 2025 Japan
Avatar for Hajime Kato hjmkth
1
310
プロポーザルのコツ ~ Kaigi on Rails 2025 初参加で3名の登壇を実現 ~
Avatar for naro143 naro143
1
250
OCI Network Firewall 概要
Avatar for oracle4engineer oracle4engineer
PRO
2
7.9k
AgentCon Accra: Ctrl + Alt + Assist: AI Agents Edition
Avatar for Bethany Jepchumba bethany
0
110
2025-10-09_プロジェクトマネージャーAIチャンス
Avatar for taukami taukami
0
150
プレーリーカードを活用しよう❗❗デジタル名刺交換からはじまるイベント会場交流のススメ
Avatar for Masataka Tsukamoto tsukaman
0
170
ビズリーチ求職者検索におけるPLMとLLMの活用 / Search Engineering MEET UP_2-1
Avatar for Visional Engineering ＆ Design visional_engineering_and_design
1
130
Digitization部 紹介資料
Avatar for Sansan, Inc. sansan33
PRO
1
5.5k

Featured

See All Featured
The Power of CSS Pseudo Elements
Avatar for Geoffrey Crofte geoffreycrofte
79
6k
Side Projects
Avatar for Sacha Greif sachag
455
43k
Building an army of robots
Avatar for Kyle Neath kneath
306
46k
Building Better People: How to give real-time feedback that sticks.
Avatar for Will Jessup wjessup
369
20k
Agile that works and the tools we love
Avatar for Rasmus Luckow-Nielsen rasmusluckow
331
21k
Mobile First: as difficult as doing things right
Avatar for Swwweet swwweet
224
10k
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
73
11k
Designing Dashboards & Data Visualisations in Web Apps
Avatar for Des Traynor destraynor
231
53k
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
79
6.6k
A designer walks into a library…
Avatar for Paul Jervis Heath pauljervisheath
209
24k
Rails Girls Zürich Keynote
Avatar for Gregor Martynus gr2m
95
14k
How to Think Like a Performance Engineer
Avatar for Harry Roberts csswizardry
27
2k

Transcript

  1. Real Values. Simon Praetorius
 Fluid Styleguide Living Styleguide für TYPO3

  2. Real Values. Simon Praetorius: Fluid Styleguide TYPO3 + Fluid Fluid

    Components Fluid Styleguide

  3. Real Values. Simon Praetorius: Fluid Styleguide TYPO3 + Fluid Fluid

    Components Fluid Styleguide

  4. Real Values. Simon Praetorius: Fluid Styleguide – Komponenten Was sind

    Komponenten?

  5. Real Values. Beispiel: Teaser ICON TITLE DESCRIPTION LINK THEME Simon

    Praetorius: Fluid Styleguide – Komponenten

  6. Real Values. ♻ # $ ♿ presentational logicless encapsulated clear

    API enforce guidelines reusable ⌨ code Simon Praetorius: Fluid Styleguide – Komponenten

  7. Real Values. Component-Driven Development Integration Komponente Look&Feel API Website-Layout Daten-Aufbereitung

    $ FRONTEND ) INTEGRATOR Simon Praetorius: Fluid Styleguide – Komponenten

  8. Real Values. TYPO3 + Fluid Fluid Components Fluid Styleguide Simon

    Praetorius: Fluid Styleguide

  9. Real Values. Simon Praetorius: Fluid Styleguide – Living Styleguide Was

    ist ein Living Styleguide?

  10. Real Values. Was ist ein Dead Styleguide? Styleguide_Final2.pdf Simon Praetorius:

    Fluid Styleguide – Living Styleguide

  11. Real Values. Simon Praetorius: Fluid Styleguide – Living Styleguide Was

    ist ein Living Styleguide?

  12. Real Values. ♻ # $ ♿ presentational logicless encapsulated clear

    API enforce guidelines reusable ⌨ code Simon Praetorius: Fluid Styleguide – Living Styleguide

  13. Real Values. Simon Praetorius: Fluid Styleguide – Zielgruppen Wer ist

    die Zielgruppe?

  14. Real Values. Fluid Styleguide $ DESIGNER # DEVELOPER * PROJECT

    MANAGER + CLIENT Simon Praetorius: Fluid Styleguide – Zielgruppen

  15. Real Values. Simon Praetorius: Fluid Styleguide Sponsor & Erstnutzer

  16. Real Values. Demo fluidcomponents.sitegeist.de Simon Praetorius: Fluid Styleguide

  17. Real Values. Links mehr Informationen fluidcomponents.sitegeist.de sitegeist @sitegeist_de / techblog.sitegeist.de

    / sitegeist.de Simon Praetorius @s2bproject / @somethingphp / [email protected] Simon Praetorius: Fluid Styleguide

  18. Real Values. Danke für die Aufmerksamkeit!