diff options
| author | John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com> | 2016-12-22 11:18:47 +0100 |
|---|---|---|
| committer | Roeland Jago Douma <roeland@famdouma.nl> | 2017-01-06 09:42:15 +0100 |
| commit | 1c128e93913caa350be3c4274c73b28eaddc6a90 (patch) | |
| tree | ba2c4922ceca8f3c3c8dbdacbf24d0dd412f61fb | |
| parent | 5b302a9a67830d81935cb16cb9839abc4e3ebf75 (diff) | |
| download | nextcloud-server-1c128e93913caa350be3c4274c73b28eaddc6a90.tar.gz nextcloud-server-1c128e93913caa350be3c4274c73b28eaddc6a90.zip | |
Tooltip scss
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
| -rw-r--r-- | core/css/tooltip.scss | 125 |
1 files changed, 125 insertions, 0 deletions
diff --git a/core/css/tooltip.scss b/core/css/tooltip.scss new file mode 100644 index 00000000000..42289787e8d --- /dev/null +++ b/core/css/tooltip.scss @@ -0,0 +1,125 @@ +/*! + * Bootstrap v3.3.5 (http://getbootstrap.com) + * Copyright 2011-2015 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + */ + +.tooltip { + position: absolute; + display: block; + font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; + font-style: normal; + font-weight: normal; + letter-spacing: normal; + line-break: auto; + line-height: 1.42857143; + text-align: left; + text-align: start; + text-decoration: none; + text-shadow: none; + text-transform: none; + white-space: normal; + word-break: normal; + word-spacing: normal; + word-wrap: normal; + font-size: 12px; + opacity: 0; + z-index: 100000; + filter: alpha(opacity = 0); + &.in { + opacity: 0.9; + filter: alpha(opacity = 90); + } + &.top { + margin-top: -3px; + padding: 5px 0; + } + &.right { + margin-left: 3px; + padding: 0 5px; + } + &.bottom { + margin-top: 3px; + padding: 5px 0; + } + &.left { + margin-left: -3px; + padding: 0 5px; + } +} + +.tooltip-inner { + max-width: 350px; + padding: 3px 8px; + color: #ffffff; + text-align: center; + background-color: #000000; + border-radius: 4px; +} + +.tooltip-arrow { + position: absolute; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; +} + +.tooltip { + &.top .tooltip-arrow { + bottom: 0; + left: 50%; + margin-left: -5px; + border-width: 5px 5px 0; + border-top-color: #000000; + } + &.top-left .tooltip-arrow { + bottom: 0; + right: 5px; + margin-bottom: -5px; + border-width: 5px 5px 0; + border-top-color: #000000; + } + &.top-right .tooltip-arrow { + bottom: 0; + left: 5px; + margin-bottom: -5px; + border-width: 5px 5px 0; + border-top-color: #000000; + } + &.right .tooltip-arrow { + top: 50%; + left: 0; + margin-top: -5px; + border-width: 5px 5px 5px 0; + border-right-color: #000000; + } + &.left .tooltip-arrow { + top: 50%; + right: 0; + margin-top: -5px; + border-width: 5px 0 5px 5px; + border-left-color: #000000; + } + &.bottom .tooltip-arrow { + top: 0; + left: 50%; + margin-left: -5px; + border-width: 0 5px 5px; + border-bottom-color: #000000; + } + &.bottom-left .tooltip-arrow { + top: 0; + right: 5px; + margin-top: -5px; + border-width: 0 5px 5px; + border-bottom-color: #000000; + } + &.bottom-right .tooltip-arrow { + top: 0; + left: 5px; + margin-top: -5px; + border-width: 0 5px 5px; + border-bottom-color: #000000; + } +} |