material_design 0.6.2 → 0.8.0
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/app/assets/stylesheets/material_design/chips.css +21 -0
- data/app/assets/stylesheets/material_design/segmented_button.css +56 -0
- data/app/views/material_design/_chip.html.erb +3 -0
- data/app/views/material_design/buttons/_segmented_button.html.erb +13 -0
- data/app/views/material_design/icons/_shift.html.erb +1 -0
- data/app/views/material_design/icons/_shift_filled.html.erb +1 -0
- data/lib/material_design/version.rb +1 -1
- metadata +11 -3
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 792bfc436512bc05110a5a4b071705924153899300bfa0c5252c921b61fa687a
|
|
4
|
+
data.tar.gz: 58b034a146b93d4e4d63e99bd5ae7dbff01b9f989fbcfb9fa0856e19a1539778
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: fb4c395a4b9907be2e9698327aa26172c7c1c71864667765a2c4a5503924b240e5adb94a455de110ab1eac84e0090dc6885a3b6dbfb53780afa8fcbedce09d71
|
|
7
|
+
data.tar.gz: edfb8cc9b0b0bec9832f571fc8d44be92ba5dad792212573adb14e6dda3d2df76674eb3a6b95a800320cfdeed334f818c9665dfd2cb5fda4045d5ddfa10adcb7
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
.chip {
|
|
2
|
+
display: inline-flex;
|
|
3
|
+
align-items: center;
|
|
4
|
+
height: 32px;
|
|
5
|
+
padding: 8px 12px;
|
|
6
|
+
border-radius: 8px;
|
|
7
|
+
font-size: 14px;
|
|
8
|
+
font-weight: 500;
|
|
9
|
+
margin-right: 8px;
|
|
10
|
+
white-space: nowrap;
|
|
11
|
+
|
|
12
|
+
@media (prefers-color-scheme: light) {
|
|
13
|
+
background: rgb(var(--md-sys-light-secondary-fixed));
|
|
14
|
+
color: rgb(var(--md-sys-dark-on-secondary-fixed));
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
@media (prefers-color-scheme: dark) {
|
|
18
|
+
background: rgb(var(--md-sys-dark-secondary-fixed));
|
|
19
|
+
color: rgb(var(--md-sys-dark-on-secondary-fixed));
|
|
20
|
+
}
|
|
21
|
+
}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
.segmented-control {
|
|
2
|
+
display: flex;
|
|
3
|
+
border: 1px solid #ccc;
|
|
4
|
+
border-radius: 30px;
|
|
5
|
+
overflow: hidden;
|
|
6
|
+
background-color: var(--md-sys-surface);
|
|
7
|
+
width: fit-content;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.segmented-control label {
|
|
11
|
+
display: flex;
|
|
12
|
+
align-items: center;
|
|
13
|
+
padding: 8px 16px;
|
|
14
|
+
cursor: pointer;
|
|
15
|
+
border-left: 1px solid #ccc;
|
|
16
|
+
transition: background-color 0.3s ease;
|
|
17
|
+
font-size: 14px;
|
|
18
|
+
color: var(--md-sys-on-surface);
|
|
19
|
+
background-color: transparent;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
.segmented-control label:first-child {
|
|
23
|
+
border-left: none;
|
|
24
|
+
border-radius: 12px 0 0 12px;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
.segmented-control label:last-child {
|
|
28
|
+
border-radius: 0 12px 12px 0;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
.segmented-control input[type="radio"] {
|
|
32
|
+
display: none;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
.segmented-control input[type="radio"]:checked + label {
|
|
36
|
+
background-color: rgb(var(--md-sys-light-primary-container)) !important;
|
|
37
|
+
color: rgb(var(--md-sys-on-primary-container));
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.segmented-control label.active {
|
|
41
|
+
background-color: rgb(var(--md-sys-light-primary-container)) !important;
|
|
42
|
+
color: rgb(var(--md-sys-on-primary-container));
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
.checkmark {
|
|
46
|
+
margin-right: 8px;
|
|
47
|
+
visibility: hidden;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
.segmented-control input[type="radio"]:checked + label .checkmark {
|
|
51
|
+
visibility: visible;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.segmented-control label:hover {
|
|
55
|
+
background-color: rgba(0, 0, 0, 0.04);
|
|
56
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
<div class="segmented-control">
|
|
2
|
+
<% options.each do |option| %>
|
|
3
|
+
<%= form.radio_button field_name, option[:value], checked: option[:checked], id: "#{field_name}_#{option[:value]}" %>
|
|
4
|
+
<%= form.label "#{field_name}_#{option[:value]}", class: "segmented-btn grey-hover #{option[:class]}" do %>
|
|
5
|
+
<% if option[:checked] %>
|
|
6
|
+
<div class="mr-2">
|
|
7
|
+
<%= render "material_design/icons/icon", locals: { size: 18, icon: "check" } %>
|
|
8
|
+
</div>
|
|
9
|
+
<% end %>
|
|
10
|
+
<%= option[:label] %>
|
|
11
|
+
<% end %>
|
|
12
|
+
<% end %>
|
|
13
|
+
</div>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="<%= locals[:size] %>" height="<%= locals[:size] %>" viewBox="0 -960 960 960" width="24px" fill="currentColor"><path d="M320-120v-320H120l360-440 360 440H640v320H320Zm80-80h160v-320h111L480-754 289-520h111v320Zm80-320Z"/></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="<%= locals[:size] %>" height="<%= locals[:size] %>" viewBox="0 -960 960 960" width="24px" fill="currentColor"><path d="M320-120v-320H120l360-440 360 440H640v320H320Z"/></svg>
|
metadata
CHANGED
|
@@ -1,16 +1,18 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: material_design
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.
|
|
4
|
+
version: 0.8.0
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Eduardo Yutaka Nakanishi
|
|
8
8
|
- Fabiana Ramos
|
|
9
9
|
- Mariana Negrão Trancoso
|
|
10
|
+
- Prscila Sabino
|
|
11
|
+
- Bianca Cristina Ramos
|
|
10
12
|
autorequire:
|
|
11
13
|
bindir: bin
|
|
12
14
|
cert_chain: []
|
|
13
|
-
date: 2024-
|
|
15
|
+
date: 2024-10-09 00:00:00.000000000 Z
|
|
14
16
|
dependencies:
|
|
15
17
|
- !ruby/object:Gem::Dependency
|
|
16
18
|
name: rails
|
|
@@ -41,10 +43,12 @@ files:
|
|
|
41
43
|
- app/assets/stylesheets/material_design/application.css
|
|
42
44
|
- app/assets/stylesheets/material_design/buttons.css
|
|
43
45
|
- app/assets/stylesheets/material_design/cards.css
|
|
46
|
+
- app/assets/stylesheets/material_design/chips.css
|
|
44
47
|
- app/assets/stylesheets/material_design/dividers.css
|
|
45
48
|
- app/assets/stylesheets/material_design/icons.css
|
|
46
49
|
- app/assets/stylesheets/material_design/lists.css
|
|
47
50
|
- app/assets/stylesheets/material_design/navigation.css
|
|
51
|
+
- app/assets/stylesheets/material_design/segmented_button.css
|
|
48
52
|
- app/assets/stylesheets/material_design/tabs.css
|
|
49
53
|
- app/assets/stylesheets/material_design/typography.css
|
|
50
54
|
- app/controllers/material_design/application_controller.rb
|
|
@@ -54,9 +58,11 @@ files:
|
|
|
54
58
|
- app/mailers/material_design/application_mailer.rb
|
|
55
59
|
- app/models/material_design/application_record.rb
|
|
56
60
|
- app/views/layouts/material_design/application.html.erb
|
|
61
|
+
- app/views/material_design/_chip.html.erb
|
|
57
62
|
- app/views/material_design/app_bars/_top_bar.html.erb
|
|
58
63
|
- app/views/material_design/buttons/_fab.html.erb
|
|
59
64
|
- app/views/material_design/buttons/_icon_button.html.erb
|
|
65
|
+
- app/views/material_design/buttons/_segmented_button.html.erb
|
|
60
66
|
- app/views/material_design/cards/_outlined.html.erb
|
|
61
67
|
- app/views/material_design/dividers/_horizontal.html.erb
|
|
62
68
|
- app/views/material_design/icons/_10k.html.erb
|
|
@@ -1732,6 +1738,8 @@ files:
|
|
|
1732
1738
|
- app/views/material_design/icons/_share_location.html.erb
|
|
1733
1739
|
- app/views/material_design/icons/_shield.html.erb
|
|
1734
1740
|
- app/views/material_design/icons/_shield_moon.html.erb
|
|
1741
|
+
- app/views/material_design/icons/_shift.html.erb
|
|
1742
|
+
- app/views/material_design/icons/_shift_filled.html.erb
|
|
1735
1743
|
- app/views/material_design/icons/_shop.html.erb
|
|
1736
1744
|
- app/views/material_design/icons/_shop_2.html.erb
|
|
1737
1745
|
- app/views/material_design/icons/_shop_two.html.erb
|
|
@@ -2224,7 +2232,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
|
2224
2232
|
- !ruby/object:Gem::Version
|
|
2225
2233
|
version: '0'
|
|
2226
2234
|
requirements: []
|
|
2227
|
-
rubygems_version: 3.5.
|
|
2235
|
+
rubygems_version: 3.5.13
|
|
2228
2236
|
signing_key:
|
|
2229
2237
|
specification_version: 4
|
|
2230
2238
|
summary: Material Design
|