Skip to content

Commit f1d8145

Browse files
jlukicjlukic
committed
Updates for 2.2.3
1 parent 1e9ab36 commit f1d8145

5 files changed

Lines changed: 76 additions & 45 deletions

File tree

‎server/documents/behaviors/form.html.eco‎

Lines changed: 46 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -156,10 +156,35 @@ type : 'UI Behavior'
156156
<label>I agree to the terms and conditions</label>
157157
</div>
158158
</div>
159-
<div class="ui blue submit button">Submit</div>
159+
<div class="ui primary submit button">Submit</div>
160160
<div class="ui error message"></div>
161161
</div>
162162
</form>
163+
<div class="color example">
164+
<h4 class="ui header">Passing Parameters to Rules <div class="ui horizontal teal label">New in 2.2.3</div></h4>
165+
<p>Typically rules that include a parameter are written <code>minLength[2]</code> with the value being passed in as brackets.</p>
166+
<p>If passing in properties as a string is not ideal, or if you are pulling values from another javascript variable, it might make sense to consider using <code>value</code> to pass in the rule value.</p>
167+
<div class="ignored code">
168+
$('.ui.form').form({
169+
fields: {
170+
color: {
171+
identifier: 'color',
172+
rules: [{
173+
type: 'regExp',
174+
value: /rgb\((\d{1,3}), (\d{1,3}), (\d{1,3})\)/i,
175+
}]
176+
}
177+
}
178+
});
179+
</div>
180+
<form class="ui form segment">
181+
<div class="field">
182+
<label>Color</label>
183+
<input placeholder="Enter rgb" name="color" type="text" value="rgb(255, 255, 255)">
184+
</div>
185+
<div class="ui primary submit button">Submit</div>
186+
</form>
187+
</div>
163188

164189
<div class="prompt example">
165190
<h4 class="ui header">Customizing Prompts</h4>
@@ -220,7 +245,7 @@ type : 'UI Behavior'
220245
<input type="text" name="field2">
221246
</div>
222247
</div>
223-
<div class="ui blue submit button">Submit</div>
248+
<div class="ui primary submit button">Submit</div>
224249
<div class="ui error message">
225250
</div>
226251
</form>
@@ -251,7 +276,7 @@ type : 'UI Behavior'
251276
<label>Special Field</label>
252277
<input type="text" name="special-name">
253278
</div>
254-
<div class="ui blue submit button">Submit</div>
279+
<div class="ui primary submit button">Submit</div>
255280
<div class="ui error message">
256281
</div>
257282
</form>
@@ -311,7 +336,7 @@ type : 'UI Behavior'
311336
</tr>
312337
<tr>
313338
<td>regExp[expression]</td>
314-
<td>Matches against a regular expression, expects RegExp to be enclosed in <code>/</code></td>
339+
<td>Matches against a regular expression, when using bracketed notation RegExp values must be escaped.</td>
315340
<td>
316341
<code>regExp[/^[a-z0-9_-]{3,16}$/gi]]</code>
317342
<div class="ui horizontal divider">Or</div>
@@ -477,7 +502,7 @@ type : 'UI Behavior'
477502
<label>Dog</label>
478503
<input placeholder="Dog" name="dog" type="text">
479504
</div>
480-
<div class="ui blue submit button">
505+
<div class="ui primary submit button">
481506
<i class="add icon"></i>
482507
Add Dog
483508
</div>
@@ -502,7 +527,7 @@ type : 'UI Behavior'
502527
<label>Test Field</label>
503528
<input placeholder="Test Field" name="name" type="text">
504529
</div>
505-
<div class="ui blue submit button">Submit</div>
530+
<div class="ui primary submit button">Submit</div>
506531
<div class="ui reset button">Reset</div>
507532
<div class="ui clear button">Clear</div>
508533
</form>
@@ -555,7 +580,7 @@ type : 'UI Behavior'
555580
<label>I agree to the terms and conditions</label>
556581
</div>
557582
</div>
558-
<div class="ui blue submit button">Submit</div>
583+
<div class="ui primary submit button">Submit</div>
559584
<div class="ui reset button">Reset</div>
560585
<div class="ui clear button">Clear</div>
561586
</form>
@@ -642,7 +667,7 @@ type : 'UI Behavior'
642667
<label>I agree to the terms and conditions</label>
643668
</div>
644669
</div>
645-
<div class="ui blue submit button">Submit</div>
670+
<div class="ui primary submit button">Submit</div>
646671
<div class="ui clear button">Clear</div>
647672
</form>
648673
</div>
@@ -729,7 +754,7 @@ type : 'UI Behavior'
729754
<label>I agree to the terms and conditions</label>
730755
</div>
731756
</div>
732-
<div class="ui blue submit button">Submit</div>
757+
<div class="ui primary submit button">Submit</div>
733758
</form>
734759
</div>
735760

