Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update some Button markups, Dropdowns and Subnav in claycss | Fixes #613 #614

Merged
merged 3 commits into from
Feb 22, 2018
Merged

Update some Button markups, Dropdowns and Subnav in claycss | Fixes #613 #614

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
bcb721d
Update Button markup on claycss | Fixes #613
matuzalemsteles Feb 21, 2018
c517b04
Update Dropdown markup | Fixes #613
matuzalemsteles Feb 21, 2018
175921e
Update Subnav markup | Fixes #613
matuzalemsteles Feb 21, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 10 additions & 6 deletions packages/claycss.com/src/pages/docs/components/buttons.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -258,9 +258,11 @@ weight: 100
> This button type is used only in sites and not in administration. The icon emphasizes and helps to understand the action. The label must be the same icon purpose.

<button class="btn btn-secondary" type="button">
<svg aria-hidden="true" class="lexicon-icon lexicon-icon-blogs">
<use xlink:href="/vendor/lexicon/icons.svg#share"></use>
</svg>
<span class="inline-item inline-item-before">
<svg aria-hidden="true" class="lexicon-icon lexicon-icon-blogs">
<use xlink:href="/vendor/lexicon/icons.svg#share"></use>
</svg>
</span>
Share
</button>

Expand All @@ -282,9 +284,11 @@ weight: 100
```
```text/html
<button class="btn btn-secondary" type="button">
<svg aria-hidden="true" class="lexicon-icon lexicon-icon-blogs">
<use xlink:href="/vendor/lexicon/icons.svg#share"></use>
</svg>
<span class="inline-item inline-item-before">
<svg aria-hidden="true" class="lexicon-icon lexicon-icon-blogs">
<use xlink:href="/vendor/lexicon/icons.svg#share"></use>
</svg>
</span>
Share
</button>
```
Expand Down
116 changes: 41 additions & 75 deletions packages/claycss.com/src/pages/docs/components/dropdowns.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -78,23 +78,15 @@ weight: 100
<ul class="list-unstyled">
<li><a class="dropdown-item" href="#1">Edit</a></li>
<li><a class="dropdown-item" href="#2">Preview</a></li>
</ul>
<div class="dropdown-divider"></div>
<ul class="list-unstyled">
<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
<li><a class="dropdown-item" href="#3">Expire</a></li>
<li><a class="dropdown-item" href="#4">View History</a></li>
</ul>
<div class="dropdown-divider"></div>
<ul class="list-unstyled">
<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
<li><a class="dropdown-item" href="#5">Permissions</a></li>
</ul>
<div class="dropdown-divider"></div>
<ul class="list-unstyled">
<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
<li><a class="dropdown-item" href="#6">Copy</a></li>
<li><a class="dropdown-item" href="#7">Move</a></li>
</ul>
<div class="dropdown-divider"></div>
<ul class="list-unstyled">
<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
<li><a class="dropdown-item" href="#8">Move to Recycle Bin</a></li>
</ul>
</div>
Expand Down Expand Up @@ -156,23 +148,15 @@ weight: 100
<ul class="list-unstyled">
<li><a class="dropdown-item" href="#1">Edit</a></li>
<li><a class="dropdown-item" href="#2">Preview</a></li>
</ul>
<div class="dropdown-divider"></div>
<ul class="list-unstyled">
<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
<li><a class="dropdown-item" href="#3">Expire</a></li>
<li><a class="dropdown-item" href="#4">View History</a></li>
</ul>
<div class="dropdown-divider"></div>
<ul class="list-unstyled">
<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
<li><a class="dropdown-item" href="#5">Permissions</a></li>
</ul>
<div class="dropdown-divider"></div>
<ul class="list-unstyled">
<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
<li><a class="dropdown-item" href="#6">Copy</a></li>
<li><a class="dropdown-item" href="#7">Move</a></li>
</ul>
<div class="dropdown-divider"></div>
<ul class="list-unstyled">
<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
<li><a class="dropdown-item" href="#8">Move to Recycle Bin</a></li>
</ul>
</div>
Expand Down Expand Up @@ -205,10 +189,10 @@ weight: 100
</label>
</div>
</li>
<li class="disabled dropdown-item">
<li class="dropdown-item">
<div class="custom-control custom-checkbox">
<label>
<input disabled class="custom-control-input" type="checkbox">
<input disabled="disabled" class="custom-control-input" type="checkbox">
<span class="custom-control-label">
<span class="custom-control-label-text">Disabled Option</span>
</span>
Expand Down Expand Up @@ -278,10 +262,10 @@ weight: 100
</label>
</div>
</li>
<li class="disabled dropdown-item">
<li class="dropdown-item">
<div class="custom-control custom-checkbox">
<label>
<input disabled class="custom-control-input" type="checkbox">
<input disabled="disabled" class="custom-control-input" type="checkbox">
<span class="custom-control-label">
<span class="custom-control-label-text">Disabled Option</span>
</span>
Expand Down Expand Up @@ -369,10 +353,12 @@ weight: 100
</div>
</div>
</div>
<a class="active dropdown-item" href="#1">Selected Option</a>
<a class="dropdown-item" href="#2">Normal Option</a>
<a class="disabled dropdown-item" href="#3">Disabled Option</a>
</form>
<ul class="list-unstyled">
<li><a class="active dropdown-item" href="#1">Selected Option</a></li>
<li><a class="dropdown-item" href="#2">Normal Option</a></li>
<li><a class="disabled dropdown-item" href="#3">Disabled Option</a></li>
</ul>
</div>
```

