aboutsummaryrefslogtreecommitdiff
path: root/themes/hugo-whisper-theme/assets/scss/bootstrap/_tooltip.scss
diff options
context:
space:
mode:
authorQuentin Dufour <quentin@deuxfleurs.fr>2021-10-01 14:32:43 +0200
committerQuentin Dufour <quentin@deuxfleurs.fr>2021-10-01 14:32:43 +0200
commit9ccf652c00457e46eaf46fc4cb8f6d0ee582c5ef (patch)
treeb02c0a9a15de80acb3661163d469da41cd6aa8c3 /themes/hugo-whisper-theme/assets/scss/bootstrap/_tooltip.scss
downloadrfid-9ccf652c00457e46eaf46fc4cb8f6d0ee582c5ef.tar.gz
rfid-9ccf652c00457e46eaf46fc4cb8f6d0ee582c5ef.zip
Initial commit
Diffstat (limited to 'themes/hugo-whisper-theme/assets/scss/bootstrap/_tooltip.scss')
-rwxr-xr-xthemes/hugo-whisper-theme/assets/scss/bootstrap/_tooltip.scss115
1 files changed, 115 insertions, 0 deletions
diff --git a/themes/hugo-whisper-theme/assets/scss/bootstrap/_tooltip.scss b/themes/hugo-whisper-theme/assets/scss/bootstrap/_tooltip.scss
new file mode 100755
index 0000000..6b3aa62
--- /dev/null
+++ b/themes/hugo-whisper-theme/assets/scss/bootstrap/_tooltip.scss
@@ -0,0 +1,115 @@
+// Base class
+.tooltip {
+ position: absolute;
+ z-index: $zindex-tooltip;
+ display: block;
+ margin: $tooltip-margin;
+ // Our parent element can be arbitrary since tooltips are by default inserted as a sibling of their target element.
+ // So reset our font and text properties to avoid inheriting weird values.
+ @include reset-text();
+ @include font-size($tooltip-font-size);
+ // Allow breaking very long words so they don't overflow the tooltip's bounds
+ word-wrap: break-word;
+ opacity: 0;
+
+ &.show { opacity: $tooltip-opacity; }
+
+ .arrow {
+ position: absolute;
+ display: block;
+ width: $tooltip-arrow-width;
+ height: $tooltip-arrow-height;
+
+ &::before {
+ position: absolute;
+ content: "";
+ border-color: transparent;
+ border-style: solid;
+ }
+ }
+}
+
+.bs-tooltip-top {
+ padding: $tooltip-arrow-height 0;
+
+ .arrow {
+ bottom: 0;
+
+ &::before {
+ top: 0;
+ border-width: $tooltip-arrow-height ($tooltip-arrow-width / 2) 0;
+ border-top-color: $tooltip-arrow-color;
+ }
+ }
+}
+
+.bs-tooltip-right {
+ padding: 0 $tooltip-arrow-height;
+
+ .arrow {
+ left: 0;
+ width: $tooltip-arrow-height;
+ height: $tooltip-arrow-width;
+
+ &::before {
+ right: 0;
+ border-width: ($tooltip-arrow-width / 2) $tooltip-arrow-height ($tooltip-arrow-width / 2) 0;
+ border-right-color: $tooltip-arrow-color;
+ }
+ }
+}
+
+.bs-tooltip-bottom {
+ padding: $tooltip-arrow-height 0;
+
+ .arrow {
+ top: 0;
+
+ &::before {
+ bottom: 0;
+ border-width: 0 ($tooltip-arrow-width / 2) $tooltip-arrow-height;
+ border-bottom-color: $tooltip-arrow-color;
+ }
+ }
+}
+
+.bs-tooltip-left {
+ padding: 0 $tooltip-arrow-height;
+
+ .arrow {
+ right: 0;
+ width: $tooltip-arrow-height;
+ height: $tooltip-arrow-width;
+
+ &::before {
+ left: 0;
+ border-width: ($tooltip-arrow-width / 2) 0 ($tooltip-arrow-width / 2) $tooltip-arrow-height;
+ border-left-color: $tooltip-arrow-color;
+ }
+ }
+}
+
+.bs-tooltip-auto {
+ &[x-placement^="top"] {
+ @extend .bs-tooltip-top;
+ }
+ &[x-placement^="right"] {
+ @extend .bs-tooltip-right;
+ }
+ &[x-placement^="bottom"] {
+ @extend .bs-tooltip-bottom;
+ }
+ &[x-placement^="left"] {
+ @extend .bs-tooltip-left;
+ }
+}
+
+// Wrapper for the tooltip content
+.tooltip-inner {
+ max-width: $tooltip-max-width;
+ padding: $tooltip-padding-y $tooltip-padding-x;
+ color: $tooltip-color;
+ text-align: center;
+ background-color: $tooltip-bg;
+ @include border-radius($tooltip-border-radius);
+}