@@ -1333,6 +1358,10 @@ type : 'UI Behavior'
13331358

13341359
<h2 class="ui dividing header">Form Examples</h2>
13351360

1361+
<div class="dropdown example">
1362+
<h4 class="ui header">Regular Expressions</h4>
1363+
1364+
</div>
13361365
<div class="dropdown example">
13371366
<h4 class="ui header">Validating Dropdowns</h4>
13381367
<p><a href="/modules/dropdown.html">Dropdowns</a> can also be validated like other form fields. Simply match the validation rule to the <code>input</code> or <code>select</code> associated with the dropdown</p>
@@ -1384,7 +1413,7 @@ type : 'UI Behavior'
13841413
</div>
13851414
</div>
13861415
</div>
1387-
<div class="ui blue submit button">Submit</div>
1416+
<div class="ui primary submit button">Submit</div>
13881417
</form>
13891418
</div>
13901419
<div class="data example">
@@ -1411,7 +1440,7 @@ type : 'UI Behavior'
14111440
<label>Name</label>
14121441
<input type="text" name="SERVER_REQUIRED_NAME" data-validate="name">
14131442
</div>
1414-
<div class="ui blue submit button">Submit</div>
1443+
<div class="ui primary submit button">Submit</div>
14151444
</form>
14161445
</div>
14171446

@@ -1451,7 +1480,7 @@ type : 'UI Behavior'
14511480
<input type="text" name="yearsPracticed">
14521481
</div>
14531482
<div class="ui divider"></div>
1454-
<div class="ui blue submit button">Submit</div>
1483+
<div class="ui primary submit button">Submit</div>
14551484
<div class="ui error message"></div>
14561485
</form>
14571486
</div>
@@ -1499,7 +1528,7 @@ type : 'UI Behavior'
14991528
</div>
15001529
</div>
15011530
<div class="ui divider"></div>
1502-
<div class="ui blue submit button">Submit</div>
1531+
<div class="ui primary submit button">Submit</div>
15031532
<div class="ui error message"></div>
15041533
</form>
15051534
</div>
@@ -1537,7 +1566,7 @@ type : 'UI Behavior'
15371566
<label>E-mail</label>
15381567
<input type="text" name="email">
15391568
</div>
1540-
<div class="ui blue submit button">Submit</div>
1569+
<div class="ui primary submit button">Submit</div>
15411570
<div class="ui error message"></div>
15421571
</form>
15431572
</div>
@@ -1574,7 +1603,7 @@ type : 'UI Behavior'
15741603
<label>I agree to the Terms and Conditions</label>
15751604
</div>
15761605
</div>
1577-
<div class="ui blue submit button">Submit</div>
1606+
<div class="ui primary submit button">Submit</div>
15781607
<div class="ui error message"></div>
15791608
</form>
15801609
</div>
@@ -1618,7 +1647,7 @@ type : 'UI Behavior'
16181647
<label>I agree to the Terms and Conditions</label>
16191648
</div>
16201649
</div>
1621-
<div class="ui blue submit button">Submit</div>
1650+
<div class="ui primary submit button">Submit</div>
16221651
</form>
16231652
</div>
16241653

@@ -1656,7 +1685,7 @@ type : 'UI Behavior'
16561685
<label>Dog</label>
16571686
<input placeholder="Dog" name="dog" type="text">
16581687
</div>
1659-
<div class="ui blue submit button">
1688+
<div class="ui primary submit button">
16601689
<i class="add icon"></i>
16611690
Add Dog
16621691
</div>