Expand Down Expand Up @@ -404,7 +390,7 @@ weight: 100
</a>
</li>
<li>
<a class="disabled dropdown-item" href="#1">Disabled Option</a>
<a class="disabled dropdown-item" href="javascript:;">Disabled Option</a>
</li>
</ul>
</div>
Expand Down Expand Up @@ -466,7 +452,7 @@ weight: 100
</a>
</li>
<li>
<a class="disabled dropdown-item" href="#1">Disabled Option</a>
<a class="disabled dropdown-item" href="javascript:;">Disabled Option</a>
</li>
</ul>
</div>
Expand Down Expand Up @@ -500,7 +486,7 @@ weight: 100
</a>
</li>
<li>
<a class="disabled dropdown-item" href="#1">Disabled Option</a>
<a class="disabled dropdown-item" href="javascript:;">Disabled Option</a>
</li>
</ul>
</div>
Expand Down Expand Up @@ -563,7 +549,7 @@ weight: 100
</a>
</li>
<li>
<a class="disabled dropdown-item" href="#1">Disabled Option</a>
<a class="disabled dropdown-item" href="javascript:;">Disabled Option</a>
</li>
</ul>
</div>
Expand Down Expand Up @@ -595,8 +581,8 @@ weight: 100
</form>
<form>
<div class="inline-scroller">
<div class="dropdown-subheader">Filter by</div>
<ul class="list-unstyled">
<li class="dropdown-subheader" role="presentation">Filter by</li>
<li class="active dropdown-item">
<div class="custom-control custom-checkbox">
<label>
Expand All @@ -617,19 +603,17 @@ weight: 100
</label>
</div>
</li>
<li class="disabled dropdown-item">
<li class="dropdown-item">
<div class="custom-control custom-checkbox">
<label>
<input disabled class="custom-control-input" type="checkbox">
<input disabled="disabled" class="custom-control-input" type="checkbox">
<span class="custom-control-label">
<span class="custom-control-label-text">Disabled Option</span>
</span>
</label>
</div>
</li>
</ul>
<div class="dropdown-subheader">Order by</div>
<ul class="list-unstyled">
<li class="dropdown-subheader" role="presentation">Order by</li>
<li class="active dropdown-item">
<div class="custom-control custom-radio">
<label>
Expand All @@ -650,10 +634,10 @@ weight: 100
</label>
</div>
</li>
<li class="disabled dropdown-item">
<li class="dropdown-item">
<div class="custom-control custom-radio">
<label>
<input disabled class="custom-control-input" id="dropdownRadio3" name="dropdownRadio" type="radio">
<input disabled="disabled" class="custom-control-input" id="dropdownRadio3" name="dropdownRadio" type="radio">
<span class="custom-control-label">
<span class="custom-control-label-text">Disabled Option</span>
</span>
Expand Down Expand Up @@ -813,8 +797,8 @@ weight: 100
</form>
<form>
<div class="inline-scroller">
<div class="dropdown-subheader">Filter by</div>
<ul class="list-unstyled">
<li class="dropdown-subheader" role="presentation">Filter by</li>
<li class="active dropdown-item">
<div class="custom-control custom-checkbox">
<label>
Expand All @@ -835,19 +819,17 @@ weight: 100
</label>
</div>
</li>
<li class="disabled dropdown-item">
<li class="dropdown-item">
<div class="custom-control custom-checkbox">
<label>
<input disabled class="custom-control-input" type="checkbox">
<input disabled="disabled" class="custom-control-input" type="checkbox">
<span class="custom-control-label">
<span class="custom-control-label-text">Disabled Option</span>
</span>
</label>
</div>
</li>
</ul>
<div class="dropdown-subheader">Order by</div>
<ul class="list-unstyled">
<li class="dropdown-subheader" role="presentation">Order by</li>
<li class="active dropdown-item">
<div class="custom-control custom-radio">
<label>
Expand All @@ -868,10 +850,10 @@ weight: 100
</label>
</div>
</li>
<li class="disabled dropdown-item">
<li class="dropdown-item">
<div class="custom-control custom-radio">
<label>
<input disabled class="custom-control-input" id="dropdownRadio3" name="dropdownRadio" type="radio">
<input disabled="disabled" class="custom-control-input" id="dropdownRadio3" name="dropdownRadio" type="radio">
<span class="custom-control-label">
<span class="custom-control-label-text">Disabled Option</span>
</span>
Expand Down Expand Up @@ -907,23 +889,15 @@ weight: 100
<ul class="list-unstyled">
<li><a class="dropdown-item" href="#1">Edit</a></li>
<li><a class="dropdown-item" href="#1">Preview</a></li>
</ul>
<div class="dropdown-divider"></div>
<ul class="list-unstyled">
<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
<li><a class="dropdown-item" href="#1">Expire</a></li>
<li><a class="dropdown-item" href="#1">View History</a></li>
</ul>
<div class="dropdown-divider"></div>
<ul class="list-unstyled">
<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
<li><a class="dropdown-item" href="#1">Permissions</a></li>
</ul>
<div class="dropdown-divider"></div>
<ul class="list-unstyled">
<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
<li><a class="dropdown-item" href="#1">Copy</a></li>
<li><a class="dropdown-item" href="#1">Move</a></li>
</ul>
<div class="dropdown-divider"></div>
<ul class="list-unstyled">
<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
<li><a class="dropdown-item" href="#1">Move to Recycle Bin</a></li>
</ul>
</div>
Expand Down Expand Up @@ -1076,23 +1050,15 @@ weight: 100
<ul class="list-unstyled">
<li><a class="dropdown-item" href="#1">Edit</a></li>
<li><a class="dropdown-item" href="#1">Preview</a></li>
</ul>
<div class="dropdown-divider"></div>
<ul class="list-unstyled">
<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
<li><a class="dropdown-item" href="#1">Expire</a></li>
<li><a class="dropdown-item" href="#1">View History</a></li>
</ul>
<div class="dropdown-divider"></div>
<ul class="list-unstyled">
<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
<li><a class="dropdown-item" href="#1">Permissions</a></li>
</ul>
<div class="dropdown-divider"></div>
<ul class="list-unstyled">
<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
<li><a class="dropdown-item" href="#1">Copy</a></li>
<li><a class="dropdown-item" href="#1">Move</a></li>
</ul>
<div class="dropdown-divider"></div>
<ul class="list-unstyled">
<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
<li><a class="dropdown-item" href="#1">Move to Recycle Bin</a></li>
</ul>
</div>
Expand Down
Loading