Skip to content

mstfymrtc/baklava

This branch is 325 commits behind Trendyol/baklava:next.

Folders and files

NameName
Last commit message
Last commit date

Latest commit

71d3383 · Mar 25, 2023
Feb 27, 2023
Apr 24, 2022
Jan 27, 2023
Oct 13, 2022
Mar 16, 2023
Feb 17, 2023
Mar 13, 2023
Mar 25, 2023
Jun 24, 2021
Aug 3, 2022
Apr 17, 2022
Sep 12, 2022
May 11, 2022
Sep 20, 2022
Jun 2, 2022
Apr 4, 2022
Sep 2, 2022
Jul 2, 2022
May 16, 2022
Jul 5, 2022
Aug 4, 2022
Jun 13, 2022
May 17, 2022
Sep 2, 2022
Oct 13, 2022
Jun 28, 2022
Sep 6, 2022
Jan 24, 2023
Mar 13, 2023
Mar 13, 2023
Mar 16, 2023
Mar 16, 2023
Jul 4, 2022
Jul 1, 2022
Oct 6, 2022

Repository files navigation

image

Baklava Design System

npm package jsDelivr hits (npm scoped) semantic-release: angular

This is a work-in-progress version. If you want to work on previous version (Grace) please check main branch.

Baklava is a design system provided by Trendyol to create a consistent UI/UX for app users.

Web implementation of the design system is created as native web components so it can be used within every type of web frameworks including Vue, React or Angular. Our target is providing a UI library that has neatly designed and developed for providing best possible user experience for the users of applications that uses Baklava DS.

How to use

Preferred way of using Baklava is using it via CDN. Just import library JS and CSS files to your main document like below:

Since we are in beta version, there can be breaking changes in build. We don’t suggest you to use beta tag. Use versions instead.

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@trendyol/baklava@beta/dist/themes/default.css" />
<script type="module" src="https://cdn.jsdelivr.net/npm/@trendyol/baklava@beta/dist/baklava.js"></script>

This way library will be served from a very high performant CDN and all of the Baklava web components will be ready to use inside your web project.

⚠️ Because the scripts of the custom components are loaded into the DOM later, the baklava components may appear unstyled on the screen for a while. In order to avoid this 'FOUCE' effect, you can follow the instructions at this link.

Useful Links

About

Design System with Web Components

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 78.8%
  • CSS 16.0%
  • JavaScript 4.6%
  • Other 0.6%