‎server/documents/elements/icon.html.eco‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,6 @@ themes : ['Default']
5656
<div class="column"><i class="delete calendar icon"></i>Delete Calendar</div>
5757
<div class="column"><i class="external square icon"></i>External Square</div>
5858
<div class="column"><i class="external icon"></i>External</div>
59-
<div class="column"><i class="external icon"></i>External</div>
6059
<div class="column"><i class="eyedropper icon"></i>Eyedropper</div>
6160
<div class="column"><i class="feed icon"></i>Feed</div>
6261
<div class="column"><i class="find icon"></i>Find</div>
@@ -129,7 +128,6 @@ themes : ['Default']
129128
<i class="delete calendar icon"></i>
130129
<i class="external square icon"></i>
131130
<i class="external icon"></i>
132-
<i class="external icon"></i>
133131
<i class="eyedropper icon"></i>
134132
<i class="feed icon"></i>
135133
<i class="find icon"></i>
@@ -987,7 +985,7 @@ themes : ['Default']
987985
<div class="column"><i class="subway icon"></i>Subway</div>
988986
<div class="column"><i class="taxi icon"></i>Taxi</div>
989987
<div class="column"><i class="train icon"></i>Train</div>
990-
<div class="column"><i class="television icon"></i>Television</div>
988+
<div class="column"><i class="tv icon"></i>TV</div>
991989
<div class="column"><i class="tree icon"></i>Tree</div>
992990
<div class="column"><i class="university icon"></i>University</div>
993991
</div>

‎server/documents/hotfix.html.eco‎

Lines changed: 7 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -7,39 +7,23 @@ title : 'Test Page'
77
type : 'Library'
88
---
99
<div class="ui container">
10-
<div class="context">
11-
<h1>FOOBAR</h1>
12-
<p>Loren ipsum<br />dolor sit amet</p>
10+
<div class="ui 4:3 embed"
11+
data-url="https://example.com/video?id=123456"
12+
data-icon="right circle arrow"
13+
data-placeholder="http://example.net/icon.png">
14+
<i class="right circle arrow icon"></i>
15+
</div>
1316
</div>
1417

15-
<button class="ui button circular icon">
16-
<i class="icon settings"></i>
17-
</button>
1818
</div>
1919
<script>
2020
$(document).ready(function() {
21-
$('h1').visibility({
22-
type: 'fixed',
23-
context: 'div',
24-
debug: true
25-
});
26-
27-
$('button').on('click', function(e) {
28-
console.log('should reset');
29-
$('h1').visibility('destroy');
30-
});
31-
21+
$('.ui.embed').embed();
3222
});
3323

3424
</script>
3525

3626
<!-- TEST CSS HERE !-->
3727
<style type="text/css">
3828

39-
.container {
40-
height: 60px;
41-
overflow: scroll;
42-
margin-bottom: 20px;
43-
}
44-
4529
</style>

‎server/documents/modules/modal.html.eco‎

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -420,10 +420,10 @@ themes : ['Default', 'Material']
420420

421421
<h2 class="ui dividing header">States</h2>
422422

423-
<div class="example">
423+
<div class="no example">
424424
<h4 class="ui header">Active</h4>
425425
<p>An active modal is visible on the page</p>
426-
<div class="code" data-type="html">
426+
<div class="visible code" data-type="html">
427427
<div class="ui active modal"></div>
428428
</div>
429429
</div>
@@ -721,6 +721,11 @@ themes : ['Default', 'Material']
721721
<td>false</td>
722722
<td>If set to true will not close other visible modals when opening a new one</td>
723723
</tr>
724+
<tr>
725+
<td>keyboardShortcuts</td>
726+
<td>true</td>
727+
<td>Whether to automatically bind keyboard shortcuts</td>
728+
</tr>
724729
<tr>
725730
<td>offset</td>
726731
<td>0</td>

‎server/files/javascript/validate-form.js‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ semantic.validateForm.ready = function() {
88
$dogForm = $('.dog.example .ui.form'),
99
$matchingForm = $('.matching.example .ui.form'),
1010
$autoForm = $('.auto.example .ui.form'),
11+
$colorForm = $('.color.example .ui.form'),
1112
$promptForm = $('.prompt.example .ui.form'),
1213
$ruleForm = $('.custom.rule.example .ui.form'),
1314
$dropdownForm = $('.dropdown.example .ui.form'),
@@ -211,6 +212,20 @@ semantic.validateForm.ready = function() {
211212
})
212213
;
213214
*/
215+
216+
$colorForm.form({
217+
fields: {
218+
color: {
219+
identifier: 'color',
220+
rules: [{
221+
type: 'regExp',
222+
value: /rgb\((\d{1,3}), (\d{1,3}), (\d{1,3})\)/i,
223+
}]
224+
}
225+
}
226+
});
227+
228+
214229
$promptForm
215230
.form({
216231
fields: {

0 commit comments

Comments
 (0)