Tooltip component bug found and dealt with
This commit is contained in:
parent
492ec55be4
commit
63bd62686b
2
dist/mini-default.css
vendored
2
dist/mini-default.css
vendored
|
@ -1418,7 +1418,7 @@ mark {
|
||||||
content: '';
|
content: '';
|
||||||
background: transparent;
|
background: transparent;
|
||||||
border: 6px solid transparent;
|
border: 6px solid transparent;
|
||||||
left: calc(50% - $tooltip-tail-size); }
|
left: calc(50% - 6px); }
|
||||||
.tooltip:not(.bottom):before {
|
.tooltip:not(.bottom):before {
|
||||||
border-top-color: #212121; }
|
border-top-color: #212121; }
|
||||||
.tooltip.bottom:before {
|
.tooltip.bottom:before {
|
||||||
|
|
2
dist/mini-default.min.css
vendored
2
dist/mini-default.min.css
vendored
File diff suppressed because one or more lines are too long
|
@ -781,3 +781,7 @@
|
||||||
- Added proper `tooltip` in the `default` flavor. Size now is `6.81KB`. Implementation of issue #41 is now completed.
|
- 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...
|
- `DEVLOG.md` cleanup to make Markdown great again...
|
||||||
- Played with **hugging cat** to prepare it for the update.
|
- Played with **hugging cat** to prepare it for the update.
|
||||||
|
|
||||||
|
## 20170127
|
||||||
|
|
||||||
|
- `tooltip` updated, dealing with a small misalignment bug in alterante styles.
|
||||||
|
|
|
@ -152,8 +152,16 @@
|
||||||
<li>File</li>
|
<li>File</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</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">
|
<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>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -226,7 +226,7 @@ $tooltip-bottom-name: 'bottom' !default; // Bottom tooltip class name
|
||||||
content: '';
|
content: '';
|
||||||
background: transparent;
|
background: transparent;
|
||||||
border: $tooltip-tail-size solid 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
|
&:not(.#{$tooltip-bottom-name}):before { // Top (default) tooltip styling
|
||||||
border-top-color: $tooltip-back-color;
|
border-top-color: $tooltip-back-color;
|
||||||
|
@ -298,8 +298,8 @@ $tooltip-bottom-name: 'bottom' !default; // Bottom tooltip class name
|
||||||
.#{$tooltip-name}.#{$tooltip-alt-name} {
|
.#{$tooltip-name}.#{$tooltip-alt-name} {
|
||||||
@if $tooltip-alt-tail-size != $tooltip-tail-size {
|
@if $tooltip-alt-tail-size != $tooltip-tail-size {
|
||||||
&:before {
|
&:before {
|
||||||
border-width: $tooltip-tail-size;
|
border-width: $tooltip-alt-tail-size;
|
||||||
left: calc(50% - $tooltip-alt-tail-size);
|
left: calc(50% - #{$tooltip-alt-tail-size});
|
||||||
}
|
}
|
||||||
&:not(.#{$tooltip-bottom-name}):after { // Top (default) tooltip styling
|
&:not(.#{$tooltip-bottom-name}):after { // Top (default) tooltip styling
|
||||||
margin-bottom: 2 * $tooltip-alt-tail-size;
|
margin-bottom: 2 * $tooltip-alt-tail-size;
|
||||||
|
|
Loading…
Reference in a new issue