uistiti 0.1.1 → 0.1.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/README.md +33 -6
- data/lib/uistiti/engine.rb +4 -1
- data/lib/uistiti/version.rb +1 -1
- metadata +1 -1
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: a55b8d81c480ef33b6f48f41ea284a4ef564ede3b15f19daf8dba88266ace1a1
|
|
4
|
+
data.tar.gz: 4f8417fd0a48c164e8f8fec9214f375b1678ba936bedc5f026c5bf36cb423a36
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 14c5388c5afcca663cf2abc5f4ffee83baf7d7478d02913b5605631078750711985d560fe3b76c21a8395cc1b180d14e88471246dbd491078c39df60273612c5
|
|
7
|
+
data.tar.gz: 5a00cf0d308ab06963e0db06a0d238a8414354f24668d560f88f0275c7f7cc3c151ac10accd48849a965d5364e3d5b2dc2fcaca4b9163e634bf4500b791719aa
|
data/README.md
CHANGED
|
@@ -1,8 +1,13 @@
|
|
|
1
|
-
# Uistiti
|
|
2
|
-
|
|
1
|
+
# Uistiti UI kit for Rails
|
|
2
|
+
This gem holds everything you need (UI speaking) to create nice User interface.
|
|
3
|
+
It comes with CSS style (customisable for sure) and Javascript out of the bout.
|
|
4
|
+
For productivity enhancement i also published a [VsCode extension](https://marketplace.visualstudio.com/items?itemName=UistitiUiKit.uistitirails) wich give you snippets for all the component of the library.
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
|
|
3
8
|
|
|
4
9
|
## Usage
|
|
5
|
-
How to use
|
|
10
|
+
How to use the plug in :
|
|
6
11
|
|
|
7
12
|
## Installation
|
|
8
13
|
Add this line to your application's Gemfile:
|
|
@@ -16,11 +21,33 @@ And then execute:
|
|
|
16
21
|
$ bundle
|
|
17
22
|
```
|
|
18
23
|
|
|
19
|
-
|
|
20
|
-
```
|
|
21
|
-
|
|
24
|
+
Now in your views you can use Uistiti components just as normal ViewComponents :
|
|
25
|
+
```ruby
|
|
26
|
+
<%= render Uistiti::Alpha::Flex.new(direction: :column, justify_content: :space_between) do %>
|
|
27
|
+
<%= items %>
|
|
28
|
+
<% end %>
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
For the CSS & style :
|
|
32
|
+
All the CSS files relies on a set of [variables](https://github.com/rails-hackathon/team-173/blob/development/app/assets/stylesheets/uistiti/config/_variables.scss), if you want to start using styled component you can import them in you application.scss file
|
|
33
|
+
|
|
34
|
+
```css
|
|
35
|
+
//app/assets/stylesheets/aplication.scss
|
|
36
|
+
@import 'uistiti/config/variables';
|
|
37
|
+
```
|
|
38
|
+
If you want to update the colors and the different design tokens, you can dowload the file and modify the values you want and import the local file instead of the one from the gem.
|
|
39
|
+
|
|
40
|
+
Then, for each component you use you can import the related css
|
|
41
|
+
```css
|
|
42
|
+
//app/assets/stylesheets/aplication.scss
|
|
43
|
+
@import 'uistiti/config/variables';
|
|
44
|
+
@import 'uistiti/components/alpha/flex';
|
|
22
45
|
```
|
|
23
46
|
|
|
47
|
+
For Component with javascript behavior, there is nothing to do, the controllers are automatically registered through the asset pipe line and import-map.
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
|
|
24
51
|
## Contributing
|
|
25
52
|
Contribution directions go here.
|
|
26
53
|
|
data/lib/uistiti/engine.rb
CHANGED
|
@@ -6,7 +6,10 @@ module Uistiti
|
|
|
6
6
|
isolate_namespace Uistiti
|
|
7
7
|
|
|
8
8
|
#Show to lookbook where it can find the previews
|
|
9
|
-
|
|
9
|
+
puts '*'*80
|
|
10
|
+
puts Dir[File.join(Uistiti::Engine.root, 'test/components/previews/**/*.rb')]
|
|
11
|
+
puts '*'*80
|
|
12
|
+
Lookbook.config.preview_paths = [File.join(Uistiti::Engine.root, 'test/components/previews')]
|
|
10
13
|
Lookbook.config.preview_layout = "uistiti/component_preview"
|
|
11
14
|
end
|
|
12
15
|
end
|
data/lib/uistiti/version.rb
CHANGED