Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

Stick Bootstrap into Polymer

Avatar for takanorip takanorip
April 23, 2018
Technology
84
0

Stick Bootstrap into Polymer

Avatar for takanorip

takanorip

April 23, 2018

More Decks by takanorip

See All by takanorip
AI-Slopなデザインを生まないためのデザインプロセス戦略
Avatar for takanorip takanorip
10
5.9k
「見せる」登壇資料デザインの極意
Avatar for takanorip takanorip
7
1.6k
Design System Documentation Tooling 2025
Avatar for takanorip takanorip
3
3k
デザインエンジニアの延長にデザインマネージャーとしての可能性を探る
Avatar for takanorip takanorip
1
1.3k
Tools for Design Engineers other than LLM in the LLM era
Avatar for takanorip takanorip
1
880
Bulletproof Design System with TypeScript
Avatar for takanorip takanorip
7
5.4k
Eleventy3.0 で始める爆速個人ブログ開発！
Avatar for takanorip takanorip
0
320
Webフォント選定の極意！フォントの基本から最新トレンドまで徹底解説
Avatar for takanorip takanorip
6
1.2k
効果的な管理画面を デザインをするために 避けるべき5つの罠
Avatar for takanorip takanorip
15
8k

Other Decks in Technology

See All in Technology
Snowflakeで実現する全社横断の顧客の声（VOC）分析・活用基盤@Snowflake World Tour Tokyo 2026
Avatar for yuto16 yuto16
0
200
From Vanilla Kubernetes to a Batteries-Included Platform: Developer Experience at 1,300+ Clusters
Avatar for yosshi_ yosshi_
0
700
AI時代の「技術的負債」の変質ー概念の終焉と再解釈、エージェントと共に向かう先
Avatar for nwiizo nwiizo
0
990
目の前の楽しいが人生を変える - コミュニティの螺旋の歩き方と楽しむコツ / change your life
Avatar for soudai sone soudai
PRO
4
540
GoCon2026 - Open Source, Open World
Avatar for sanposhiho sanposhiho
4
3.5k
AI 時代のスタートアップエコシステ厶から考究する技術的負債との向き合い方
Avatar for memory m3m0r7
PRO
0
400
Minecraft JavaのMODをSwiftで作る
Avatar for 1mash0 1mash0
0
130
OpenTelemetry eBPF Instrumentationの舞台裏 / Behind the Scenes of OpenTelemetry eBPF Instrumentation
Avatar for ymotongpoo ymotongpoo
4
1.2k
OpenTelemetryのメトリクスをCloudWatchに送ってPromQLで見てみた
Avatar for Itaru Ota ota1022
0
140
AIエージェントの自己改善をどう設計するか / How to Design Self-Improvement for AI Agents
Avatar for 223 22mi
20
11k
20260906 「AWS運用入門」著者が教える、運用業務への生成AI活用入門
Avatar for Masaru Ogura masaruogura
0
260
作品が生態系になった ─ Mini Tokyo 3D から世界へ
Avatar for 草薙昭彦 nagix
0
180

Featured

See All Featured
Faster Mobile Websites
Avatar for Dean Hume deanohume
310
32k
Odyssey Design
Avatar for Ryan Kendrick rkendrick25
PRO
2
800
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
Avatar for panda_program panda_program
123
22k
The untapped power of vector embeddings
Avatar for Frank van Dijk frankvandijk
2
1.9k
Organizational Design Perspectives: An Ontology of Organizational Design Elements
Avatar for Dr. Kim W Petersen kimpetersen
PRO
1
820
What's in a price? How to price your products and services
Avatar for Michael Herold michaelherold
247
13k
Applied NLP in the Age of Generative AI
Avatar for Ines Montani inesmontani
PRO
4
2.4k
Collaborative Software Design: How to facilitate domain modelling decisions
Avatar for Kenny Baas-Schwegler baasie
1
320
Skip the Path - Find Your Career Trail
Avatar for Mark Kilby mkilby
1
230
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
52
3.8k
Designing Powerful Visuals for Engaging Learning
Avatar for Mike Taylor tmiket
1
540
4 Signs Your Business is Dying
Avatar for Josh Pigford shpigford
187
23k

Transcript

  1. Stick Bootstrap into Polymer Takanori Oki
 @Web Components Cafe 2018/04/23

  2. Self-Introduction • Takanori Oki ( @takanorip ) • SmartDrive Inc.

    • Frontend Developer • Nuxt.jsɺReactɺPolymer… • Love fonts
  3. None

  4. I want to use CSS Frameworks for example Bootstrap

  5. granite-bootstrap • Wrapping of Bootstrap CSS as Polymer shared styles

    modules • Replace and Update polymer-bootstrap
  6. None
  7. None
  8. None
  9. None

  10. If you write this way, the layout collapses…

  11. Solution?

  12. None
  13. None

  14. DEMO

  15. It is difficult to thinking about CSS in Polymer…

  16. Generate style modules • Use granite-css-modularizer • A small node

    script to generate Polymer style modules from CSS files

  17. Publicity

  18. I published a book about Web Font!

  19. None
  20. None
  21. None

  22. Thank you! (font : Metropolis)