beenull/mini.css
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Tooltip component bug found and dealt with

Browse source
This commit is contained in:
Angelos Chalaris 2017-01-27 10:51:13 +02:00
parent 492ec55be4
commit 63bd62686b
5 changed files with 18 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
dist/mini-default.css vendored
View file

@ -1418,7 +1418,7 @@ mark {
content: '';
background: transparent;
border: 6px solid transparent;
left: calc(50% - $tooltip-tail-size); }
left: calc(50% - 6px); }
.tooltip:not(.bottom):before {
border-top-color: #212121; }
.tooltip.bottom:before {

2
dist/mini-default.min.css vendored
View file

File diff suppressed because one or more lines are too long

4
docs/v2/DEVLOG.md
View file

@ -781,3 +781,7 @@
- Added proper `tooltip` in the `default` flavor. Size now is `6.81KB`. Implementation of issue #41 is now completed.
- `DEVLOG.md` cleanup to make Markdown great again...
- Played with **hugging cat** to prepare it for the update.
## 20170127
- `tooltip` updated, dealing with a small misalignment bug in alterante styles.

10
docs/v2/demo.html
View file

@ -152,8 +152,16 @@
<li>File</li>
</ul>
</div>
<style>
.tooltip:before, .tooltip:after {
opacity: 1 !important;
clip: auto !important;
-webkit-clip-path: inset(0%) !important;
clip-path: inset(0%) !important;
}
}</style>
<div class="col-md-offset-1">
<mark class="tooltip test" aria-label="This is some sample tooltip text">Show a tooltip while hovering</mark><br /><br /><br />
<mark class="tooltip large" aria-label="This is some sample tooltip text">Show a tooltip while hovering</mark><br /><br /><br />
</div>
</div>

6
src/mini/_contextual.scss
View file

@ -226,7 +226,7 @@ $tooltip-bottom-name: 'bottom' !default; // Bottom tooltip class name
content: '';
background: transparent;
border: $tooltip-tail-size solid transparent;
left: calc(50% - $tooltip-tail-size);
left: calc(50% - #{$tooltip-tail-size});
}
&:not(.#{$tooltip-bottom-name}):before { // Top (default) tooltip styling
border-top-color: $tooltip-back-color;
@ -298,8 +298,8 @@ $tooltip-bottom-name: 'bottom' !default; // Bottom tooltip class name
.#{$tooltip-name}.#{$tooltip-alt-name} {
@if $tooltip-alt-tail-size != $tooltip-tail-size {
&:before {
border-width: $tooltip-tail-size;
left: calc(50% - $tooltip-alt-tail-size);
border-width: $tooltip-alt-tail-size;
left: calc(50% - #{$tooltip-alt-tail-size});
}
&:not(.#{$tooltip-bottom-name}):after { // Top (default) tooltip styling
margin-bottom: 2 * $tooltip-alt-tail-size;