SlideShare a Scribd company logo
1 of 13
Download to read offline
EZTABLE Design Library
Live Styleguide
- kcliu F2E@EZTABLE
Why need it?
● learn from Bootsrap, Semantic UI
● better communication
● consistency
● reusable components
● boost development
How to build Styleguide
SASS + KSS
SASS
● Modular file structure with @import
● Variables
● demo
SASS
SASS
KSS
KSS
● human readable
● machine parsable
● work for SASS, SCSS, LESS …
● Ruby
kss-node
A NodeJS Implementation of KSS
Eztable Design Library
Eztable Design Library
Eztable Design Library
Refs
● http://sass-lang.com/guide
● http://semantic-ui.com/
● https://speakerdeck.com/kneath/a-better-
future-with-kss
● https://github.com/kss-node/kss-node

More Related Content

What's hot

Ext JS Meetup Presentation
Ext JS Meetup PresentationExt JS Meetup Presentation
Ext JS Meetup PresentationPatrick Sheridan
 
Bootstrap lightning talk
Bootstrap lightning talkBootstrap lightning talk
Bootstrap lightning talkJaran Flaath
 
Gatsby (Code.Talks) 2019
Gatsby (Code.Talks) 2019Gatsby (Code.Talks) 2019
Gatsby (Code.Talks) 2019Stefan Adolf
 
Decoupling Content Management with Create.js
Decoupling Content Management with Create.jsDecoupling Content Management with Create.js
Decoupling Content Management with Create.jsHenri Bergius
 
remodel your persistence layer
remodel your persistence layerremodel your persistence layer
remodel your persistence layerTim Lossen
 
Microservices: A developer's approach
Microservices: A developer's approachMicroservices: A developer's approach
Microservices: A developer's approachFoyzul Karim
 
CreateJS hackathon in Zurich
CreateJS hackathon in ZurichCreateJS hackathon in Zurich
CreateJS hackathon in ZurichHenri Bergius
 
Create.js - Inline editing for any website
Create.js - Inline editing for any websiteCreate.js - Inline editing for any website
Create.js - Inline editing for any websiteHenri Bergius
 
Web components
Web componentsWeb components
Web componentsehsanarian
 
Rise of the Middle End
Rise of the Middle EndRise of the Middle End
Rise of the Middle EndKyle Simpson
 
Decoupling Content Management with Create.js and PHPCR
Decoupling Content Management with Create.js and PHPCRDecoupling Content Management with Create.js and PHPCR
Decoupling Content Management with Create.js and PHPCRHenri Bergius
 
Decoupling Content Management
Decoupling Content ManagementDecoupling Content Management
Decoupling Content ManagementHenri Bergius
 
Create - Decoupled CMS interface
Create - Decoupled CMS interfaceCreate - Decoupled CMS interface
Create - Decoupled CMS interfaceHenri Bergius
 
Extending GWT
Extending GWTExtending GWT
Extending GWTisurusndr
 

What's hot (16)

Ext JS Meetup Presentation
Ext JS Meetup PresentationExt JS Meetup Presentation
Ext JS Meetup Presentation
 
Bootstrap lightning talk
Bootstrap lightning talkBootstrap lightning talk
Bootstrap lightning talk
 
Gatsby (Code.Talks) 2019
Gatsby (Code.Talks) 2019Gatsby (Code.Talks) 2019
Gatsby (Code.Talks) 2019
 
Decoupling Content Management with Create.js
Decoupling Content Management with Create.jsDecoupling Content Management with Create.js
Decoupling Content Management with Create.js
 
remodel your persistence layer
remodel your persistence layerremodel your persistence layer
remodel your persistence layer
 
Microservices: A developer's approach
Microservices: A developer's approachMicroservices: A developer's approach
Microservices: A developer's approach
 
CreateJS hackathon in Zurich
CreateJS hackathon in ZurichCreateJS hackathon in Zurich
CreateJS hackathon in Zurich
 
EBI Core content model
EBI Core content modelEBI Core content model
EBI Core content model
 
Create.js - Inline editing for any website
Create.js - Inline editing for any websiteCreate.js - Inline editing for any website
Create.js - Inline editing for any website
 
Web components
Web componentsWeb components
Web components
 
Rise of the Middle End
Rise of the Middle EndRise of the Middle End
Rise of the Middle End
 
Decoupling Content Management with Create.js and PHPCR
Decoupling Content Management with Create.js and PHPCRDecoupling Content Management with Create.js and PHPCR
Decoupling Content Management with Create.js and PHPCR
 
Decoupling Content Management
Decoupling Content ManagementDecoupling Content Management
Decoupling Content Management
 
Create - Decoupled CMS interface
Create - Decoupled CMS interfaceCreate - Decoupled CMS interface
Create - Decoupled CMS interface
 
Sass in 5
Sass in 5Sass in 5
Sass in 5
 
Extending GWT
Extending GWTExtending GWT
Extending GWT
 

Recently uploaded

solar wireless electric vechicle charging system
solar wireless electric vechicle charging systemsolar wireless electric vechicle charging system
solar wireless electric vechicle charging systemgokuldongala
 
