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

View File

@ -82,7 +82,7 @@ doc-subtab: pagination
{% capture pagination_options_example %}
<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>
<ul class="pagination-list">
<li>

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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