Skip to content

Commit 712b5ad

Browse files
moyusmoyus
committed
Update
1 parent af68fd8 commit 712b5ad

10 files changed

Lines changed: 90 additions & 84 deletions

File tree

‎dist/point.css‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1693,6 +1693,15 @@ fieldset[disabled] .btn {
16931693

16941694
.btn.btn--icon {
16951695
width: 38px;
1696+
height: 38px;
1697+
padding: 0;
1698+
}
1699+
1700+
.btn.btn--icon > * {
1701+
position: absolute;
1702+
top: 50%;
1703+
left: 50%;
1704+
transform: translate(-50%, -50%);
16961705
}
16971706

16981707
.btn.btn--black {

‎dist/point.js‎

Lines changed: 13 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -31,34 +31,22 @@
3131
if (!this.trigger) {
3232
throw Error('Trigger element does not exist!')
3333
}
34-
35-
var targetId = this.trigger.dataset.target
36-
var toggleServiceName = this.trigger.dataset.toggle
37-
var enterServiceName = this.trigger.dataset.enter
38-
var leaveServiceName = this.trigger.dataset.leave
39-
40-
if (
41-
typeof toggleServiceName !== 'undefined' ||
42-
typeof enterServiceName !== 'undefined' ||
43-
typeof leaveServiceName !== 'undefined'
44-
) {
45-
if (toggleServiceName) {
46-
this.type = 'toggle'
47-
this.service = Toggle.services[toggleServiceName]
48-
} else if (leaveServiceName) {
49-
this.type = 'leave'
50-
this.service = Toggle.services[leaveServiceName]
51-
} else if (enterServiceName) {
52-
this.type = 'enter'
53-
this.service = Toggle.services[enterServiceName]
54-
}
55-
} else {
34+
35+
var dataset = this.trigger.dataset
36+
37+
if ('leave' in dataset) {
38+
this.type = 'leave'
39+
this.service = !dataset.leave ? Toggle.services.default : Toggle.services[dataset.leave]
40+
} else if ('enter' in dataset) {
41+
this.type = 'enter'
42+
this.service = !dataset.enter ? Toggle.services.default : Toggle.services[dataset.enter]
43+
} else if ('toggle' in dataset) {
5644
this.type = 'toggle'
57-
this.service = Toggle.services.default
45+
this.service = !dataset.toggle ? Toggle.services.default : Toggle.services[dataset.toggle]
5846
}
5947

60-
if (typeof targetId !== 'undefined') {
61-
this.target = document.getElementById(targetId)
48+
if (dataset.target) {
49+
this.target = document.getElementById(dataset.target)
6250
} else {
6351
this.target = this.trigger
6452
}

‎dist/point.min.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/point.min.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎docs/button.html‎

Lines changed: 18 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -199,29 +199,35 @@ <h2 id="variant">
199199
Variant
200200
</h2><section class="snippet">
201201
<div class="snippet__preview">
202-
<button class="btn btn--primary">Primary</button>
203-
<button class="btn btn--info">Info</button>
204-
<button class="btn btn--success">Success</button>
205-
<button class="btn btn--danger">Danger</button>
206-
<button class="btn btn--warning">Warning</button>
207202
<button class="btn btn--black">Black</button>
208203
<button class="btn btn--dark">Dark</button>
209204
<button class="btn btn--light">Light</button>
210205
<button class="btn btn--white">White</button>
211206
<button class="btn btn--link">Link</button>
207+
<button class="btn btn--icon">
208+
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"><polyline points="21 8 21 21 3 21 3 8"></polyline><rect x="1" y="3" width="22" height="5"></rect><line x1="10" y1="12" x2="14" y2="12"></line></svg>
209+
</button>
210+
<br />
211+
<br />
212+
<button class="btn btn--primary">Primary</button>
213+
<button class="btn btn--info">Info</button>
214+
<button class="btn btn--success">Success</button>
215+
<button class="btn btn--danger">Danger</button>
216+
<button class="btn btn--warning">Warning</button>
212217
</div>
213218
<div class="snippet__source">
214219

215-
<pre><code class="language-html">&lt;button class=&quot;btn btn--primary&quot;&gt;Primary&lt;/button&gt;
216-
&lt;button class=&quot;btn btn--info&quot;&gt;Info&lt;/button&gt;
217-
&lt;button class=&quot;btn btn--success&quot;&gt;Success&lt;/button&gt;
218-
&lt;button class=&quot;btn btn--danger&quot;&gt;Danger&lt;/button&gt;
219-
&lt;button class=&quot;btn btn--warning&quot;&gt;Warning&lt;/button&gt;
220-
&lt;button class=&quot;btn btn--black&quot;&gt;Black&lt;/button&gt;
220+
<pre><code class="language-html">&lt;button class=&quot;btn btn--black&quot;&gt;Black&lt;/button&gt;
221221
&lt;button class=&quot;btn btn--dark&quot;&gt;Dark&lt;/button&gt;
222222
&lt;button class=&quot;btn btn--light&quot;&gt;Light&lt;/button&gt;
223223
&lt;button class=&quot;btn btn--white&quot;&gt;White&lt;/button&gt;
224-
&lt;button class=&quot;btn btn--link&quot;&gt;Link&lt;/button&gt;</code></pre>
224+
&lt;button class=&quot;btn btn--link&quot;&gt;Link&lt;/button&gt;
225+
&lt;button class=&quot;btn btn--icon&quot;&gt;...&lt;/button&gt;
226+
&lt;button class=&quot;btn btn--primary&quot;&gt;Primary&lt;/button&gt;
227+
&lt;button class=&quot;btn btn--info&quot;&gt;Info&lt;/button&gt;
228+
&lt;button class=&quot;btn btn--success&quot;&gt;Success&lt;/button&gt;
229+
&lt;button class=&quot;btn btn--danger&quot;&gt;Danger&lt;/button&gt;
230+
&lt;button class=&quot;btn btn--warning&quot;&gt;Warning&lt;/button&gt;</code></pre>
225231
</div>
226232
</section>
227233

‎docs/css/point.css‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1693,6 +1693,15 @@ fieldset[disabled] .btn {
16931693

16941694
.btn.btn--icon {
16951695
width: 38px;
1696+
height: 38px;
1697+
padding: 0;
1698+
}
1699+
1700+
.btn.btn--icon > * {
1701+
position: absolute;
1702+
top: 50%;
1703+
left: 50%;
1704+
transform: translate(-50%, -50%);
16961705
}
16971706

16981707
.btn.btn--black {

‎docs/css/style.css‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -191,10 +191,10 @@
191191
position: relative;
192192
color: #212121;
193193
display: inline-block;
194-
width: 18px;
195-
height: 16px;
196-
border-top: 2px solid currentColor;
197-
border-bottom: 2px solid currentColor;
194+
width: 16px;
195+
height: 13px;
196+
border-top: 1px solid currentColor;
197+
border-bottom: 1px solid currentColor;
198198
}
199199

200200
.icon-menu:before {
@@ -204,7 +204,7 @@
204204
top: 5px;
205205
left: 0;
206206
width: 100%;
207-
height: 2px;
207+
height: 1px;
208208
background-color: currentColor;
209209
}
210210

‎docs/js/point.js‎

Lines changed: 13 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -31,34 +31,22 @@
3131
if (!this.trigger) {
3232
throw Error('Trigger element does not exist!')
3333
}
34-
35-
var targetId = this.trigger.dataset.target
36-
var toggleServiceName = this.trigger.dataset.toggle
37-
var enterServiceName = this.trigger.dataset.enter
38-
var leaveServiceName = this.trigger.dataset.leave
39-
40-
if (
41-
typeof toggleServiceName !== 'undefined' ||
42-
typeof enterServiceName !== 'undefined' ||
43-
typeof leaveServiceName !== 'undefined'
44-
) {
45-
if (toggleServiceName) {
46-
this.type = 'toggle'
47-
this.service = Toggle.services[toggleServiceName]
48-
} else if (leaveServiceName) {
49-
this.type = 'leave'
50-
this.service = Toggle.services[leaveServiceName]
51-
} else if (enterServiceName) {
52-
this.type = 'enter'
53-
this.service = Toggle.services[enterServiceName]
54-
}
55-
} else {
34+
35+
var dataset = this.trigger.dataset
36+
37+
if ('leave' in dataset) {
38+
this.type = 'leave'
39+
this.service = !dataset.leave ? Toggle.services.default : Toggle.services[dataset.leave]
40+
} else if ('enter' in dataset) {
41+
this.type = 'enter'
42+
this.service = !dataset.enter ? Toggle.services.default : Toggle.services[dataset.enter]
43+
} else if ('toggle' in dataset) {
5644
this.type = 'toggle'
57-
this.service = Toggle.services.default
45+
this.service = !dataset.toggle ? Toggle.services.default : Toggle.services[dataset.toggle]
5846
}
5947

60-
if (typeof targetId !== 'undefined') {
61-
this.target = document.getElementById(targetId)
48+
if (dataset.target) {
49+
this.target = document.getElementById(dataset.target)
6250
} else {
6351
this.target = this.trigger
6452
}

‎docs/src/_scss/_element.scss‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -51,18 +51,18 @@
5151
position: relative;
5252
color: $grey-dark;
5353
display: inline-block;
54-
width: 18px;
55-
height: 16px;
56-
border-top: 2px solid currentColor;
57-
border-bottom: 2px solid currentColor;
54+
width: 16px;
55+
height: 13px;
56+
border-top: 1px solid currentColor;
57+
border-bottom: 1px solid currentColor;
5858
&:before {
5959
display: block;
6060
content: '';
6161
position: absolute;
6262
top: 5px;
6363
left: 0;
6464
width: 100%;
65-
height: 2px;
65+
height: 1px;
6666
background-color: currentColor;
6767
}
6868
}

‎docs/src/content/button.md‎

Lines changed: 16 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -31,30 +31,36 @@ catalogue:
3131

3232
<section class="snippet">
3333
<div class="snippet__preview">
34-
<button class="btn btn--primary">Primary</button>
35-
<button class="btn btn--info">Info</button>
36-
<button class="btn btn--success">Success</button>
37-
<button class="btn btn--danger">Danger</button>
38-
<button class="btn btn--warning">Warning</button>
3934
<button class="btn btn--black">Black</button>
4035
<button class="btn btn--dark">Dark</button>
4136
<button class="btn btn--light">Light</button>
4237
<button class="btn btn--white">White</button>
4338
<button class="btn btn--link">Link</button>
39+
<button class="btn btn--icon">
40+
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"><polyline points="21 8 21 21 3 21 3 8"></polyline><rect x="1" y="3" width="22" height="5"></rect><line x1="10" y1="12" x2="14" y2="12"></line></svg>
41+
</button>
42+
<br />
43+
<br />
44+
<button class="btn btn--primary">Primary</button>
45+
<button class="btn btn--info">Info</button>
46+
<button class="btn btn--success">Success</button>
47+
<button class="btn btn--danger">Danger</button>
48+
<button class="btn btn--warning">Warning</button>
4449
</div>
4550
<div class="snippet__source">
4651

4752
```html
48-
<button class="btn btn--primary">Primary</button>
49-
<button class="btn btn--info">Info</button>
50-
<button class="btn btn--success">Success</button>
51-
<button class="btn btn--danger">Danger</button>
52-
<button class="btn btn--warning">Warning</button>
5353
<button class="btn btn--black">Black</button>
5454
<button class="btn btn--dark">Dark</button>
5555
<button class="btn btn--light">Light</button>
5656
<button class="btn btn--white">White</button>
5757
<button class="btn btn--link">Link</button>
58+
<button class="btn btn--icon">...</button>
59+
<button class="btn btn--primary">Primary</button>
60+
<button class="btn btn--info">Info</button>
61+
<button class="btn btn--success">Success</button>
62+
<button class="btn btn--danger">Danger</button>
63+
<button class="btn btn--warning">Warning</button>
5864
```
5965

6066
</div>

0 commit comments

Comments
 (0)