Modelling Guide for Timber Structures - FPInnovations
Modelling Guide for Timber Structures - FPInnovationsModelling Guide for Timber Structures - FPInnovations
Modelling Guide for Timber Structures - FPInnovationsYusuf Yıldız
 
Engineering Mechanics Chapter 5 Equilibrium of a Rigid Body
Engineering Mechanics  Chapter 5  Equilibrium of a Rigid BodyEngineering Mechanics  Chapter 5  Equilibrium of a Rigid Body
Engineering Mechanics Chapter 5 Equilibrium of a Rigid BodyAhmadHajasad2
 
Test of Significance of Large Samples for Mean = µ.pptx
Test of Significance of Large Samples for Mean = µ.pptxTest of Significance of Large Samples for Mean = µ.pptx
Test of Significance of Large Samples for Mean = µ.pptxHome
 
Mohs Scale of Hardness, Hardness Scale.pptx
Mohs Scale of Hardness, Hardness Scale.pptxMohs Scale of Hardness, Hardness Scale.pptx
Mohs Scale of Hardness, Hardness Scale.pptxKISHAN KUMAR
 
Design of Clutches and Brakes in Design of Machine Elements.pptx
Design of Clutches and Brakes in Design of Machine Elements.pptxDesign of Clutches and Brakes in Design of Machine Elements.pptx
Design of Clutches and Brakes in Design of Machine Elements.pptxYogeshKumarKJMIT
 
Multicomponent Spiral Wound Membrane Separation Model.pdf
Multicomponent Spiral Wound Membrane Separation Model.pdfMulticomponent Spiral Wound Membrane Separation Model.pdf
Multicomponent Spiral Wound Membrane Separation Model.pdfGiovanaGhasary1
 
ChatGPT-and-Generative-AI-Landscape Working of generative ai search
ChatGPT-and-Generative-AI-Landscape Working of generative ai searchChatGPT-and-Generative-AI-Landscape Working of generative ai search
ChatGPT-and-Generative-AI-Landscape Working of generative ai searchrohitcse52
 
Best-NO1 Best Rohani Amil In Lahore Kala Ilam In Lahore Kala Jadu Amil In Lah...
Best-NO1 Best Rohani Amil In Lahore Kala Ilam In Lahore Kala Jadu Amil In Lah...Best-NO1 Best Rohani Amil In Lahore Kala Ilam In Lahore Kala Jadu Amil In Lah...
Best-NO1 Best Rohani Amil In Lahore Kala Ilam In Lahore Kala Jadu Amil In Lah...Amil baba
 
Graphics Primitives and CG Display Devices
Graphics Primitives and CG Display DevicesGraphics Primitives and CG Display Devices
Graphics Primitives and CG Display DevicesDIPIKA83
 
Strategies of Urban Morphologyfor Improving Outdoor Thermal Comfort and Susta...
Strategies of Urban Morphologyfor Improving Outdoor Thermal Comfort and Susta...Strategies of Urban Morphologyfor Improving Outdoor Thermal Comfort and Susta...
Strategies of Urban Morphologyfor Improving Outdoor Thermal Comfort and Susta...amrabdallah9
 
Nodal seismic construction requirements.pptx
Nodal seismic construction requirements.pptxNodal seismic construction requirements.pptx
Nodal seismic construction requirements.pptxwendy cai
 
nvidia AI-gtc 2024 partial slide deck.pptx
nvidia AI-gtc 2024 partial slide deck.pptxnvidia AI-gtc 2024 partial slide deck.pptx
nvidia AI-gtc 2024 partial slide deck.pptxjasonsedano2
 
Gender Bias in Engineer, Honors 203 Project
Gender Bias in Engineer, Honors 203 ProjectGender Bias in Engineer, Honors 203 Project
Gender Bias in Engineer, Honors 203 Projectreemakb03
 
A Seminar on Electric Vehicle Software Simulation
A Seminar on Electric Vehicle Software SimulationA Seminar on Electric Vehicle Software Simulation
A Seminar on Electric Vehicle Software SimulationMohsinKhanA
 
Landsman converter for power factor improvement
Landsman converter for power factor improvementLandsman converter for power factor improvement
Landsman converter for power factor improvementVijayMuni2
 
Dev.bg DevOps March 2024 Monitoring & Logging
Dev.bg DevOps March 2024 Monitoring & LoggingDev.bg DevOps March 2024 Monitoring & Logging
Dev.bg DevOps March 2024 Monitoring & LoggingMarian Marinov
 
Renewable Energy & Entrepreneurship Workshop_21Feb2024.pdf
Renewable Energy & Entrepreneurship Workshop_21Feb2024.pdfRenewable Energy & Entrepreneurship Workshop_21Feb2024.pdf
Renewable Energy & Entrepreneurship Workshop_21Feb2024.pdfodunowoeminence2019
 

Recently uploaded (20)

solar wireless electric vechicle charging system
solar wireless electric vechicle charging systemsolar wireless electric vechicle charging system
solar wireless electric vechicle charging system
 
