library-mirrors/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma.git synced 2024-11-14 11:14:24 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fix #1236

Browse Source
This commit is contained in:
Jeremy Thomas 2017-10-07 16:57:19 +01:00
parent f23012edbd
commit fc5ddd473c
7 changed files with 116 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.github/ISSUE_TEMPLATE.md vendored
View File

@ -1,5 +1,8 @@
<!-- PLEASE READ THE FOLLOWING INSTRUCTIONS -->
<!-- Choose one of the following: -->
This is about **Bulma | the Docs**.
<!-- Is it about Bulma or about the Docs? -->
<!-- Is it a bug/feature/question or do you need help? -->
<!-- If it's a bug, is it a browser bug? -->

14
.github/PULL_REQUEST_TEMPLATE.md vendored
View File

@ -1,6 +1,12 @@
<!-- PLEASE READ THE FOLLOWING INSTRUCTIONS -->
<!-- DO NOT REBUILD THE CSS OUTPUT IN YOUR PR -->
<!-- Choose one of the following: -->
This is a **new feature | improvement | bugfix | documentation fix**.
<!-- New feature? Update the CHANGELOG.md too, and eventually the Docs. -->
<!-- Improvement? Explain how and why. -->
<!-- Bugfix? Reference that issue as well. -->
### Proposed solution
<!-- Which specific problem does this PR solve and how? -->
<!-- If it fixes a particular Issue, add "Fixes #ISSUE_NUMBER" in your title -->
@ -9,14 +15,14 @@
<!-- What are the drawbacks of this solution? Are there alternative ones? -->
<!-- Think of performance, build time, usability, complexity, coupling…) -->
### Testing Done
<!-- How have you confirmed this feature works? -->
<!-- Please explain more than "Yes". -->
<!-- BEFORE SUBMITTING YOUR PR, MAKE SURE TO FOLLOW THESE STEPS: -->
<!-- 1. Pull the latest `master` branch -->
<!-- 2. Run `npm install` to install all Bulma dependencies -->
<!-- 3. Make sure your Sass code is compliant with the [Bulma Sass styleguide](https://github.com/jgthms/bulma/blob/master/.github/CONTRIBUTING.md#bulma-sass-styleguide) -->
<!-- 4. If your PR fixes an issue, reference that issue -->
<!-- 5. If your PR has lots of commits, **rebase** first -->
<!-- 6. Your PR should only affect `.sass` and documentation files -->
<!-- 4. Make sure your PR only affects `.sass` or documentation files -->
<!-- Thanks! -->

6
CHANGELOG.md
View File

@ -1,5 +1,11 @@
# Bulma Changelog
## 0.5.4
### New features
* #1236 `.table` hover effect is opt-in, by using the `.is-hoverable` modifier class
## 0.5.3
### New features

52
docs/css/bulma-docs.css
View File

@ -2591,6 +2591,26 @@ a.box:active {
cursor: not-allowed;
}
.input::-moz-placeholder,
.textarea::-moz-placeholder {
color: rgba(54, 54, 54, 0.3);
}
.input::-webkit-input-placeholder,
.textarea::-webkit-input-placeholder {
color: rgba(54, 54, 54, 0.3);
}
.input:-moz-placeholder,
.textarea:-moz-placeholder {
color: rgba(54, 54, 54, 0.3);
}
.input:-ms-input-placeholder,
.textarea:-ms-input-placeholder {
color: rgba(54, 54, 54, 0.3);
}
.input:hover, .input.is-hovered,
.textarea:hover,
.textarea.is-hovered {
@ -2931,6 +2951,22 @@ a.box:active {
cursor: not-allowed;
}
.select select::-moz-placeholder {
color: rgba(54, 54, 54, 0.3);
}
.select select::-webkit-input-placeholder {
color: rgba(54, 54, 54, 0.3);
}
.select select:-moz-placeholder {
color: rgba(54, 54, 54, 0.3);
}
.select select:-ms-input-placeholder {
color: rgba(54, 54, 54, 0.3);
}
.select select:hover, .select select.is-hovered {
border-color: #b5b5b5;
}
@ -4427,10 +4463,6 @@ a.box:active {
text-align: left;
}
.table tr:hover {
background-color: #fafafa;
}
.table tr.is-selected {
background-color: #00d1b2;
color: #fff;
@ -4478,6 +4510,14 @@ a.box:active {
width: 100%;
}
.table.is-hoverable tbody tr:hover {
background-color: #fafafa;
}
.table.is-hoverable.is-striped tbody tr:not(.is-selected):hover {
background-color: whitesmoke;
}
.table.is-narrow td,
.table.is-narrow th {
padding: 0.25em 0.5em;
@ -4487,10 +4527,6 @@ a.box:active {
background-color: #fafafa;
}
.table.is-striped tbody tr:not(.is-selected):nth-child(even):hover {
background-color: whitesmoke;
}
.tags {
-webkit-box-align: center;
-ms-flex-align: center;

2
docs/css/bulma-docs.css.map
View File

File diff suppressed because one or more lines are too long

43
docs/documentation/elements/table.html
View File

@ -506,6 +506,47 @@ variables:
</div>
</div>
<div class="columns">
<div class="column">
<p>You can add a <strong>hover effect</strong> on each row</p>
</div>
<div class="column">
<code>table is-hoverable</code>
</div>
<div class="column is-half">
<table class="table is-hoverable">
<thead>
<tr>
<th>One</th>
<th>Two</th>
</tr>
</thead>
<tbody>
<tr>
<td>Three</td>
<td>Four</td>
</tr>
<tr>
<td>Five</td>
<td>Six</td>
</tr>
<tr>
<td>Seven</td>
<td>Eight</td>
</tr>
<tr>
<td>Nine</td>
<td>Ten</td>
</tr>
<tr>
<td>Eleven</td>
<td>Twelve</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="columns">
<div class="column">
<p>You can have a <strong>fullwidth</strong> table.</p>
@ -555,7 +596,7 @@ variables:
<code>table is-bordered is-striped is-narrow is-fullwidth</code>
</div>
<div class="column is-half">
<table class="table is-bordered is-striped is-narrow is-fullwidth">
<table class="table is-bordered is-striped is-narrow is-hoverable is-fullwidth">
<thead>
<tr>
<th>One</th>

14
sass/elements/table.sass
View File

@ -45,8 +45,6 @@ $table-striped-row-even-hover-background-color: $white-ter !default
color: $table-cell-heading-color
text-align: left
tr
&:hover
background-color: $table-row-hover-background-color
&.is-selected
background-color: $table-row-active-background-color
color: $table-row-active-color
@ -85,6 +83,16 @@ $table-striped-row-even-hover-background-color: $white-ter !default
border-bottom-width: 1px
&.is-fullwidth
width: 100%
&.is-hoverable
tbody
tr
&:hover
background-color: $table-row-hover-background-color
&.is-striped
tbody
tr:not(.is-selected)
&:hover
background-color: $table-striped-row-even-hover-background-color
&.is-narrow
td,
th
@ -94,5 +102,3 @@ $table-striped-row-even-hover-background-color: $white-ter !default
tr:not(.is-selected)
&:nth-child(even)
background-color: $table-striped-row-even-background-color
&:hover
background-color: $table-striped-row-even-hover-background-color