Fix disabled controls, Fix disabled pagination

This commit is contained in:
Jeremy Thomas 2017-03-31 22:36:47 +01:00
parent 2c6aabcde7
commit f49f8d6a22
9 changed files with 21 additions and 17 deletions

View File

@ -195,6 +195,7 @@ pre {
} }
pre code { pre code {
-webkit-overflow-scrolling: touch;
background: none; background: none;
color: inherit; color: inherit;
display: block; display: block;
@ -1972,6 +1973,7 @@ input[type="submit"].button {
.checkbox[disabled], .checkbox[disabled],
.radio[disabled] { .radio[disabled] {
color: #7a7a7a; color: #7a7a7a;
cursor: not-allowed;
} }
.radio + .radio { .radio + .radio {
@ -4079,7 +4081,9 @@ a.nav-item.is-tab.is-active {
.pagination-previous[disabled], .pagination-previous[disabled],
.pagination-next[disabled], .pagination-next[disabled],
.pagination-link[disabled] { .pagination-link[disabled] {
background: #dbdbdb; background-color: #dbdbdb;
border-color: #dbdbdb;
box-shadow: none;
color: #7a7a7a; color: #7a7a7a;
opacity: 0.5; opacity: 0.5;
} }

View File

@ -82,7 +82,7 @@ doc-subtab: pagination
{% capture pagination_options_example %} {% capture pagination_options_example %}
<nav class="pagination"> <nav class="pagination">
<a class="pagination-previous is-disabled">Previous</a> <a class="pagination-previous" title="This is the first page" disabled>Previous</a>
<a class="pagination-next">Next page</a> <a class="pagination-next">Next page</a>
<ul class="pagination-list"> <ul class="pagination-list">
<li> <li>

View File

@ -353,7 +353,7 @@ doc-subtab: form
</div> </div>
<div class="field"> <div class="field">
<p class="control"> <p class="control">
<label class="checkbox is-disabled"> <label class="checkbox" disabled>
<input type="checkbox" disabled> <input type="checkbox" disabled>
Remember me Remember me
</label> </label>
@ -361,11 +361,11 @@ doc-subtab: form
</div> </div>
<div class="field"> <div class="field">
<p class="control"> <p class="control">
<label class="radio is-disabled"> <label class="radio" disabled>
<input type="radio" name="question" disabled> <input type="radio" name="question" disabled>
Yes Yes
</label> </label>
<label class="radio is-disabled"> <label class="radio" disabled>
<input type="radio" name="question" disabled> <input type="radio" name="question" disabled>
No No
</label> </label>

View File

@ -50,11 +50,7 @@ doc-subtab: helpers
<td>Text is right-aligned</td> <td>Text is right-aligned</td>
</tr> </tr>
<tr> <tr>
<th rowspan="4">Other</th> <th rowspan="3">Other</th>
<td><code>is-disabled</code></td>
<td>Removes any <strong>click</strong> event</td>
</tr>
<tr>
<td><code>is-marginless</code></td> <td><code>is-marginless</code></td>
<td>Removes any <strong>margin</strong></td> <td>Removes any <strong>margin</strong></td>
</tr> </tr>

View File

@ -152,7 +152,7 @@ doc-subtab: syntax
<ul> <ul>
<li><code>is-outlined</code></li> <li><code>is-outlined</code></li>
<li><code>is-loading</code></li> <li><code>is-loading</code></li>
<li><code>is-disabled</code></li> <li><code>[disabled]</code></li>
</ul> </ul>
</div> </div>
</div> </div>
@ -164,7 +164,7 @@ doc-subtab: syntax
<a class="button is-primary is-loading">Button</a> <a class="button is-primary is-loading">Button</a>
</p> </p>
<p class="field"> <p class="field">
<a class="button is-primary is-disabled">Button</a> <a class="button is-primary" disabled>Button</a>
</p> </p>
</div> </div>
<div class="column is-half"> <div class="column is-half">
@ -175,7 +175,7 @@ doc-subtab: syntax
<a class="button is-primary is-loading"> <a class="button is-primary is-loading">
Button Button
</a> </a>
<a class="button is-primary is-disabled"> <a class="button is-primary" disabled>
Button Button
</a> </a>
{% endhighlight %} {% endhighlight %}

View File

@ -73,8 +73,8 @@ doc-subtab: modular
<code>.is-link</code> <code>.is-link</code>
</li> </li>
<li> <li>
<code>.is-disabled</code>, <code>.is-loading</code>,
<code>.is-loading</code> <code>[disabled]</code>
</li> </li>
</ul> </ul>
{% highlight html %} {% highlight html %}

View File

@ -6,7 +6,7 @@ html
min-width: 300px min-width: 300px
overflow-x: hidden overflow-x: hidden
overflow-y: scroll overflow-y: scroll
text-rendering: $render-mode text-rendering: $render-mode
article, article,
aside, aside,
@ -87,6 +87,7 @@ pre
white-space: pre white-space: pre
word-wrap: normal word-wrap: normal
code code
+overflow-touch
background: none background: none
color: inherit color: inherit
display: block display: block

View File

@ -65,7 +65,9 @@ $pagination-shadow-inset: inset 0 1px 2px rgba($black, 0.2)
&:active &:active
box-shadow: $pagination-shadow-inset box-shadow: $pagination-shadow-inset
&[disabled] &[disabled]
background: $pagination-disabled-background background-color: $pagination-disabled-background
border-color: $pagination-border
box-shadow: none
color: $pagination-disabled color: $pagination-disabled
opacity: 0.5 opacity: 0.5

View File

@ -94,6 +94,7 @@ $input-radius: $radius !default
color: $input-hover color: $input-hover
&[disabled] &[disabled]
color: $input-disabled color: $input-disabled
cursor: not-allowed
.radio .radio
& + .radio & + .radio