lukechilds
/
Semantic-UI-Docs
mirror of https://github.com/lukechilds/Semantic-UI-Docs.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Update to checkbox docs

redesign
jlukic 10 years ago
parent
3e54c9bc02
commit
70417febe8
6 changed files with 66 additions and 24 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 28
      server/documents/collections/form.html.eco
  2. 2
      server/documents/elements/container.html.eco
  3. 41
      server/documents/modules/checkbox.html.eco
  4. 15
      server/documents/modules/dropdown.html.eco
  5. 2
      server/documents/views/card.html.eco
  6. 2
      server/files/stylesheets/docs.css

28
server/documents/collections/form.html.eco
View File

@ -400,23 +400,23 @@ themes : ['Default', 'Flat', 'Chubby', 'GitHub']
<input type="text" name="cvc" maxlength="3" placeholder="CVC">
</div>
<div class="six wide field">
<label>Expiration Date</label>
<label>Expiration</label>
<div class="two fields">
<div class="field">
<select class="ui fluid search dropdown" name="expire-month">
<option value="">Month</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="1">January</option>
<option value="2">February</option>
<option value="3">March</option>
<option value="4">April</option>
<option value="5">May</option>
<option value="6">June</option>
<option value="7">July</option>
<option value="8">August</option>
<option value="9">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option>
</select>
</div>
<div class="field">
@ -463,7 +463,7 @@ themes : ['Default', 'Flat', 'Chubby', 'GitHub']
</div>
</div>
<div class="ui secondary segment">
<div class="ui raised segment">
<div class="field">
<div class="ui toggle checkbox">
<input type="checkbox" name="gift">

2
server/documents/elements/container.html.eco
View File

@ -1,6 +1,6 @@
---
layout : 'default'
css : 'basic'
css : 'basic minimal'
element : 'container'
elementType : 'element'
standalone : true

41
server/documents/modules/checkbox.html.eco
View File

@ -3,6 +3,7 @@ layout : 'default'
css : 'checkbox'
element : 'checkbox'
elementType : 'module'
standalone : true
title : 'Checkbox'
description : "A checkbox allows a user to select a value from a small set of options, often binary"
@ -40,6 +41,38 @@ themes : ['Default', 'Colored']
</div>
</div>
<div class="another example">
<div class="ui form">
<div class="grouped fields">
<div class="field">
<label>Outbound Throughput</label>
<div class="ui slider checkbox">
<input type="radio" name="throughput" checked="checked">
<label>20 mbps max</label>
</div>
</div>
<div class="field">
<div class="ui slider checkbox">
<input type="radio" name="throughput">
<label>10mbps max</label>
</div>
</div>
<div class="field">
<div class="ui slider checkbox">
<input type="radio" name="throughput">
<label>5mbps max</label>
</div>
</div>
<div class="field">
<div class="ui slider checkbox checked">
<input type="radio" name="throughput">
<label>Unmetered</label>
</div>
</div>
</div>
</div>
</div>
<div class="example">
<h4 class="ui header">Toggle</h4>
<p>A checkbox can be formatted to show an on or off choice</p>
@ -58,25 +91,25 @@ themes : ['Default', 'Colored']
<div class="grouped inline fields">
<div class="field">
<div class="ui radio checkbox">
<input type="radio" name="fruit" checked="checked" />
<input type="radio" name="frequency" checked="checked" />
<label>Once a week</label>
</div>
</div>
<div class="field">
<div class="ui radio checkbox">
<input type="radio" name="fruit" />
<input type="radio" name="frequency" />
<label>2-3 times a week</label>
</div>
</div>
<div class="field">
<div class="ui radio checkbox">
<input type="radio" name="fruit" />
<input type="radio" name="frequency" />
<label>Once a day</label>
</div>
</div>
<div class="field">
<div class="ui radio checkbox">
<input type="radio" name="fruit" />
<input type="radio" name="frequency" />
<label>Twice a day</label>
</div>
</div>

15
server/documents/modules/dropdown.html.eco
View File

@ -1020,9 +1020,8 @@ themes : ['Default', 'Material']
<div class="example">
<h4 class="ui header">Disabled</h4>
<p>A disabled dropdown menu will not open or close</p>
<div class="ui ignored info message">A disabled state will prevent all dropdowns from allowing the menu to open.</div>
<div class="ui simple disabled dropdown">
<p>A disabled dropdown menu or item does not allow user interaction</p>
<div class="ui disabled dropdown">
Dropdown <i class="dropdown icon"></i>
<div class="menu">
<div class="item">Choice 1</div>
@ -1031,6 +1030,16 @@ themes : ['Default', 'Material']
</div>
</div>
</div>
<div class="another dropdown example">
<div class="ui dropdown">
Disabled Item <i class="dropdown icon"></i>
<div class="menu">
<div class="item">Choice 1</div>
<div class="disabled item">Disabled</div>
<div class="item">Choice 3</div>
</div>
</div>
</div>
<h2 class="ui dividing header">Variations</h2>

2
server/documents/views/card.html.eco
View File

@ -1,6 +1,6 @@
---
layout : 'default'
css : 'basic card'
css : 'card'
standalone : true
element : 'card'

2
server/files/stylesheets/docs.css
View File

@ -2019,7 +2019,7 @@ body.progress.animated .ui.progress .bar {
margin-left: 4em !important;
margin-right: 4em !important;
width: auto !important;
max-width: 1200px !important;
max-width: 960px !important;
}
#example .masthead > .container,
#example .main.container {

Write Preview
Loading…
Cancel
Save