Litature Review: Research Paper work for Engineering
Litature Review: Research Paper work for EngineeringLitature Review: Research Paper work for Engineering
Litature Review: Research Paper work for Engineering
 
Modelling Guide for Timber Structures - FPInnovations
Modelling Guide for Timber Structures - FPInnovationsModelling Guide for Timber Structures - FPInnovations
Modelling Guide for Timber Structures - FPInnovations
 
Engineering Mechanics Chapter 5 Equilibrium of a Rigid Body
Engineering Mechanics  Chapter 5  Equilibrium of a Rigid BodyEngineering Mechanics  Chapter 5  Equilibrium of a Rigid Body
Engineering Mechanics Chapter 5 Equilibrium of a Rigid Body
 
Test of Significance of Large Samples for Mean = µ.pptx
Test of Significance of Large Samples for Mean = µ.pptxTest of Significance of Large Samples for Mean = µ.pptx
Test of Significance of Large Samples for Mean = µ.pptx
 
Mohs Scale of Hardness, Hardness Scale.pptx
Mohs Scale of Hardness, Hardness Scale.pptxMohs Scale of Hardness, Hardness Scale.pptx
Mohs Scale of Hardness, Hardness Scale.pptx
 
Design of Clutches and Brakes in Design of Machine Elements.pptx
Design of Clutches and Brakes in Design of Machine Elements.pptxDesign of Clutches and Brakes in Design of Machine Elements.pptx
Design of Clutches and Brakes in Design of Machine Elements.pptx
 
Multicomponent Spiral Wound Membrane Separation Model.pdf
Multicomponent Spiral Wound Membrane Separation Model.pdfMulticomponent Spiral Wound Membrane Separation Model.pdf
Multicomponent Spiral Wound Membrane Separation Model.pdf
 
ChatGPT-and-Generative-AI-Landscape Working of generative ai search
ChatGPT-and-Generative-AI-Landscape Working of generative ai searchChatGPT-and-Generative-AI-Landscape Working of generative ai search
ChatGPT-and-Generative-AI-Landscape Working of generative ai search
 
Best-NO1 Best Rohani Amil In Lahore Kala Ilam In Lahore Kala Jadu Amil In Lah...
Best-NO1 Best Rohani Amil In Lahore Kala Ilam In Lahore Kala Jadu Amil In Lah...Best-NO1 Best Rohani Amil In Lahore Kala Ilam In Lahore Kala Jadu Amil In Lah...
Best-NO1 Best Rohani Amil In Lahore Kala Ilam In Lahore Kala Jadu Amil In Lah...
 
Graphics Primitives and CG Display Devices
Graphics Primitives and CG Display DevicesGraphics Primitives and CG Display Devices
Graphics Primitives and CG Display Devices
 
Strategies of Urban Morphologyfor Improving Outdoor Thermal Comfort and Susta...
Strategies of Urban Morphologyfor Improving Outdoor Thermal Comfort and Susta...Strategies of Urban Morphologyfor Improving Outdoor Thermal Comfort and Susta...
Strategies of Urban Morphologyfor Improving Outdoor Thermal Comfort and Susta...
 
Nodal seismic construction requirements.pptx
Nodal seismic construction requirements.pptxNodal seismic construction requirements.pptx
Nodal seismic construction requirements.pptx
 
nvidia AI-gtc 2024 partial slide deck.pptx
nvidia AI-gtc 2024 partial slide deck.pptxnvidia AI-gtc 2024 partial slide deck.pptx
nvidia AI-gtc 2024 partial slide deck.pptx
 
Gender Bias in Engineer, Honors 203 Project
Gender Bias in Engineer, Honors 203 ProjectGender Bias in Engineer, Honors 203 Project
Gender Bias in Engineer, Honors 203 Project
 
A Seminar on Electric Vehicle Software Simulation
A Seminar on Electric Vehicle Software SimulationA Seminar on Electric Vehicle Software Simulation
A Seminar on Electric Vehicle Software Simulation
 
Landsman converter for power factor improvement
Landsman converter for power factor improvementLandsman converter for power factor improvement
Landsman converter for power factor improvement
 
Présentation IIRB 2024 Marine Cordonnier.pdf
Présentation IIRB 2024 Marine Cordonnier.pdfPrésentation IIRB 2024 Marine Cordonnier.pdf
Présentation IIRB 2024 Marine Cordonnier.pdf
 
Dev.bg DevOps March 2024 Monitoring & Logging
Dev.bg DevOps March 2024 Monitoring & LoggingDev.bg DevOps March 2024 Monitoring & Logging
Dev.bg DevOps March 2024 Monitoring & Logging
 
Renewable Energy & Entrepreneurship Workshop_21Feb2024.pdf
Renewable Energy & Entrepreneurship Workshop_21Feb2024.pdfRenewable Energy & Entrepreneurship Workshop_21Feb2024.pdf
Renewable Energy & Entrepreneurship Workshop_21Feb2024.pdf
 

Eztable Design Library