Skip to content

Commit

Permalink
docs: update version
Browse files Browse the repository at this point in the history
  • Loading branch information
@leventozen
leventozen committed Jan 25, 2024
1 parent 793143a commit 0e5db8d
Show file tree
Hide file tree
Showing 4 changed files with 12 additions and 12 deletions.
4 changes: 2 additions & 2 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,8 +29,8 @@ Web implementation of the design system is created as native web components so i
Preferred way of using Baklava is using it via CDN. Just import library JS and CSS files to your main document like below:

```html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@trendyol/baklava@2.3.0/dist/themes/default.css" />
<script type="module" src="https://cdn.jsdelivr.net/npm/@trendyol/baklava@2.3.0/dist/baklava.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@trendyol/baklava@3.0.0/dist/themes/default.css" />
<script type="module" src="https://cdn.jsdelivr.net/npm/@trendyol/baklava@3.0.0/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.
Expand Down
6 changes: 3 additions & 3 deletions docs/customizing-baklava-theme.stories.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ instead of `themes/default.css` file. Like:

```html
<link rel="stylesheet" href="/styles/my-baklava-theme.css" />
<script type="module" src="https://cdn.jsdelivr.net/npm/@trendyol/baklava@2.3.0/dist/baklava.js"></script>
<script type="module" src="https://cdn.jsdelivr.net/npm/@trendyol/baklava@3.0.0/dist/baklava.js"></script>
```

With this opportunity you can use all of the Baklava components with your own branding colors, own selection of Font or different sizing values.
Expand All @@ -29,9 +29,9 @@ With this opportunity you can use all of the Baklava components with your own br
If you want to change a small set of the design tokens, you may consider to extend default theme.

```html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@trendyol/baklava@2.3.0/dist/themes/default.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@trendyol/baklava@3.0.0/dist/themes/default.css" />
<link rel="stylesheet" href="/styles/my-baklava-theme.css" />
<script type="module" src="https://cdn.jsdelivr.net/npm/@trendyol/baklava@2.3.0/dist/baklava.js"></script>
<script type="module" src="https://cdn.jsdelivr.net/npm/@trendyol/baklava@3.0.0/dist/baklava.js"></script>
```

With this, you can -for example- only override color palette for your app and continue to use typography or spacing rules from the default theme.
Expand Down
8 changes: 4 additions & 4 deletions docs/using-baklava-in-react.stories.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,8 +17,8 @@ npm install @trendyol/baklava
Include Baklava library from CDN to your project's `index.html` file's `<head>` section.

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

Then you can use Baklava React components in your project by importing them from `@trendyol/baklava/dist/baklava-react` in your code.
Expand Down Expand Up @@ -62,7 +62,7 @@ import ReactDOM from "react-dom/client";
import "@trendyol/baklava";
import { setIconPath } from "@trendyol/baklava";
import "@trendyol/baklava/dist/themes/default.css";
setIconPath("https://cdn.jsdelivr.net/npm/@trendyol/baklava@2.3.0/dist/assets");
setIconPath("https://cdn.jsdelivr.net/npm/@trendyol/baklava@3.0.0/dist/assets");

import App from "./App";

Expand Down Expand Up @@ -193,7 +193,7 @@ import "vitest-dom/extend-expect";
import "@trendyol/baklava";
import { setIconPath } from "@trendyol/baklava";
import "@trendyol/baklava/dist/themes/default.css";
setIconPath("https://cdn.jsdelivr.net/npm/@trendyol/baklava@2.3.0/dist/assets");
setIconPath("https://cdn.jsdelivr.net/npm/@trendyol/baklava@3.0.0/dist/assets");
```

We are ready to write tests.
Expand Down
6 changes: 3 additions & 3 deletions docs/using-baklava-in-vue.stories.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,8 +17,8 @@ To make the rule more generic, easiest way is ignoring the elements start with `
To be able to use Baklava via CDN, you should add our default.css and baklava.js at head tag in your index.html file.

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

### Via NPM
Expand All @@ -29,7 +29,7 @@ then,
```js
@import "@trendyol/baklava/dist/themes/default.css";
import { setIconPath } from '@trendyol/baklava'
setIconPath('https://cdn.jsdelivr.net/npm/@trendyol/baklava@2.3.0/dist/assets')
setIconPath('https://cdn.jsdelivr.net/npm/@trendyol/baklava@3.0.0/dist/assets')
```

#### Vue2
Expand Down

0 comments on commit 0e5db8d

Please sign in to comment.