Merge branch 'gh-pages' into rmielt9
This commit is contained in:
Mike Linksvayer
GitHub
commit
68ab913649
|
|
@ -5,7 +5,7 @@
|
|||
assets/vendor/clipboard/src
|
||||
assets/vendor/clipboard/test
|
||||
assets/vendor/selectivizr/tests
|
||||
assets/vendor/qtip2/basic
|
||||
assets/vendor/hint.css/src
|
||||
/vendor
|
||||
/.sass-cache
|
||||
.ruby-version
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@ sudo apt-get install make cmake
|
|||
### Installing and Running the tool
|
||||
|
||||
```bash
|
||||
git clone https://github.com/github/choosealicense.com.git
|
||||
git clone https://github.com/github/choosealicense.com.git --recursive
|
||||
cd choosealicense.com
|
||||
./script/bootstrap
|
||||
./script/server
|
||||
|
|
|
|||
|
|
@ -46,6 +46,10 @@
|
|||
.license-body {
|
||||
width: calc(100% - 250px);
|
||||
}
|
||||
|
||||
.hint--large::after{
|
||||
width: 150px;
|
||||
}
|
||||
}
|
||||
|
||||
/* iPads (portrait) ----------- */
|
||||
|
|
@ -162,6 +166,10 @@
|
|||
.license-rules:not(.license-rules-sidebar) .license-limitations span {
|
||||
background-position: -14px 0;
|
||||
}
|
||||
|
||||
.hint--large::after{
|
||||
width: 80px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Smartphones (portrait) ----------- */
|
||||
|
|
|
|||
|
|
@ -17,7 +17,6 @@
|
|||
|
||||
{% if page.collection == "licenses" or page.class == "license-types" %}
|
||||
<script src="{{ 'assets/vendor/jquery/jquery.min.js' | relative_url }}"></script>
|
||||
<script src="{{ 'assets/vendor/qtip2/jquery.qtip.min.js' | relative_url }}"></script>
|
||||
<script src="{{ 'assets/vendor/clipboard/dist/clipboard.min.js' | relative_url }}"></script>
|
||||
<script>
|
||||
window.annotations = {{ site.data.rules | jsonify }};
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@ If you're here to choose a license, **[start from the home page](/)** to see a f
|
|||
{% else %}
|
||||
{% assign lite = "" %}
|
||||
{% endif %}
|
||||
<span class="{{ r | append: lite }}">
|
||||
<span class="{{ r | append: lite }}" style="margin: auto;">
|
||||
<span class="license-sprite {{ r }}"></span>
|
||||
</span>
|
||||
</td>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
---
|
||||
|
||||
@import "../vendor/normalize-css/normalize.css";
|
||||
@import "../vendor/qtip2/jquery.qtip.min.css";
|
||||
@import "../vendor/hint.css/hint.min.css";
|
||||
|
||||
body {
|
||||
background: #fafafa;
|
||||
|
|
@ -461,54 +461,50 @@ strong {
|
|||
}
|
||||
|
||||
|
||||
/* Qtip styles */
|
||||
|
||||
.qtip-conditions,
|
||||
.qtip-permissions,
|
||||
.qtip-limitations,
|
||||
.qtip-fetching,
|
||||
.qtip-error {
|
||||
font-size: 0.75rem;
|
||||
line-height: 1.3;
|
||||
/* Hint.css Overide */
|
||||
.orverride-hint-inline {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.qtip-conditions {
|
||||
// Selecting all the tooltip bodies to increase their font-size
|
||||
[class*="hint--"][aria-label]:after {
|
||||
font-size: 0.80rem;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
// Tooltips
|
||||
.tooltip--permissions.hint--bottom:before{
|
||||
border-bottom-color: #298625;
|
||||
}
|
||||
|
||||
.tooltip--conditions.hint--bottom:before{
|
||||
border-bottom-color: #0d648a;
|
||||
}
|
||||
|
||||
.tooltip--error.hint--bottom:before,
|
||||
.tooltip--limitations.hint--bottom:before{
|
||||
border-bottom-color: #812a28;
|
||||
}
|
||||
|
||||
.tooltip--permissions:after{
|
||||
background-color: #d8f4d7;
|
||||
color: #298625;
|
||||
border-color: #3dc637;
|
||||
}
|
||||
|
||||
.tooltip--conditions:after{
|
||||
background-color: #d0ebf6;
|
||||
border-color: #149ad4;
|
||||
color: #0d648a;
|
||||
}
|
||||
|
||||
.qtip-conditions .qtip-titlebar {
|
||||
background-color: #149ad4;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.qtip-fetching,
|
||||
.qtip-permissions {
|
||||
background-color: #d8f4d7;
|
||||
border-color: #3dc637;
|
||||
color: #298625;
|
||||
}
|
||||
|
||||
.qtip-fetching .qtip-titlebar,
|
||||
.qtip-permissions .qtip-titlebar {
|
||||
background-color: #3dc637;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.qtip-error,
|
||||
.qtip-limitations {
|
||||
.tooltip--error:after,
|
||||
.tooltip--limitations:after{
|
||||
background-color: #f4d9d8;
|
||||
border-color: #c6403d;
|
||||
color: #812a28;
|
||||
}
|
||||
|
||||
.qtip-error .qtip-titlebar,
|
||||
.qtip-limitations .qtip-titlebar {
|
||||
background-color: #c6403d;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* For modern browsers */
|
||||
.clearfix:before,
|
||||
.clearfix:after {
|
||||
|
|
|
|||
|
|
@ -16,18 +16,17 @@ class Choosealicense
|
|||
selection.removeAllRanges()
|
||||
selection.addRange(range)
|
||||
|
||||
# Qtip position attributes for tooltips
|
||||
qtip_position:
|
||||
my: "top center"
|
||||
at: "bottom center"
|
||||
viewport: $(window)
|
||||
adjust:
|
||||
method: 'shift shift'
|
||||
# Annotation rule types as defined in `_config.yml`
|
||||
ruletypes:
|
||||
permissions: "Permission"
|
||||
conditions: "Condition"
|
||||
limitations: "Limitation"
|
||||
tooltipAttributesMapperByRuleType:
|
||||
permissions:
|
||||
heading: 'Permission'
|
||||
color: 'tooltip--permissions'
|
||||
conditions:
|
||||
heading: 'Condition'
|
||||
color: 'tooltip--conditions'
|
||||
limitations:
|
||||
heading: 'Limitation'
|
||||
color: 'tooltip--limitations'
|
||||
|
||||
|
||||
# fire on document.ready
|
||||
constructor: ->
|
||||
|
|
@ -41,20 +40,14 @@ class Choosealicense
|
|||
# Dynamically add annotations as title attribute to rule list items
|
||||
for ruletype, rules of window.annotations
|
||||
for rule in rules
|
||||
$(".license-#{ruletype} .#{rule["tag"]}").attr "title", rule["description"]
|
||||
|
||||
# Init tooltips on all rule list items
|
||||
for ruletype, label of @ruletypes
|
||||
$(".license-#{ruletype} li, .license-#{ruletype} .license-sprite").qtip
|
||||
content:
|
||||
text: false
|
||||
title:
|
||||
text: label
|
||||
position: @qtip_position
|
||||
style:
|
||||
classes: "qtip-shadow qtip-#{ruletype}"
|
||||
|
||||
false
|
||||
licenseLiElement = $(".license-#{ruletype} .#{rule["tag"]}")
|
||||
tooltipAttr = @tooltipAttributesMapperByRuleType[ruletype]
|
||||
licenseLiElement.attr "aria-label", "#{tooltipAttr.heading}: #{rule.description}"
|
||||
licenseLiElement.addClass("hint--bottom
|
||||
hint--large
|
||||
hint--no-animate
|
||||
#{tooltipAttr.color}
|
||||
orverride-hint-inline")
|
||||
|
||||
# Initializes Clipboard.js
|
||||
initClipboard: ->
|
||||
|
|
@ -83,23 +76,10 @@ class Choosealicense
|
|||
|
||||
class LicenseSuggestion
|
||||
constructor: (@inputEl, @licenseId, @statusIndicator) ->
|
||||
@setupTooltips()
|
||||
@bindEventHandlers()
|
||||
|
||||
# Initializes tooltips on the input element
|
||||
setupTooltips: =>
|
||||
@inputEl.qtip
|
||||
content:
|
||||
text: false
|
||||
title:
|
||||
text: "message"
|
||||
show: false
|
||||
hide: false
|
||||
position:
|
||||
my: "top center"
|
||||
at: "bottom center"
|
||||
style:
|
||||
classes: "qtip-shadow"
|
||||
inputWraper: $('.input-wrapper')
|
||||
tooltipErrorClasses: 'hint--bottom tooltip--error hint--always'
|
||||
|
||||
# Main event handlers for user input
|
||||
bindEventHandlers: =>
|
||||
|
|
@ -143,22 +123,19 @@ class LicenseSuggestion
|
|||
# Displays an indicator and tooltips to the user about the current status
|
||||
setStatus: (status="", message="") =>
|
||||
statusClass = status.toLowerCase()
|
||||
displayQtip = (status, message) =>
|
||||
@inputEl.qtip("api")
|
||||
.set("content.text", message)
|
||||
.set("content.title", status)
|
||||
.set("style.classes", "qtip-shadow qtip-#{statusClass}")
|
||||
.show()
|
||||
displayTooltip = (status, message) =>
|
||||
@inputWraper.attr('aria-label', "#{status}: #{message}")
|
||||
@inputWraper.addClass(@tooltipErrorClasses)
|
||||
|
||||
switch status
|
||||
when "Fetching"
|
||||
@statusIndicator.removeClass('error').addClass(statusClass)
|
||||
@statusIndicator.removeClass("error #{@tooltipErrorClasses}").addClass(statusClass)
|
||||
when "Error"
|
||||
@statusIndicator.removeClass('fetching').addClass(statusClass)
|
||||
displayQtip status, message
|
||||
displayTooltip status, message
|
||||
else
|
||||
@inputEl.qtip("api").hide()
|
||||
@statusIndicator.removeClass('fetching error')
|
||||
@inputWraper.removeClass(@tooltipErrorClasses)
|
||||
|
||||
# Fetches information about a repository from the Github API
|
||||
fetchInfoFromGithubAPI: (repositoryFullName, callback) ->
|
||||
|
|
@ -174,10 +151,9 @@ class LicenseSuggestion
|
|||
repositoryLicense: (repositoryFullName, license) ->
|
||||
foundLicense = window.licenses.find (lic) -> lic.spdx_id == license.spdx_id
|
||||
if foundLicense # Links the license to its page on this site
|
||||
"The repository <b> #{repositoryFullName}</b> is already licensed under the
|
||||
<a href='/licenses/#{foundLicense.spdx_id.toLowerCase()}'><b>#{foundLicense.title}</b></a>."
|
||||
"The repository #{repositoryFullName} is already licensed under the #{foundLicense.title}."
|
||||
else
|
||||
"The repository <b> #{repositoryFullName}</b> is already licensed."
|
||||
"The repository #{repositoryFullName} is already licensed."
|
||||
|
||||
$ ->
|
||||
new Choosealicense()
|
||||
|
|
|
|||
|
|
@ -0,0 +1,27 @@
|
|||
{
|
||||
"name": "hint.css",
|
||||
"main": "hint.min.css",
|
||||
"author": "Kushagra Gour",
|
||||
"ignore": [
|
||||
"CONTRIBUTING.md",
|
||||
"Gruntfile.js"
|
||||
],
|
||||
"keywords": [
|
||||
"hint",
|
||||
"tooltip",
|
||||
"tooltips",
|
||||
"ui"
|
||||
],
|
||||
"homepage": "https://github.com/chinchang/hint.css",
|
||||
"version": "2.7.0",
|
||||
"_release": "2.7.0",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "v2.7.0",
|
||||
"commit": "9fa90f8c94a23c61307b70ae5146a34f1d88ae46"
|
||||
},
|
||||
"_source": "https://github.com/chinchang/hint.css.git",
|
||||
"_target": "^2.7.0",
|
||||
"_originalSource": "hint.css",
|
||||
"_direct": true
|
||||
}
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
# editorconfig.org
|
||||
|
||||
root = true
|
||||
|
||||
[*]
|
||||
charset = utf-8
|
||||
end_of_line = lf
|
||||
indent_style = tab
|
||||
insert_final_newline = true
|
||||
trim_trailing_whitespace = true
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
# These are supported funding model platforms
|
||||
|
||||
patreon: kushagra
|
||||
custom: https://paypal.me/kushagragour
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
.sass-cache
|
||||
node_modules/
|
||||
hint.sublime-project
|
||||
hint.sublime-workspace
|
||||
*.map
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
hint.css
|
||||
hint.min.css
|
||||
hint.base.css
|
||||
hint.base.min.css
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
MIT License
|
||||
|
||||
Copyright (c) 2021 Kushagra Gour
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
|
|
@ -0,0 +1,123 @@
|
|||
# Hint.css [](https://badge.fury.io/js/hint.css)  [](https://gitter.im/chinchang/hint.css?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge) 
|
||||
*A tooltip library in CSS for your lovely websites*
|
||||
|
||||
[Demo](https://kushagra.dev/lab/hint/) • [Get started](#get-started) • [Who's using this?](#whos-using-this) • [Browser support](#browser-support) • [FAQs](#faqs) • [Contributing](#contributing) • [License](#license)
|
||||
|
||||
`hint.css` is written as a pure CSS resource using which you can create cool accessible tooltips for your web app. It does not rely on JavaScript but rather uses **aria-label**/**data-* attribute**, **pseudo elements**, **content property** and **CSS3 transitions** to create the tooltips. Also it uses **BEM** naming convention particularly for the modifiers.
|
||||
|
||||
|
||||
|
||||
## Get Started
|
||||
|
||||
Get the library using one of the following ways:
|
||||
|
||||
1. **GitHub**
|
||||
|
||||
Full build
|
||||
- [unminified] : https://raw.github.com/chinchang/hint.css/master/hint.css
|
||||
- [minified] : https://raw.github.com/chinchang/hint.css/master/hint.min.css
|
||||
|
||||
Base build *(Does not include color themes and fancy effects)*
|
||||
- [unminified] : https://raw.github.com/chinchang/hint.css/master/hint.base.css
|
||||
- [minified] : https://raw.github.com/chinchang/hint.css/master/hint.base.min.css
|
||||
|
||||
2. **Bower** : `bower install hint.css`
|
||||
|
||||
3. **npm**: `npm install --save hint.css`
|
||||
|
||||
4. **CDN**: [https://www.jsdelivr.com/package/npm/hint.css](https://www.jsdelivr.com/package/npm/hint.css) or [https://cdnjs.com/libraries/hint.css](https://cdnjs.com/libraries/hint.css)
|
||||
|
||||
Now include the library in the ``HEAD`` tag of your page:
|
||||
|
||||
```html
|
||||
<link rel="stylesheet" href="hint.css" />
|
||||
```
|
||||
or
|
||||
|
||||
```html
|
||||
<link rel="stylesheet" href="hint.min.css" />
|
||||
```
|
||||
|
||||
Now, all you need to do is give your element any position class and tooltip text using the `aria-label` attribute.
|
||||
Note, if you don't want to use `aria-label` attribute, you can also specify the tooltip text using the `data-hint` attribute, but its recommended to use `aria-label` in support of accessibility. [Read more about aria-label](https://webaccessibility.withgoogle.com/unit?unit=6&lesson=10).
|
||||
|
||||
|
||||
```html
|
||||
Hello Sir, <span class="hint--bottom" aria-label="Thank you!">hover me.</span>
|
||||
```
|
||||
|
||||
Use it with other available modifiers in various combinations. Available modifiers:
|
||||
- *Colors* - `hint--error`, `hint--info`, `hint--warning`, `hint--success`
|
||||
- *Sizes* - `hint--small`, `hint--medium`, `hint--large`
|
||||
- `hint--always`
|
||||
- `hint--rounded`
|
||||
- `hint--no-animate`
|
||||
- `hint--bounce`
|
||||
- `hint-no-arrow`
|
||||
|
||||
## Upgrading from v1.x
|
||||
|
||||
If you are already using v1.x, you may need to tweak certain position classes because of the way tooltips are positioned in v2.
|
||||
|
||||
## Changing the prefix for class names
|
||||
|
||||
Don't like BEM naming (`hint--`) or want to use your own prefix for the class names?
|
||||
|
||||
Simply update `src/hint-variables.scss` and change the `$hintPrefix` variable.
|
||||
To generate the css file, please read the [contributing page](./CONTRIBUTING.md).
|
||||
|
||||
## Who's Using This?
|
||||
- [Webflow Playground](http://playground.webflow.com/)
|
||||
- [Panda chrome app](http://usepanda.com/)
|
||||
- [Fiverr](https://www.fiverr.com/)
|
||||
- [Stackshare](http://stackshare.io/)
|
||||
- [Siftery](https://siftery.com/)
|
||||
- [LessPass](https://lesspass.com/#/)
|
||||
- [Tridiv](http://tridiv.com/)
|
||||
- [Alm - TypeScript IDE](http://alm.tools/)
|
||||
- [Prototyp](http://prototyp.in/)
|
||||
- [Tradus](http://tradus.com/)
|
||||
- [Web Maker](https://webmakerapp.com)
|
||||
- [Tolks](https://tolks.io)
|
||||
- [Formspree](http://formspree.io/)
|
||||
- [codeMagic](http://codemagic.gr/)
|
||||
|
||||
Are you using **hint.css** in your awesome project too? Just tweet it out to [@hint_css](https://twitter.com/hint_css) or let us know on the [mailing list](mailto:hintcss@googlegroups.com).
|
||||
|
||||
## Browser Support
|
||||
**hint.css** works on all latest browsers, though the transition effect is supported only on IE10+, Chrome 26+ and FF4+ at present.
|
||||
|
||||
- Chrome - basic + transition effects
|
||||
- Firefox - basic + transition effects
|
||||
- Opera - basic
|
||||
- Safari - basic
|
||||
- IE 10+ - basic + transition effects
|
||||
- IE 8 & 9 - basic
|
||||
|
||||
### FAQs
|
||||
|
||||
Checkout the [FAQ Wiki](https://github.com/chinchang/hint.css/wiki/Frequently-Asked-Questions) for some common gotchas to be aware of while using **hint.css**.
|
||||
|
||||
## Contributing
|
||||
`hint.css` is developed in SASS and the source files can be found in the `src/` directory.
|
||||
|
||||
If you would like to create more types of tooltips/ fix bugs/ enhance the library etc. you are more than welcome to submit your pull requests.
|
||||
|
||||
[Read more on contributing](./CONTRIBUTING.md).
|
||||
|
||||
## Changelog & Updates
|
||||
See the [Changelog](https://github.com/chinchang/hint.css/wiki/Changelog).
|
||||
|
||||
To catch all updates and discussion, join the mailing list: [**hintcss@googlegroups.com**](https://groups.google.com/forum/?fromgroups=#!forum/hintcss).
|
||||
|
||||
Or follow on twitter: [**@hint_css**](https://twitter.com/hint_css)
|
||||
|
||||
## License
|
||||
|
||||
Hint.css is free for personal and commercial use under the MIT License.
|
||||
|
||||
## Credits
|
||||
This doesn't make use of a lot of BEM methodology but big thanks to [@csswizardry](https://twitter.com/csswizardry), [@necolas](https://twitter.com/necolas) for their awesome articles on BEM and to [@joshnh](https://twitter.com/_joshnh) through whose work I came to know about it :)
|
||||
|
||||
# Sponsor
|
||||
[](https://cssbattle.dev)
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
{
|
||||
"name": "hint.css",
|
||||
"main": "hint.min.css",
|
||||
"author": "Kushagra Gour",
|
||||
"ignore": [
|
||||
"CONTRIBUTING.md",
|
||||
"Gruntfile.js"
|
||||
],
|
||||
"keywords": [
|
||||
"hint",
|
||||
"tooltip",
|
||||
"tooltips",
|
||||
"ui"
|
||||
]
|
||||
}
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
{
|
||||
"name": "hint.css",
|
||||
"repo": "chinchang/hint.css",
|
||||
"description": "A tooltip library in CSS for your lovely websites.",
|
||||
"version": "2.6.0",
|
||||
"keywords": ["tooltip", "css"],
|
||||
"dependencies": {},
|
||||
"development": {},
|
||||
"styles": [
|
||||
"hint.min.css"
|
||||
]
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,466 @@
|
|||
/*! Hint.css (base version) - v2.7.0 - 2021-10-01
|
||||
* https://kushagra.dev/lab/hint/
|
||||
* Copyright (c) 2021 Kushagra Gour */
|
||||
|
||||
/*-------------------------------------*\
|
||||
HINT.css - A CSS tooltip library
|
||||
\*-------------------------------------*/
|
||||
/**
|
||||
* HINT.css is a tooltip library made in pure CSS.
|
||||
*
|
||||
* Source: https://github.com/chinchang/hint.css
|
||||
* Demo: http://kushagragour.in/lab/hint/
|
||||
*
|
||||
*/
|
||||
/**
|
||||
* source: hint-core.scss
|
||||
*
|
||||
* Defines the basic styling for the tooltip.
|
||||
* Each tooltip is made of 2 parts:
|
||||
* 1) body (:after)
|
||||
* 2) arrow (:before)
|
||||
*
|
||||
* Classes added:
|
||||
* 1) hint
|
||||
*/
|
||||
[class*="hint--"] {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
/**
|
||||
* tooltip arrow
|
||||
*/
|
||||
/**
|
||||
* tooltip body
|
||||
*/ }
|
||||
[class*="hint--"]:before, [class*="hint--"]:after {
|
||||
position: absolute;
|
||||
-webkit-transform: translate3d(0, 0, 0);
|
||||
-moz-transform: translate3d(0, 0, 0);
|
||||
transform: translate3d(0, 0, 0);
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
z-index: 1000000;
|
||||
pointer-events: none;
|
||||
-webkit-transition: 0.3s ease;
|
||||
-moz-transition: 0.3s ease;
|
||||
transition: 0.3s ease;
|
||||
-webkit-transition-delay: 0ms;
|
||||
-moz-transition-delay: 0ms;
|
||||
transition-delay: 0ms; }
|
||||
[class*="hint--"]:hover:before, [class*="hint--"]:hover:after {
|
||||
visibility: visible;
|
||||
opacity: 1; }
|
||||
[class*="hint--"]:hover:before, [class*="hint--"]:hover:after {
|
||||
-webkit-transition-delay: 100ms;
|
||||
-moz-transition-delay: 100ms;
|
||||
transition-delay: 100ms; }
|
||||
[class*="hint--"]:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
background: transparent;
|
||||
border: 6px solid transparent;
|
||||
z-index: 1000001; }
|
||||
[class*="hint--"]:after {
|
||||
background: #383838;
|
||||
color: white;
|
||||
padding: 8px 10px;
|
||||
font-size: 12px;
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
line-height: 12px;
|
||||
white-space: nowrap; }
|
||||
[class*="hint--"][aria-label]:after {
|
||||
content: attr(aria-label); }
|
||||
[class*="hint--"][data-hint]:after {
|
||||
content: attr(data-hint); }
|
||||
|
||||
[aria-label='']:before, [aria-label='']:after,
|
||||
[data-hint='']:before,
|
||||
[data-hint='']:after {
|
||||
display: none !important; }
|
||||
|
||||
/**
|
||||
* source: hint-position.scss
|
||||
*
|
||||
* Defines the positoning logic for the tooltips.
|
||||
*
|
||||
* Classes added:
|
||||
* 1) hint--top
|
||||
* 2) hint--bottom
|
||||
* 3) hint--left
|
||||
* 4) hint--right
|
||||
*/
|
||||
/**
|
||||
* set default color for tooltip arrows
|
||||
*/
|
||||
.hint--top-left:before {
|
||||
border-top-color: #383838; }
|
||||
|
||||
.hint--top-right:before {
|
||||
border-top-color: #383838; }
|
||||
|
||||
.hint--top:before {
|
||||
border-top-color: #383838; }
|
||||
|
||||
.hint--bottom-left:before {
|
||||
border-bottom-color: #383838; }
|
||||
|
||||
.hint--bottom-right:before {
|
||||
border-bottom-color: #383838; }
|
||||
|
||||
.hint--bottom:before {
|
||||
border-bottom-color: #383838; }
|
||||
|
||||
.hint--left:before {
|
||||
border-left-color: #383838; }
|
||||
|
||||
.hint--right:before {
|
||||
border-right-color: #383838; }
|
||||
|
||||
/**
|
||||
* top tooltip
|
||||
*/
|
||||
.hint--top:before {
|
||||
margin-bottom: -11px; }
|
||||
|
||||
.hint--top:before, .hint--top:after {
|
||||
bottom: 100%;
|
||||
left: 50%; }
|
||||
|
||||
.hint--top:before {
|
||||
left: calc(50% - 6px); }
|
||||
|
||||
.hint--top:after {
|
||||
-webkit-transform: translateX(-50%);
|
||||
-moz-transform: translateX(-50%);
|
||||
transform: translateX(-50%); }
|
||||
|
||||
.hint--top:hover:before {
|
||||
-webkit-transform: translateY(-8px);
|
||||
-moz-transform: translateY(-8px);
|
||||
transform: translateY(-8px); }
|
||||
|
||||
.hint--top:hover:after {
|
||||
-webkit-transform: translateX(-50%) translateY(-8px);
|
||||
-moz-transform: translateX(-50%) translateY(-8px);
|
||||
transform: translateX(-50%) translateY(-8px); }
|
||||
|
||||
/**
|
||||
* bottom tooltip
|
||||
*/
|
||||
.hint--bottom:before {
|
||||
margin-top: -11px; }
|
||||
|
||||
.hint--bottom:before, .hint--bottom:after {
|
||||
top: 100%;
|
||||
left: 50%; }
|
||||
|
||||
.hint--bottom:before {
|
||||
left: calc(50% - 6px); }
|
||||
|
||||
.hint--bottom:after {
|
||||
-webkit-transform: translateX(-50%);
|
||||
-moz-transform: translateX(-50%);
|
||||
transform: translateX(-50%); }
|
||||
|
||||
.hint--bottom:hover:before {
|
||||
-webkit-transform: translateY(8px);
|
||||
-moz-transform: translateY(8px);
|
||||
transform: translateY(8px); }
|
||||
|
||||
.hint--bottom:hover:after {
|
||||
-webkit-transform: translateX(-50%) translateY(8px);
|
||||
-moz-transform: translateX(-50%) translateY(8px);
|
||||
transform: translateX(-50%) translateY(8px); }
|
||||
|
||||
/**
|
||||
* right tooltip
|
||||
*/
|
||||
.hint--right:before {
|
||||
margin-left: -11px;
|
||||
margin-bottom: -6px; }
|
||||
|
||||
.hint--right:after {
|
||||
margin-bottom: -14px; }
|
||||
|
||||
.hint--right:before, .hint--right:after {
|
||||
left: 100%;
|
||||
bottom: 50%; }
|
||||
|
||||
.hint--right:hover:before {
|
||||
-webkit-transform: translateX(8px);
|
||||
-moz-transform: translateX(8px);
|
||||
transform: translateX(8px); }
|
||||
|
||||
.hint--right:hover:after {
|
||||
-webkit-transform: translateX(8px);
|
||||
-moz-transform: translateX(8px);
|
||||
transform: translateX(8px); }
|
||||
|
||||
/**
|
||||
* left tooltip
|
||||
*/
|
||||
.hint--left:before {
|
||||
margin-right: -11px;
|
||||
margin-bottom: -6px; }
|
||||
|
||||
.hint--left:after {
|
||||
margin-bottom: -14px; }
|
||||
|
||||
.hint--left:before, .hint--left:after {
|
||||
right: 100%;
|
||||
bottom: 50%; }
|
||||
|
||||
.hint--left:hover:before {
|
||||
-webkit-transform: translateX(-8px);
|
||||
-moz-transform: translateX(-8px);
|
||||
transform: translateX(-8px); }
|
||||
|
||||
.hint--left:hover:after {
|
||||
-webkit-transform: translateX(-8px);
|
||||
-moz-transform: translateX(-8px);
|
||||
transform: translateX(-8px); }
|
||||
|
||||
/**
|
||||
* top-left tooltip
|
||||
*/
|
||||
.hint--top-left:before {
|
||||
margin-bottom: -11px; }
|
||||
|
||||
.hint--top-left:before, .hint--top-left:after {
|
||||
bottom: 100%;
|
||||
left: 50%; }
|
||||
|
||||
.hint--top-left:before {
|
||||
left: calc(50% - 6px); }
|
||||
|
||||
.hint--top-left:after {
|
||||
-webkit-transform: translateX(-100%);
|
||||
-moz-transform: translateX(-100%);
|
||||
transform: translateX(-100%); }
|
||||
|
||||
.hint--top-left:after {
|
||||
margin-left: 12px; }
|
||||
|
||||
.hint--top-left:hover:before {
|
||||
-webkit-transform: translateY(-8px);
|
||||
-moz-transform: translateY(-8px);
|
||||
transform: translateY(-8px); }
|
||||
|
||||
.hint--top-left:hover:after {
|
||||
-webkit-transform: translateX(-100%) translateY(-8px);
|
||||
-moz-transform: translateX(-100%) translateY(-8px);
|
||||
transform: translateX(-100%) translateY(-8px); }
|
||||
|
||||
/**
|
||||
* top-right tooltip
|
||||
*/
|
||||
.hint--top-right:before {
|
||||
margin-bottom: -11px; }
|
||||
|
||||
.hint--top-right:before, .hint--top-right:after {
|
||||
bottom: 100%;
|
||||
left: 50%; }
|
||||
|
||||
.hint--top-right:before {
|
||||
left: calc(50% - 6px); }
|
||||
|
||||
.hint--top-right:after {
|
||||
-webkit-transform: translateX(0);
|
||||
-moz-transform: translateX(0);
|
||||
transform: translateX(0); }
|
||||
|
||||
.hint--top-right:after {
|
||||
margin-left: -12px; }
|
||||
|
||||
.hint--top-right:hover:before {
|
||||
-webkit-transform: translateY(-8px);
|
||||
-moz-transform: translateY(-8px);
|
||||
transform: translateY(-8px); }
|
||||
|
||||
.hint--top-right:hover:after {
|
||||
-webkit-transform: translateY(-8px);
|
||||
-moz-transform: translateY(-8px);
|
||||
transform: translateY(-8px); }
|
||||
|
||||
/**
|
||||
* bottom-left tooltip
|
||||
*/
|
||||
.hint--bottom-left:before {
|
||||
margin-top: -11px; }
|
||||
|
||||
.hint--bottom-left:before, .hint--bottom-left:after {
|
||||
top: 100%;
|
||||
left: 50%; }
|
||||
|
||||
.hint--bottom-left:before {
|
||||
left: calc(50% - 6px); }
|
||||
|
||||
.hint--bottom-left:after {
|
||||
-webkit-transform: translateX(-100%);
|
||||
-moz-transform: translateX(-100%);
|
||||
transform: translateX(-100%); }
|
||||
|
||||
.hint--bottom-left:after {
|
||||
margin-left: 12px; }
|
||||
|
||||
.hint--bottom-left:hover:before {
|
||||
-webkit-transform: translateY(8px);
|
||||
-moz-transform: translateY(8px);
|
||||
transform: translateY(8px); }
|
||||
|
||||
.hint--bottom-left:hover:after {
|
||||
-webkit-transform: translateX(-100%) translateY(8px);
|
||||
-moz-transform: translateX(-100%) translateY(8px);
|
||||
transform: translateX(-100%) translateY(8px); }
|
||||
|
||||
/**
|
||||
* bottom-right tooltip
|
||||
*/
|
||||
.hint--bottom-right:before {
|
||||
margin-top: -11px; }
|
||||
|
||||
.hint--bottom-right:before, .hint--bottom-right:after {
|
||||
top: 100%;
|
||||
left: 50%; }
|
||||
|
||||
.hint--bottom-right:before {
|
||||
left: calc(50% - 6px); }
|
||||
|
||||
.hint--bottom-right:after {
|
||||
-webkit-transform: translateX(0);
|
||||
-moz-transform: translateX(0);
|
||||
transform: translateX(0); }
|
||||
|
||||
.hint--bottom-right:after {
|
||||
margin-left: -12px; }
|
||||
|
||||
.hint--bottom-right:hover:before {
|
||||
-webkit-transform: translateY(8px);
|
||||
-moz-transform: translateY(8px);
|
||||
transform: translateY(8px); }
|
||||
|
||||
.hint--bottom-right:hover:after {
|
||||
-webkit-transform: translateY(8px);
|
||||
-moz-transform: translateY(8px);
|
||||
transform: translateY(8px); }
|
||||
|
||||
/**
|
||||
* source: hint-sizes.scss
|
||||
*
|
||||
* Defines width restricted tooltips that can span
|
||||
* across multiple lines.
|
||||
*
|
||||
* Classes added:
|
||||
* 1) hint--small
|
||||
* 2) hint--medium
|
||||
* 3) hint--large
|
||||
*
|
||||
*/
|
||||
.hint--small:after,
|
||||
.hint--medium:after,
|
||||
.hint--large:after {
|
||||
white-space: normal;
|
||||
line-height: 1.4em;
|
||||
word-wrap: break-word; }
|
||||
|
||||
.hint--small:after {
|
||||
width: 80px; }
|
||||
|
||||
.hint--medium:after {
|
||||
width: 150px; }
|
||||
|
||||
.hint--large:after {
|
||||
width: 300px; }
|
||||
|
||||
/**
|
||||
* source: hint-always.scss
|
||||
*
|
||||
* Defines a persisted tooltip which shows always.
|
||||
*
|
||||
* Classes added:
|
||||
* 1) hint--always
|
||||
*
|
||||
*/
|
||||
.hint--always:after, .hint--always:before {
|
||||
opacity: 1;
|
||||
visibility: visible; }
|
||||
|
||||
.hint--always.hint--top:before {
|
||||
-webkit-transform: translateY(-8px);
|
||||
-moz-transform: translateY(-8px);
|
||||
transform: translateY(-8px); }
|
||||
|
||||
.hint--always.hint--top:after {
|
||||
-webkit-transform: translateX(-50%) translateY(-8px);
|
||||
-moz-transform: translateX(-50%) translateY(-8px);
|
||||
transform: translateX(-50%) translateY(-8px); }
|
||||
|
||||
.hint--always.hint--top-left:before {
|
||||
-webkit-transform: translateY(-8px);
|
||||
-moz-transform: translateY(-8px);
|
||||
transform: translateY(-8px); }
|
||||
|
||||
.hint--always.hint--top-left:after {
|
||||
-webkit-transform: translateX(-100%) translateY(-8px);
|
||||
-moz-transform: translateX(-100%) translateY(-8px);
|
||||
transform: translateX(-100%) translateY(-8px); }
|
||||
|
||||
.hint--always.hint--top-right:before {
|
||||
-webkit-transform: translateY(-8px);
|
||||
-moz-transform: translateY(-8px);
|
||||
transform: translateY(-8px); }
|
||||
|
||||
.hint--always.hint--top-right:after {
|
||||
-webkit-transform: translateY(-8px);
|
||||
-moz-transform: translateY(-8px);
|
||||
transform: translateY(-8px); }
|
||||
|
||||
.hint--always.hint--bottom:before {
|
||||
-webkit-transform: translateY(8px);
|
||||
-moz-transform: translateY(8px);
|
||||
transform: translateY(8px); }
|
||||
|
||||
.hint--always.hint--bottom:after {
|
||||
-webkit-transform: translateX(-50%) translateY(8px);
|
||||
-moz-transform: translateX(-50%) translateY(8px);
|
||||
transform: translateX(-50%) translateY(8px); }
|
||||
|
||||
.hint--always.hint--bottom-left:before {
|
||||
-webkit-transform: translateY(8px);
|
||||
-moz-transform: translateY(8px);
|
||||
transform: translateY(8px); }
|
||||
|
||||
.hint--always.hint--bottom-left:after {
|
||||
-webkit-transform: translateX(-100%) translateY(8px);
|
||||
-moz-transform: translateX(-100%) translateY(8px);
|
||||
transform: translateX(-100%) translateY(8px); }
|
||||
|
||||
.hint--always.hint--bottom-right:before {
|
||||
-webkit-transform: translateY(8px);
|
||||
-moz-transform: translateY(8px);
|
||||
transform: translateY(8px); }
|
||||
|
||||
.hint--always.hint--bottom-right:after {
|
||||
-webkit-transform: translateY(8px);
|
||||
-moz-transform: translateY(8px);
|
||||
transform: translateY(8px); }
|
||||
|
||||
.hint--always.hint--left:before {
|
||||
-webkit-transform: translateX(-8px);
|
||||
-moz-transform: translateX(-8px);
|
||||
transform: translateX(-8px); }
|
||||
|
||||
.hint--always.hint--left:after {
|
||||
-webkit-transform: translateX(-8px);
|
||||
-moz-transform: translateX(-8px);
|
||||
transform: translateX(-8px); }
|
||||
|
||||
.hint--always.hint--right:before {
|
||||
-webkit-transform: translateX(8px);
|
||||
-moz-transform: translateX(8px);
|
||||
transform: translateX(8px); }
|
||||
|
||||
.hint--always.hint--right:after {
|
||||
-webkit-transform: translateX(8px);
|
||||
-moz-transform: translateX(8px);
|
||||
transform: translateX(8px); }
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,655 @@
|
|||
/*! Hint.css - v2.7.0 - 2021-10-01
|
||||
* https://kushagra.dev/lab/hint/
|
||||
* Copyright (c) 2021 Kushagra Gour */
|
||||
|
||||
/*-------------------------------------*\
|
||||
HINT.css - A CSS tooltip library
|
||||
\*-------------------------------------*/
|
||||
/**
|
||||
* HINT.css is a tooltip library made in pure CSS.
|
||||
*
|
||||
* Source: https://github.com/chinchang/hint.css
|
||||
* Demo: http://kushagragour.in/lab/hint/
|
||||
*
|
||||
*/
|
||||
/**
|
||||
* source: hint-core.scss
|
||||
*
|
||||
* Defines the basic styling for the tooltip.
|
||||
* Each tooltip is made of 2 parts:
|
||||
* 1) body (:after)
|
||||
* 2) arrow (:before)
|
||||
*
|
||||
* Classes added:
|
||||
* 1) hint
|
||||
*/
|
||||
[class*="hint--"] {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
/**
|
||||
* tooltip arrow
|
||||
*/
|
||||
/**
|
||||
* tooltip body
|
||||
*/ }
|
||||
[class*="hint--"]:before, [class*="hint--"]:after {
|
||||
position: absolute;
|
||||
-webkit-transform: translate3d(0, 0, 0);
|
||||
-moz-transform: translate3d(0, 0, 0);
|
||||
transform: translate3d(0, 0, 0);
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
z-index: 1000000;
|
||||
pointer-events: none;
|
||||
-webkit-transition: 0.3s ease;
|
||||
-moz-transition: 0.3s ease;
|
||||
transition: 0.3s ease;
|
||||
-webkit-transition-delay: 0ms;
|
||||
-moz-transition-delay: 0ms;
|
||||
transition-delay: 0ms; }
|
||||
[class*="hint--"]:hover:before, [class*="hint--"]:hover:after {
|
||||
visibility: visible;
|
||||
opacity: 1; }
|
||||
[class*="hint--"]:hover:before, [class*="hint--"]:hover:after {
|
||||
-webkit-transition-delay: 100ms;
|
||||
-moz-transition-delay: 100ms;
|
||||
transition-delay: 100ms; }
|
||||
[class*="hint--"]:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
background: transparent;
|
||||
border: 6px solid transparent;
|
||||
z-index: 1000001; }
|
||||
[class*="hint--"]:after {
|
||||
background: #383838;
|
||||
color: white;
|
||||
padding: 8px 10px;
|
||||
font-size: 12px;
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
line-height: 12px;
|
||||
white-space: nowrap; }
|
||||
[class*="hint--"][aria-label]:after {
|
||||
content: attr(aria-label); }
|
||||
[class*="hint--"][data-hint]:after {
|
||||
content: attr(data-hint); }
|
||||
|
||||
[aria-label='']:before, [aria-label='']:after,
|
||||
[data-hint='']:before,
|
||||
[data-hint='']:after {
|
||||
display: none !important; }
|
||||
|
||||
/**
|
||||
* source: hint-position.scss
|
||||
*
|
||||
* Defines the positoning logic for the tooltips.
|
||||
*
|
||||
* Classes added:
|
||||
* 1) hint--top
|
||||
* 2) hint--bottom
|
||||
* 3) hint--left
|
||||
* 4) hint--right
|
||||
*/
|
||||
/**
|
||||
* set default color for tooltip arrows
|
||||
*/
|
||||
.hint--top-left:before {
|
||||
border-top-color: #383838; }
|
||||
|
||||
.hint--top-right:before {
|
||||
border-top-color: #383838; }
|
||||
|
||||
.hint--top:before {
|
||||
border-top-color: #383838; }
|
||||
|
||||
.hint--bottom-left:before {
|
||||
border-bottom-color: #383838; }
|
||||
|
||||
.hint--bottom-right:before {
|
||||
border-bottom-color: #383838; }
|
||||
|
||||
.hint--bottom:before {
|
||||
border-bottom-color: #383838; }
|
||||
|
||||
.hint--left:before {
|
||||
border-left-color: #383838; }
|
||||
|
||||
.hint--right:before {
|
||||
border-right-color: #383838; }
|
||||
|
||||
/**
|
||||
* top tooltip
|
||||
*/
|
||||
.hint--top:before {
|
||||
margin-bottom: -11px; }
|
||||
|
||||
.hint--top:before, .hint--top:after {
|
||||
bottom: 100%;
|
||||
left: 50%; }
|
||||
|
||||
.hint--top:before {
|
||||
left: calc(50% - 6px); }
|
||||
|
||||
.hint--top:after {
|
||||
-webkit-transform: translateX(-50%);
|
||||
-moz-transform: translateX(-50%);
|
||||
transform: translateX(-50%); }
|
||||
|
||||
.hint--top:hover:before {
|
||||
-webkit-transform: translateY(-8px);
|
||||
-moz-transform: translateY(-8px);
|
||||
transform: translateY(-8px); }
|
||||
|
||||
.hint--top:hover:after {
|
||||
-webkit-transform: translateX(-50%) translateY(-8px);
|
||||
-moz-transform: translateX(-50%) translateY(-8px);
|
||||
transform: translateX(-50%) translateY(-8px); }
|
||||
|
||||
/**
|
||||
* bottom tooltip
|
||||
*/
|
||||
.hint--bottom:before {
|
||||
margin-top: -11px; }
|
||||
|
||||
.hint--bottom:before, .hint--bottom:after {
|
||||
top: 100%;
|
||||
left: 50%; }
|
||||
|
||||
.hint--bottom:before {
|
||||
left: calc(50% - 6px); }
|
||||
|
||||
.hint--bottom:after {
|
||||
-webkit-transform: translateX(-50%);
|
||||
-moz-transform: translateX(-50%);
|
||||
transform: translateX(-50%); }
|
||||
|
||||
.hint--bottom:hover:before {
|
||||
-webkit-transform: translateY(8px);
|
||||
-moz-transform: translateY(8px);
|
||||
transform: translateY(8px); }
|
||||
|
||||
.hint--bottom:hover:after {
|
||||
-webkit-transform: translateX(-50%) translateY(8px);
|
||||
-moz-transform: translateX(-50%) translateY(8px);
|
||||
transform: translateX(-50%) translateY(8px); }
|
||||
|
||||
/**
|
||||
* right tooltip
|
||||
*/
|
||||
.hint--right:before {
|
||||
margin-left: -11px;
|
||||
margin-bottom: -6px; }
|
||||
|
||||
.hint--right:after {
|
||||
margin-bottom: -14px; }
|
||||
|
||||
.hint--right:before, .hint--right:after {
|
||||
left: 100%;
|
||||
bottom: 50%; }
|
||||
|
||||
.hint--right:hover:before {
|
||||
-webkit-transform: translateX(8px);
|
||||
-moz-transform: translateX(8px);
|
||||
transform: translateX(8px); }
|
||||
|
||||
.hint--right:hover:after {
|
||||
-webkit-transform: translateX(8px);
|
||||
-moz-transform: translateX(8px);
|
||||
transform: translateX(8px); }
|
||||
|
||||
/**
|
||||
* left tooltip
|
||||
*/
|
||||
.hint--left:before {
|
||||
margin-right: -11px;
|
||||
margin-bottom: -6px; }
|
||||
|
||||
.hint--left:after {
|
||||
margin-bottom: -14px; }
|
||||
|
||||
.hint--left:before, .hint--left:after {
|
||||
right: 100%;
|
||||
bottom: 50%; }
|
||||
|
||||
.hint--left:hover:before {
|
||||
-webkit-transform: translateX(-8px);
|
||||
-moz-transform: translateX(-8px);
|
||||
transform: translateX(-8px); }
|
||||
|
||||
.hint--left:hover:after {
|
||||
-webkit-transform: translateX(-8px);
|
||||
-moz-transform: translateX(-8px);
|
||||
transform: translateX(-8px); }
|
||||
|
||||
/**
|
||||
* top-left tooltip
|
||||
*/
|
||||
.hint--top-left:before {
|
||||
margin-bottom: -11px; }
|
||||
|
||||
.hint--top-left:before, .hint--top-left:after {
|
||||
bottom: 100%;
|
||||
left: 50%; }
|
||||
|
||||
.hint--top-left:before {
|
||||
left: calc(50% - 6px); }
|
||||
|
||||
.hint--top-left:after {
|
||||
-webkit-transform: translateX(-100%);
|
||||
-moz-transform: translateX(-100%);
|
||||
transform: translateX(-100%); }
|
||||
|
||||
.hint--top-left:after {
|
||||
margin-left: 12px; }
|
||||
|
||||
.hint--top-left:hover:before {
|
||||
-webkit-transform: translateY(-8px);
|
||||
-moz-transform: translateY(-8px);
|
||||
transform: translateY(-8px); }
|
||||
|
||||
.hint--top-left:hover:after {
|
||||
-webkit-transform: translateX(-100%) translateY(-8px);
|
||||
-moz-transform: translateX(-100%) translateY(-8px);
|
||||
transform: translateX(-100%) translateY(-8px); }
|
||||
|
||||
/**
|
||||
* top-right tooltip
|
||||
*/
|
||||
.hint--top-right:before {
|
||||
margin-bottom: -11px; }
|
||||
|
||||
.hint--top-right:before, .hint--top-right:after {
|
||||
bottom: 100%;
|
||||
left: 50%; }
|
||||
|
||||
.hint--top-right:before {
|
||||
left: calc(50% - 6px); }
|
||||
|
||||
.hint--top-right:after {
|
||||
-webkit-transform: translateX(0);
|
||||
-moz-transform: translateX(0);
|
||||
transform: translateX(0); }
|
||||
|
||||
.hint--top-right:after {
|
||||
margin-left: -12px; }
|
||||
|
||||
.hint--top-right:hover:before {
|
||||
-webkit-transform: translateY(-8px);
|
||||
-moz-transform: translateY(-8px);
|
||||
transform: translateY(-8px); }
|
||||
|
||||
.hint--top-right:hover:after {
|
||||
-webkit-transform: translateY(-8px);
|
||||
-moz-transform: translateY(-8px);
|
||||
transform: translateY(-8px); }
|
||||
|
||||
/**
|
||||
* bottom-left tooltip
|
||||
*/
|
||||
.hint--bottom-left:before {
|
||||
margin-top: -11px; }
|
||||
|
||||
.hint--bottom-left:before, .hint--bottom-left:after {
|
||||
top: 100%;
|
||||
left: 50%; }
|
||||
|
||||
.hint--bottom-left:before {
|
||||
left: calc(50% - 6px); }
|
||||
|
||||
.hint--bottom-left:after {
|
||||
-webkit-transform: translateX(-100%);
|
||||
-moz-transform: translateX(-100%);
|
||||
transform: translateX(-100%); }
|
||||
|
||||
.hint--bottom-left:after {
|
||||
margin-left: 12px; }
|
||||
|
||||
.hint--bottom-left:hover:before {
|
||||
-webkit-transform: translateY(8px);
|
||||
-moz-transform: translateY(8px);
|
||||
transform: translateY(8px); }
|
||||
|
||||
.hint--bottom-left:hover:after {
|
||||
-webkit-transform: translateX(-100%) translateY(8px);
|
||||
-moz-transform: translateX(-100%) translateY(8px);
|
||||
transform: translateX(-100%) translateY(8px); }
|
||||
|
||||
/**
|
||||
* bottom-right tooltip
|
||||
*/
|
||||
.hint--bottom-right:before {
|
||||
margin-top: -11px; }
|
||||
|
||||
.hint--bottom-right:before, .hint--bottom-right:after {
|
||||
top: 100%;
|
||||
left: 50%; }
|
||||
|
||||
.hint--bottom-right:before {
|
||||
left: calc(50% - 6px); }
|
||||
|
||||
.hint--bottom-right:after {
|
||||
-webkit-transform: translateX(0);
|
||||
-moz-transform: translateX(0);
|
||||
transform: translateX(0); }
|
||||
|
||||
.hint--bottom-right:after {
|
||||
margin-left: -12px; }
|
||||
|
||||
.hint--bottom-right:hover:before {
|
||||
-webkit-transform: translateY(8px);
|
||||
-moz-transform: translateY(8px);
|
||||
transform: translateY(8px); }
|
||||
|
||||
.hint--bottom-right:hover:after {
|
||||
-webkit-transform: translateY(8px);
|
||||
-moz-transform: translateY(8px);
|
||||
transform: translateY(8px); }
|
||||
|
||||
/**
|
||||
* source: hint-sizes.scss
|
||||
*
|
||||
* Defines width restricted tooltips that can span
|
||||
* across multiple lines.
|
||||
*
|
||||
* Classes added:
|
||||
* 1) hint--small
|
||||
* 2) hint--medium
|
||||
* 3) hint--large
|
||||
*
|
||||
*/
|
||||
.hint--small:after,
|
||||
.hint--medium:after,
|
||||
.hint--large:after {
|
||||
white-space: normal;
|
||||
line-height: 1.4em;
|
||||
word-wrap: break-word; }
|
||||
|
||||
.hint--small:after {
|
||||
width: 80px; }
|
||||
|
||||
.hint--medium:after {
|
||||
width: 150px; }
|
||||
|
||||
.hint--large:after {
|
||||
width: 300px; }
|
||||
|
||||
/**
|
||||
* source: hint-theme.scss
|
||||
*
|
||||
* Defines basic theme for tooltips.
|
||||
*
|
||||
*/
|
||||
[class*="hint--"] {
|
||||
/**
|
||||
* tooltip body
|
||||
*/ }
|
||||
[class*="hint--"]:after {
|
||||
text-shadow: 0 -1px 0px black;
|
||||
box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.3); }
|
||||
|
||||
/**
|
||||
* source: hint-color-types.scss
|
||||
*
|
||||
* Contains tooltips of various types based on color differences.
|
||||
*
|
||||
* Classes added:
|
||||
* 1) hint--error
|
||||
* 2) hint--warning
|
||||
* 3) hint--info
|
||||
* 4) hint--success
|
||||
*
|
||||
*/
|
||||
/**
|
||||
* Error
|
||||
*/
|
||||
.hint--error:after {
|
||||
background-color: #b34e4d;
|
||||
text-shadow: 0 -1px 0px #592726; }
|
||||
|
||||
.hint--error.hint--top-left:before {
|
||||
border-top-color: #b34e4d; }
|
||||
|
||||
.hint--error.hint--top-right:before {
|
||||
border-top-color: #b34e4d; }
|
||||
|
||||
.hint--error.hint--top:before {
|
||||
border-top-color: #b34e4d; }
|
||||
|
||||
.hint--error.hint--bottom-left:before {
|
||||
border-bottom-color: #b34e4d; }
|
||||
|
||||
.hint--error.hint--bottom-right:before {
|
||||
border-bottom-color: #b34e4d; }
|
||||
|
||||
.hint--error.hint--bottom:before {
|
||||
border-bottom-color: #b34e4d; }
|
||||
|
||||
.hint--error.hint--left:before {
|
||||
border-left-color: #b34e4d; }
|
||||
|
||||
.hint--error.hint--right:before {
|
||||
border-right-color: #b34e4d; }
|
||||
|
||||
/**
|
||||
* Warning
|
||||
*/
|
||||
.hint--warning:after {
|
||||
background-color: #c09854;
|
||||
text-shadow: 0 -1px 0px #6c5328; }
|
||||
|
||||
.hint--warning.hint--top-left:before {
|
||||
border-top-color: #c09854; }
|
||||
|
||||
.hint--warning.hint--top-right:before {
|
||||
border-top-color: #c09854; }
|
||||
|
||||
.hint--warning.hint--top:before {
|
||||
border-top-color: #c09854; }
|
||||
|
||||
.hint--warning.hint--bottom-left:before {
|
||||
border-bottom-color: #c09854; }
|
||||
|
||||
.hint--warning.hint--bottom-right:before {
|
||||
border-bottom-color: #c09854; }
|
||||
|
||||
.hint--warning.hint--bottom:before {
|
||||
border-bottom-color: #c09854; }
|
||||
|
||||
.hint--warning.hint--left:before {
|
||||
border-left-color: #c09854; }
|
||||
|
||||
.hint--warning.hint--right:before {
|
||||
border-right-color: #c09854; }
|
||||
|
||||
/**
|
||||
* Info
|
||||
*/
|
||||
.hint--info:after {
|
||||
background-color: #3986ac;
|
||||
text-shadow: 0 -1px 0px #1a3c4d; }
|
||||
|
||||
.hint--info.hint--top-left:before {
|
||||
border-top-color: #3986ac; }
|
||||
|
||||
.hint--info.hint--top-right:before {
|
||||
border-top-color: #3986ac; }
|
||||
|
||||
.hint--info.hint--top:before {
|
||||
border-top-color: #3986ac; }
|
||||
|
||||
.hint--info.hint--bottom-left:before {
|
||||
border-bottom-color: #3986ac; }
|
||||
|
||||
.hint--info.hint--bottom-right:before {
|
||||
border-bottom-color: #3986ac; }
|
||||
|
||||
.hint--info.hint--bottom:before {
|
||||
border-bottom-color: #3986ac; }
|
||||
|
||||
.hint--info.hint--left:before {
|
||||
border-left-color: #3986ac; }
|
||||
|
||||
.hint--info.hint--right:before {
|
||||
border-right-color: #3986ac; }
|
||||
|
||||
/**
|
||||
* Success
|
||||
*/
|
||||
.hint--success:after {
|
||||
background-color: #458746;
|
||||
text-shadow: 0 -1px 0px #1a321a; }
|
||||
|
||||
.hint--success.hint--top-left:before {
|
||||
border-top-color: #458746; }
|
||||
|
||||
.hint--success.hint--top-right:before {
|
||||
border-top-color: #458746; }
|
||||
|
||||
.hint--success.hint--top:before {
|
||||
border-top-color: #458746; }
|
||||
|
||||
.hint--success.hint--bottom-left:before {
|
||||
border-bottom-color: #458746; }
|
||||
|
||||
.hint--success.hint--bottom-right:before {
|
||||
border-bottom-color: #458746; }
|
||||
|
||||
.hint--success.hint--bottom:before {
|
||||
border-bottom-color: #458746; }
|
||||
|
||||
.hint--success.hint--left:before {
|
||||
border-left-color: #458746; }
|
||||
|
||||
.hint--success.hint--right:before {
|
||||
border-right-color: #458746; }
|
||||
|
||||
/**
|
||||
* source: hint-always.scss
|
||||
*
|
||||
* Defines a persisted tooltip which shows always.
|
||||
*
|
||||
* Classes added:
|
||||
* 1) hint--always
|
||||
*
|
||||
*/
|
||||
.hint--always:after, .hint--always:before {
|
||||
opacity: 1;
|
||||
visibility: visible; }
|
||||
|
||||
.hint--always.hint--top:before {
|
||||
-webkit-transform: translateY(-8px);
|
||||
-moz-transform: translateY(-8px);
|
||||
transform: translateY(-8px); }
|
||||
|
||||
.hint--always.hint--top:after {
|
||||
-webkit-transform: translateX(-50%) translateY(-8px);
|
||||
-moz-transform: translateX(-50%) translateY(-8px);
|
||||
transform: translateX(-50%) translateY(-8px); }
|
||||
|
||||
.hint--always.hint--top-left:before {
|
||||
-webkit-transform: translateY(-8px);
|
||||
-moz-transform: translateY(-8px);
|
||||
transform: translateY(-8px); }
|
||||
|
||||
.hint--always.hint--top-left:after {
|
||||
-webkit-transform: translateX(-100%) translateY(-8px);
|
||||
-moz-transform: translateX(-100%) translateY(-8px);
|
||||
transform: translateX(-100%) translateY(-8px); }
|
||||
|
||||
.hint--always.hint--top-right:before {
|
||||
-webkit-transform: translateY(-8px);
|
||||
-moz-transform: translateY(-8px);
|
||||
transform: translateY(-8px); }
|
||||
|
||||
.hint--always.hint--top-right:after {
|
||||
-webkit-transform: translateY(-8px);
|
||||
-moz-transform: translateY(-8px);
|
||||
transform: translateY(-8px); }
|
||||
|
||||
.hint--always.hint--bottom:before {
|
||||
-webkit-transform: translateY(8px);
|
||||
-moz-transform: translateY(8px);
|
||||
transform: translateY(8px); }
|
||||
|
||||
.hint--always.hint--bottom:after {
|
||||
-webkit-transform: translateX(-50%) translateY(8px);
|
||||
-moz-transform: translateX(-50%) translateY(8px);
|
||||
transform: translateX(-50%) translateY(8px); }
|
||||
|
||||
.hint--always.hint--bottom-left:before {
|
||||
-webkit-transform: translateY(8px);
|
||||
-moz-transform: translateY(8px);
|
||||
transform: translateY(8px); }
|
||||
|
||||
.hint--always.hint--bottom-left:after {
|
||||
-webkit-transform: translateX(-100%) translateY(8px);
|
||||
-moz-transform: translateX(-100%) translateY(8px);
|
||||
transform: translateX(-100%) translateY(8px); }
|
||||
|
||||
.hint--always.hint--bottom-right:before {
|
||||
-webkit-transform: translateY(8px);
|
||||
-moz-transform: translateY(8px);
|
||||
transform: translateY(8px); }
|
||||
|
||||
.hint--always.hint--bottom-right:after {
|
||||
-webkit-transform: translateY(8px);
|
||||
-moz-transform: translateY(8px);
|
||||
transform: translateY(8px); }
|
||||
|
||||
.hint--always.hint--left:before {
|
||||
-webkit-transform: translateX(-8px);
|
||||
-moz-transform: translateX(-8px);
|
||||
transform: translateX(-8px); }
|
||||
|
||||
.hint--always.hint--left:after {
|
||||
-webkit-transform: translateX(-8px);
|
||||
-moz-transform: translateX(-8px);
|
||||
transform: translateX(-8px); }
|
||||
|
||||
.hint--always.hint--right:before {
|
||||
-webkit-transform: translateX(8px);
|
||||
-moz-transform: translateX(8px);
|
||||
transform: translateX(8px); }
|
||||
|
||||
.hint--always.hint--right:after {
|
||||
-webkit-transform: translateX(8px);
|
||||
-moz-transform: translateX(8px);
|
||||
transform: translateX(8px); }
|
||||
|
||||
/**
|
||||
* source: hint-rounded.scss
|
||||
*
|
||||
* Defines rounded corner tooltips.
|
||||
*
|
||||
* Classes added:
|
||||
* 1) hint--rounded
|
||||
*
|
||||
*/
|
||||
.hint--rounded:after {
|
||||
border-radius: 4px; }
|
||||
|
||||
/**
|
||||
* source: hint-effects.scss
|
||||
*
|
||||
* Defines various transition effects for the tooltips.
|
||||
*
|
||||
* Classes added:
|
||||
* 1) hint--no-animate
|
||||
* 2) hint--bounce
|
||||
*
|
||||
*/
|
||||
.hint--no-animate:before, .hint--no-animate:after {
|
||||
-webkit-transition-duration: 0ms;
|
||||
-moz-transition-duration: 0ms;
|
||||
transition-duration: 0ms; }
|
||||
|
||||
.hint--bounce:before, .hint--bounce:after {
|
||||
-webkit-transition: opacity 0.3s ease, visibility 0.3s ease, -webkit-transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24);
|
||||
-moz-transition: opacity 0.3s ease, visibility 0.3s ease, -moz-transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24);
|
||||
transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24); }
|
||||
|
||||
.hint--no-shadow:before, .hint--no-shadow:after {
|
||||
text-shadow: initial;
|
||||
box-shadow: initial; }
|
||||
|
||||
.hint--no-arrow:before {
|
||||
display: none; }
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,38 @@
|
|||
{
|
||||
"name": "hint",
|
||||
"title": "Hint.css",
|
||||
"description": "A tooltip library in CSS for your lovely websites.",
|
||||
"version": "2.7.0",
|
||||
"style": "hint.css",
|
||||
"main": "hint.css",
|
||||
"homepage": "https://kushagra.dev/lab/hint/",
|
||||
"author": {
|
||||
"name": "Kushagra Gour",
|
||||
"email": "chinchang457@gmail.com",
|
||||
"url": "https://kushagra.dev"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/chinchang/hint.css.git"
|
||||
},
|
||||
"bugs": {
|
||||
"url": "https://github.com/chinchang/hint.css/issues"
|
||||
},
|
||||
"license": "MIT",
|
||||
"keywords": [
|
||||
"css",
|
||||
"tooltip",
|
||||
"ui",
|
||||
"sass",
|
||||
"help",
|
||||
"hint"
|
||||
],
|
||||
"devDependencies": {
|
||||
"grunt": "~0.4.1",
|
||||
"grunt-contrib-concat": "~0.3.0",
|
||||
"grunt-contrib-cssmin": "~0.12.3",
|
||||
"grunt-contrib-watch": "~0.5.3",
|
||||
"grunt-sass": "^3.0.2",
|
||||
"node-sass": "^4.13.1"
|
||||
}
|
||||
}
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
{
|
||||
"name": "qtip2",
|
||||
"description": "Introducing... qTip2. The second generation of the advanced qTip plugin for the ever popular jQuery framework.",
|
||||
"version": "2.2.0",
|
||||
"homepage": "http://qtip2.com",
|
||||
"location": "https://github.com/qTip2/bower",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/Craga89/qTip2.git"
|
||||
},
|
||||
"authors": [
|
||||
{
|
||||
"name": "Craig Michael Thompson",
|
||||
"email": "craig@craigsworks.com",
|
||||
"url": "http://craigsworks.com/"
|
||||
}
|
||||
],
|
||||
"license": [
|
||||
"MIT",
|
||||
"GPL"
|
||||
],
|
||||
"keywords": [
|
||||
"tooltip",
|
||||
"tooltips",
|
||||
"jquery",
|
||||
"qtip",
|
||||
"qtip2",
|
||||
"craig",
|
||||
"thompson",
|
||||
"craigsworks"
|
||||
],
|
||||
"main": [
|
||||
"./jquery.qtip.js",
|
||||
"./basic/jquery.qtip.js"
|
||||
],
|
||||
"ignore": [
|
||||
"bin"
|
||||
],
|
||||
"_release": "2.2.0",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "v2.2.0",
|
||||
"commit": "f5300e9a698f203d47307cfdf90399504fd2f6b2"
|
||||
},
|
||||
"_source": "git://github.com/qTip2/bower.git",
|
||||
"_target": "~2.2.0",
|
||||
"_originalSource": "qtip2"
|
||||
}
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
qTip2 Bower Package
|
||||
=====
|
||||
|
||||
Clone into an existing `qtip2` repo clone, and run the ./bin/build script to generate the files. Then push to the repo.
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
{
|
||||
"name": "qtip2",
|
||||
"description": "Introducing... qTip2. The second generation of the advanced qTip plugin for the ever popular jQuery framework.",
|
||||
"version": "2.2.0",
|
||||
"homepage": "http://qtip2.com",
|
||||
"location": "https://github.com/qTip2/bower",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/Craga89/qTip2.git"
|
||||
},
|
||||
"authors": [
|
||||
{
|
||||
"name": "Craig Michael Thompson",
|
||||
"email": "craig@craigsworks.com",
|
||||
"url": "http://craigsworks.com/"
|
||||
}
|
||||
],
|
||||
"license": [
|
||||
"MIT",
|
||||
"GPL"
|
||||
],
|
||||
"keywords": [
|
||||
"tooltip",
|
||||
"tooltips",
|
||||
"jquery",
|
||||
"qtip",
|
||||
"qtip2",
|
||||
"craig",
|
||||
"thompson",
|
||||
"craigsworks"
|
||||
],
|
||||
"main": [
|
||||
"./jquery.qtip.js",
|
||||
"./basic/jquery.qtip.js"
|
||||
],
|
||||
"ignore": [
|
||||
"bin"
|
||||
]
|
||||
}
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
/* qTip2 v2.2.0 tips modal viewport svg imagemap ie6 | qtip2.com | Licensed MIT, GPL | Mon Nov 25 2013 11:54:49 */
|
||||
/*!
|
||||
* imagesLoaded v3.0.4
|
||||
* JavaScript is all like "You images are done yet or what?"
|
||||
*/
|
||||
(function(t){"use strict";function e(t,e){for(var i in e)t[i]=e[i];return t}function i(t){return"[object Array]"===h.call(t)}function s(t){var e=[];if(i(t))e=t;else if("number"==typeof t.length)for(var s=0,o=t.length;o>s;s++)e.push(t[s]);else e.push(t);return e}function o(t,i){function o(t,i,r){if(!(this instanceof o))return new o(t,i);"string"==typeof t&&(t=document.querySelectorAll(t)),this.elements=s(t),this.options=e({},this.options),"function"==typeof i?r=i:e(this.options,i),r&&this.on("always",r),this.getImages(),n&&(this.jqDeferred=new n.Deferred);var a=this;setTimeout(function(){a.check()})}function h(t){this.img=t}o.prototype=new t,o.prototype.options={},o.prototype.getImages=function(){this.images=[];for(var t=0,e=this.elements.length;e>t;t++){var i=this.elements[t];"IMG"===i.nodeName&&this.addImage(i);for(var s=i.querySelectorAll("img"),o=0,n=s.length;n>o;o++){var r=s[o];this.addImage(r)}}},o.prototype.addImage=function(t){var e=new h(t);this.images.push(e)},o.prototype.check=function(){function t(t,o){return e.options.debug&&a&&r.log("confirm",t,o),e.progress(t),i++,i===s&&e.complete(),!0}var e=this,i=0,s=this.images.length;if(this.hasAnyBroken=!1,!s)return this.complete(),void 0;for(var o=0;s>o;o++){var n=this.images[o];n.on("confirm",t),n.check()}},o.prototype.progress=function(t){this.hasAnyBroken=this.hasAnyBroken||!t.isLoaded;var e=this;setTimeout(function(){e.emit("progress",e,t),e.jqDeferred&&e.jqDeferred.notify(e,t)})},o.prototype.complete=function(){var t=this.hasAnyBroken?"fail":"done";this.isComplete=!0;var e=this;setTimeout(function(){if(e.emit(t,e),e.emit("always",e),e.jqDeferred){var i=e.hasAnyBroken?"reject":"resolve";e.jqDeferred[i](e)}})},n&&(n.fn.imagesLoaded=function(t,e){var i=new o(this,t,e);return i.jqDeferred.promise(n(this))});var l={};return h.prototype=new t,h.prototype.check=function(){var t=l[this.img.src];if(t)return this.useCached(t),void 0;if(l[this.img.src]=this,this.img.complete&&void 0!==this.img.naturalWidth)return this.confirm(0!==this.img.naturalWidth,"naturalWidth"),void 0;var e=this.proxyImage=new Image;i.bind(e,"load",this),i.bind(e,"error",this),e.src=this.img.src},h.prototype.useCached=function(t){if(t.isConfirmed)this.confirm(t.isLoaded,"cached was confirmed");else{var e=this;t.on("confirm",function(t){return e.confirm(t.isLoaded,"cache emitted confirmed"),!0})}},h.prototype.confirm=function(t,e){this.isConfirmed=!0,this.isLoaded=t,this.emit("confirm",this,e)},h.prototype.handleEvent=function(t){var e="on"+t.type;this[e]&&this[e](t)},h.prototype.onload=function(){this.confirm(!0,"onload"),this.unbindProxyEvents()},h.prototype.onerror=function(){this.confirm(!1,"onerror"),this.unbindProxyEvents()},h.prototype.unbindProxyEvents=function(){i.unbind(this.proxyImage,"load",this),i.unbind(this.proxyImage,"error",this)},o}var n=t.jQuery,r=t.console,a=r!==void 0,h=Object.prototype.toString;"function"==typeof define&&define.amd?define(["eventEmitter/EventEmitter","eventie/eventie"],o):t.imagesLoaded=o(t.EventEmitter,t.eventie)})(window);
|
||||
//@ sourceMappingURL=http://cdnjs.cloudflare.com/ajax/libs/qtip2/2.2.0/imagesloaded.pkg.min.map
|
||||
|
|
@ -1,623 +0,0 @@
|
|||
/*
|
||||
* qTip2 - Pretty powerful tooltips - v2.2.0
|
||||
* http://qtip2.com
|
||||
*
|
||||
* Copyright (c) 2013 Craig Michael Thompson
|
||||
* Released under the MIT, GPL licenses
|
||||
* http://jquery.org/license
|
||||
*
|
||||
* Date: Mon Nov 25 2013 11:54 GMT+0000
|
||||
* Plugins: tips modal viewport svg imagemap ie6
|
||||
* Styles: basic css3
|
||||
*/
|
||||
.qtip{
|
||||
position: absolute;
|
||||
left: -28000px;
|
||||
top: -28000px;
|
||||
display: none;
|
||||
|
||||
max-width: 280px;
|
||||
min-width: 50px;
|
||||
|
||||
font-size: 10.5px;
|
||||
line-height: 12px;
|
||||
|
||||
direction: ltr;
|
||||
|
||||
box-shadow: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.qtip-content{
|
||||
position: relative;
|
||||
padding: 5px 9px;
|
||||
overflow: hidden;
|
||||
|
||||
text-align: left;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.qtip-titlebar{
|
||||
position: relative;
|
||||
padding: 5px 35px 5px 10px;
|
||||
overflow: hidden;
|
||||
|
||||
border-width: 0 0 1px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.qtip-titlebar + .qtip-content{ border-top-width: 0 !important; }
|
||||
|
||||
/* Default close button class */
|
||||
.qtip-close{
|
||||
position: absolute;
|
||||
right: -9px; top: -9px;
|
||||
|
||||
cursor: pointer;
|
||||
outline: medium none;
|
||||
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.qtip-titlebar .qtip-close{
|
||||
right: 4px; top: 50%;
|
||||
margin-top: -9px;
|
||||
}
|
||||
|
||||
* html .qtip-titlebar .qtip-close{ top: 16px; } /* IE fix */
|
||||
|
||||
.qtip-titlebar .ui-icon,
|
||||
.qtip-icon .ui-icon{
|
||||
display: block;
|
||||
text-indent: -1000em;
|
||||
direction: ltr;
|
||||
}
|
||||
|
||||
.qtip-icon, .qtip-icon .ui-icon{
|
||||
-moz-border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
border-radius: 3px;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.qtip-icon .ui-icon{
|
||||
width: 18px;
|
||||
height: 14px;
|
||||
|
||||
line-height: 14px;
|
||||
text-align: center;
|
||||
text-indent: 0;
|
||||
font: normal bold 10px/13px Tahoma,sans-serif;
|
||||
|
||||
color: inherit;
|
||||
background: transparent none no-repeat -100em -100em;
|
||||
}
|
||||
|
||||
/* Applied to 'focused' tooltips e.g. most recently displayed/interacted with */
|
||||
.qtip-focus{}
|
||||
|
||||
/* Applied on hover of tooltips i.e. added/removed on mouseenter/mouseleave respectively */
|
||||
.qtip-hover{}
|
||||
|
||||
/* Default tooltip style */
|
||||
.qtip-default{
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-color: #F1D031;
|
||||
|
||||
background-color: #FFFFA3;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.qtip-default .qtip-titlebar{
|
||||
background-color: #FFEF93;
|
||||
}
|
||||
|
||||
.qtip-default .qtip-icon{
|
||||
border-color: #CCC;
|
||||
background: #F1F1F1;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.qtip-default .qtip-titlebar .qtip-close{
|
||||
border-color: #AAA;
|
||||
color: #111;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*! Light tooltip style */
|
||||
.qtip-light{
|
||||
background-color: white;
|
||||
border-color: #E2E2E2;
|
||||
color: #454545;
|
||||
}
|
||||
|
||||
.qtip-light .qtip-titlebar{
|
||||
background-color: #f1f1f1;
|
||||
}
|
||||
|
||||
|
||||
/*! Dark tooltip style */
|
||||
.qtip-dark{
|
||||
background-color: #505050;
|
||||
border-color: #303030;
|
||||
color: #f3f3f3;
|
||||
}
|
||||
|
||||
.qtip-dark .qtip-titlebar{
|
||||
background-color: #404040;
|
||||
}
|
||||
|
||||
.qtip-dark .qtip-icon{
|
||||
border-color: #444;
|
||||
}
|
||||
|
||||
.qtip-dark .qtip-titlebar .ui-state-hover{
|
||||
border-color: #303030;
|
||||
}
|
||||
|
||||
|
||||
/*! Cream tooltip style */
|
||||
.qtip-cream{
|
||||
background-color: #FBF7AA;
|
||||
border-color: #F9E98E;
|
||||
color: #A27D35;
|
||||
}
|
||||
|
||||
.qtip-cream .qtip-titlebar{
|
||||
background-color: #F0DE7D;
|
||||
}
|
||||
|
||||
.qtip-cream .qtip-close .qtip-icon{
|
||||
background-position: -82px 0;
|
||||
}
|
||||
|
||||
|
||||
/*! Red tooltip style */
|
||||
.qtip-red{
|
||||
background-color: #F78B83;
|
||||
border-color: #D95252;
|
||||
color: #912323;
|
||||
}
|
||||
|
||||
.qtip-red .qtip-titlebar{
|
||||
background-color: #F06D65;
|
||||
}
|
||||
|
||||
.qtip-red .qtip-close .qtip-icon{
|
||||
background-position: -102px 0;
|
||||
}
|
||||
|
||||
.qtip-red .qtip-icon{
|
||||
border-color: #D95252;
|
||||
}
|
||||
|
||||
.qtip-red .qtip-titlebar .ui-state-hover{
|
||||
border-color: #D95252;
|
||||
}
|
||||
|
||||
|
||||
/*! Green tooltip style */
|
||||
.qtip-green{
|
||||
background-color: #CAED9E;
|
||||
border-color: #90D93F;
|
||||
color: #3F6219;
|
||||
}
|
||||
|
||||
.qtip-green .qtip-titlebar{
|
||||
background-color: #B0DE78;
|
||||
}
|
||||
|
||||
.qtip-green .qtip-close .qtip-icon{
|
||||
background-position: -42px 0;
|
||||
}
|
||||
|
||||
|
||||
/*! Blue tooltip style */
|
||||
.qtip-blue{
|
||||
background-color: #E5F6FE;
|
||||
border-color: #ADD9ED;
|
||||
color: #5E99BD;
|
||||
}
|
||||
|
||||
.qtip-blue .qtip-titlebar{
|
||||
background-color: #D0E9F5;
|
||||
}
|
||||
|
||||
.qtip-blue .qtip-close .qtip-icon{
|
||||
background-position: -2px 0;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.qtip-shadow{
|
||||
-webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
|
||||
-moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
|
||||
box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
/* Add rounded corners to your tooltips in: FF3+, Chrome 2+, Opera 10.6+, IE9+, Safari 2+ */
|
||||
.qtip-rounded,
|
||||
.qtip-tipsy,
|
||||
.qtip-bootstrap{
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.qtip-rounded .qtip-titlebar{
|
||||
-moz-border-radius: 4px 4px 0 0;
|
||||
-webkit-border-radius: 4px 4px 0 0;
|
||||
border-radius: 4px 4px 0 0;
|
||||
}
|
||||
|
||||
/* Youtube tooltip style */
|
||||
.qtip-youtube{
|
||||
-moz-border-radius: 2px;
|
||||
-webkit-border-radius: 2px;
|
||||
border-radius: 2px;
|
||||
|
||||
-webkit-box-shadow: 0 0 3px #333;
|
||||
-moz-box-shadow: 0 0 3px #333;
|
||||
box-shadow: 0 0 3px #333;
|
||||
|
||||
color: white;
|
||||
border-width: 0;
|
||||
|
||||
background: #4A4A4A;
|
||||
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#4A4A4A),color-stop(100%,black));
|
||||
background-image: -webkit-linear-gradient(top,#4A4A4A 0,black 100%);
|
||||
background-image: -moz-linear-gradient(top,#4A4A4A 0,black 100%);
|
||||
background-image: -ms-linear-gradient(top,#4A4A4A 0,black 100%);
|
||||
background-image: -o-linear-gradient(top,#4A4A4A 0,black 100%);
|
||||
}
|
||||
|
||||
.qtip-youtube .qtip-titlebar{
|
||||
background-color: #4A4A4A;
|
||||
background-color: rgba(0,0,0,0);
|
||||
}
|
||||
|
||||
.qtip-youtube .qtip-content{
|
||||
padding: .75em;
|
||||
font: 12px arial,sans-serif;
|
||||
|
||||
filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#4a4a4a,EndColorStr=#000000);
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#4a4a4a,EndColorStr=#000000);";
|
||||
}
|
||||
|
||||
.qtip-youtube .qtip-icon{
|
||||
border-color: #222;
|
||||
}
|
||||
|
||||
.qtip-youtube .qtip-titlebar .ui-state-hover{
|
||||
border-color: #303030;
|
||||
}
|
||||
|
||||
|
||||
/* jQuery TOOLS Tooltip style */
|
||||
.qtip-jtools{
|
||||
background: #232323;
|
||||
background: rgba(0, 0, 0, 0.7);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#717171), to(#232323));
|
||||
background-image: -moz-linear-gradient(top, #717171, #232323);
|
||||
background-image: -webkit-linear-gradient(top, #717171, #232323);
|
||||
background-image: -ms-linear-gradient(top, #717171, #232323);
|
||||
background-image: -o-linear-gradient(top, #717171, #232323);
|
||||
|
||||
border: 2px solid #ddd;
|
||||
border: 2px solid rgba(241,241,241,1);
|
||||
|
||||
-moz-border-radius: 2px;
|
||||
-webkit-border-radius: 2px;
|
||||
border-radius: 2px;
|
||||
|
||||
-webkit-box-shadow: 0 0 12px #333;
|
||||
-moz-box-shadow: 0 0 12px #333;
|
||||
box-shadow: 0 0 12px #333;
|
||||
}
|
||||
|
||||
/* IE Specific */
|
||||
.qtip-jtools .qtip-titlebar{
|
||||
background-color: transparent;
|
||||
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#717171,endColorstr=#4A4A4A);
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#717171,endColorstr=#4A4A4A)";
|
||||
}
|
||||
.qtip-jtools .qtip-content{
|
||||
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4A4A4A,endColorstr=#232323);
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#4A4A4A,endColorstr=#232323)";
|
||||
}
|
||||
|
||||
.qtip-jtools .qtip-titlebar,
|
||||
.qtip-jtools .qtip-content{
|
||||
background: transparent;
|
||||
color: white;
|
||||
border: 0 dashed transparent;
|
||||
}
|
||||
|
||||
.qtip-jtools .qtip-icon{
|
||||
border-color: #555;
|
||||
}
|
||||
|
||||
.qtip-jtools .qtip-titlebar .ui-state-hover{
|
||||
border-color: #333;
|
||||
}
|
||||
|
||||
|
||||
/* Cluetip style */
|
||||
.qtip-cluetip{
|
||||
-webkit-box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);
|
||||
-moz-box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);
|
||||
box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);
|
||||
|
||||
background-color: #D9D9C2;
|
||||
color: #111;
|
||||
border: 0 dashed transparent;
|
||||
}
|
||||
|
||||
.qtip-cluetip .qtip-titlebar{
|
||||
background-color: #87876A;
|
||||
color: white;
|
||||
border: 0 dashed transparent;
|
||||
}
|
||||
|
||||
.qtip-cluetip .qtip-icon{
|
||||
border-color: #808064;
|
||||
}
|
||||
|
||||
.qtip-cluetip .qtip-titlebar .ui-state-hover{
|
||||
border-color: #696952;
|
||||
color: #696952;
|
||||
}
|
||||
|
||||
|
||||
/* Tipsy style */
|
||||
.qtip-tipsy{
|
||||
background: black;
|
||||
background: rgba(0, 0, 0, .87);
|
||||
|
||||
color: white;
|
||||
border: 0 solid transparent;
|
||||
|
||||
font-size: 11px;
|
||||
font-family: 'Lucida Grande', sans-serif;
|
||||
font-weight: bold;
|
||||
line-height: 16px;
|
||||
text-shadow: 0 1px black;
|
||||
}
|
||||
|
||||
.qtip-tipsy .qtip-titlebar{
|
||||
padding: 6px 35px 0 10px;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.qtip-tipsy .qtip-content{
|
||||
padding: 6px 10px;
|
||||
}
|
||||
|
||||
.qtip-tipsy .qtip-icon{
|
||||
border-color: #222;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.qtip-tipsy .qtip-titlebar .ui-state-hover{
|
||||
border-color: #303030;
|
||||
}
|
||||
|
||||
|
||||
/* Tipped style */
|
||||
.qtip-tipped{
|
||||
border: 3px solid #959FA9;
|
||||
|
||||
-moz-border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
border-radius: 3px;
|
||||
|
||||
background-color: #F9F9F9;
|
||||
color: #454545;
|
||||
|
||||
font-weight: normal;
|
||||
font-family: serif;
|
||||
}
|
||||
|
||||
.qtip-tipped .qtip-titlebar{
|
||||
border-bottom-width: 0;
|
||||
|
||||
color: white;
|
||||
background: #3A79B8;
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#3A79B8), to(#2E629D));
|
||||
background-image: -webkit-linear-gradient(top, #3A79B8, #2E629D);
|
||||
background-image: -moz-linear-gradient(top, #3A79B8, #2E629D);
|
||||
background-image: -ms-linear-gradient(top, #3A79B8, #2E629D);
|
||||
background-image: -o-linear-gradient(top, #3A79B8, #2E629D);
|
||||
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#3A79B8,endColorstr=#2E629D);
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#3A79B8,endColorstr=#2E629D)";
|
||||
}
|
||||
|
||||
.qtip-tipped .qtip-icon{
|
||||
border: 2px solid #285589;
|
||||
background: #285589;
|
||||
}
|
||||
|
||||
.qtip-tipped .qtip-icon .ui-icon{
|
||||
background-color: #FBFBFB;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Twitter Bootstrap style.
|
||||
*
|
||||
* Tested with IE 8, IE 9, Chrome 18, Firefox 9, Opera 11.
|
||||
* Does not work with IE 7.
|
||||
*/
|
||||
.qtip-bootstrap{
|
||||
/** Taken from Bootstrap body */
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
color: #333333;
|
||||
|
||||
/** Taken from Bootstrap .popover */
|
||||
padding: 1px;
|
||||
background-color: #ffffff;
|
||||
border: 1px solid #ccc;
|
||||
border: 1px solid rgba(0, 0, 0, 0.2);
|
||||
-webkit-border-radius: 6px;
|
||||
-moz-border-radius: 6px;
|
||||
border-radius: 6px;
|
||||
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
|
||||
-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
|
||||
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
|
||||
-webkit-background-clip: padding-box;
|
||||
-moz-background-clip: padding;
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
.qtip-bootstrap .qtip-titlebar{
|
||||
/** Taken from Bootstrap .popover-title */
|
||||
padding: 8px 14px;
|
||||
margin: 0;
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
line-height: 18px;
|
||||
background-color: #f7f7f7;
|
||||
border-bottom: 1px solid #ebebeb;
|
||||
-webkit-border-radius: 5px 5px 0 0;
|
||||
-moz-border-radius: 5px 5px 0 0;
|
||||
border-radius: 5px 5px 0 0;
|
||||
}
|
||||
|
||||
.qtip-bootstrap .qtip-titlebar .qtip-close{
|
||||
/**
|
||||
* Overrides qTip2:
|
||||
* .qtip-titlebar .qtip-close{
|
||||
* [...]
|
||||
* right: 4px;
|
||||
* top: 50%;
|
||||
* [...]
|
||||
* border-style: solid;
|
||||
* }
|
||||
*/
|
||||
right: 11px;
|
||||
top: 45%;
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
.qtip-bootstrap .qtip-content{
|
||||
/** Taken from Bootstrap .popover-content */
|
||||
padding: 9px 14px;
|
||||
}
|
||||
|
||||
.qtip-bootstrap .qtip-icon{
|
||||
/**
|
||||
* Overrides qTip2:
|
||||
* .qtip-default .qtip-icon {
|
||||
* border-color: #CCC;
|
||||
* background: #F1F1F1;
|
||||
* color: #777;
|
||||
* }
|
||||
*/
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.qtip-bootstrap .qtip-icon .ui-icon{
|
||||
/**
|
||||
* Overrides qTip2:
|
||||
* .qtip-icon .ui-icon{
|
||||
* width: 18px;
|
||||
* height: 14px;
|
||||
* }
|
||||
*/
|
||||
width: auto;
|
||||
height: auto;
|
||||
|
||||
/* Taken from Bootstrap .close */
|
||||
float: right;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
line-height: 18px;
|
||||
color: #000000;
|
||||
text-shadow: 0 1px 0 #ffffff;
|
||||
opacity: 0.2;
|
||||
filter: alpha(opacity=20);
|
||||
}
|
||||
|
||||
.qtip-bootstrap .qtip-icon .ui-icon:hover{
|
||||
/* Taken from Bootstrap .close:hover */
|
||||
color: #000000;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
opacity: 0.4;
|
||||
filter: alpha(opacity=40);
|
||||
}
|
||||
|
||||
|
||||
/* IE9 fix - removes all filters */
|
||||
.qtip:not(.ie9haxors) div.qtip-content,
|
||||
.qtip:not(.ie9haxors) div.qtip-titlebar{
|
||||
filter: none;
|
||||
-ms-filter: none;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.qtip .qtip-tip{
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
z-index: 10;
|
||||
|
||||
}
|
||||
|
||||
/* Opera bug #357 - Incorrect tip position
|
||||
https://github.com/Craga89/qTip2/issues/367 */
|
||||
x:-o-prefocus, .qtip .qtip-tip{
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.qtip .qtip-tip,
|
||||
.qtip .qtip-tip .qtip-vml,
|
||||
.qtip .qtip-tip canvas{
|
||||
position: absolute;
|
||||
|
||||
color: #123456;
|
||||
background: transparent;
|
||||
border: 0 dashed transparent;
|
||||
}
|
||||
|
||||
.qtip .qtip-tip canvas{ top: 0; left: 0; }
|
||||
|
||||
.qtip .qtip-tip .qtip-vml{
|
||||
behavior: url(#default#VML);
|
||||
display: inline-block;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
#qtip-overlay{
|
||||
position: fixed;
|
||||
left: 0; top: 0;
|
||||
width: 100%; height: 100%;
|
||||
}
|
||||
|
||||
/* Applied to modals with show.modal.blur set to true */
|
||||
#qtip-overlay.blurs{ cursor: pointer; }
|
||||
|
||||
/* Change opacity of overlay here */
|
||||
#qtip-overlay div{
|
||||
position: absolute;
|
||||
left: 0; top: 0;
|
||||
width: 100%; height: 100%;
|
||||
|
||||
background-color: black;
|
||||
|
||||
opacity: 0.7;
|
||||
filter:alpha(opacity=70);
|
||||
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
|
||||
}
|
||||
|
||||
|
||||
|
||||
.qtipmodal-ie6fix{
|
||||
position: absolute !important;
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -10,8 +10,8 @@
|
|||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"jquery": "~1.11.0",
|
||||
"qtip2": "~2.2.0",
|
||||
"normalize-css": "~3.0.0",
|
||||
"clipboard": "~1.4.3"
|
||||
"clipboard": "~1.4.3",
|
||||
"hint.css": "^2.7.0"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@ Some communities have strong preferences for particular licenses. If you want to
|
|||
* [GNU](https://www.gnu.org/licenses/license-recommendations.html) recommends [GNU GPLv3](/licenses/gpl-3.0/) for most programs
|
||||
* [npm packages](https://libraries.io/search?platforms=npm) overwhelmingly use the [MIT](/licenses/mit/) or the very similar [ISC](/licenses/isc) licenses
|
||||
* [OpenBSD](https://www.openbsd.org/policy.html) prefers the [ISC License](/licenses/isc/)
|
||||
* [Rust](https://rust-lang.github.io/api-guidelines/necessities.html#crate-and-its-dependencies-have-a-permissive-license-c-permissive) crates are overwhelmingly licensed under both [MIT](/licenses/mit/) and [Apache License 2.0](/licenses/apache-2.0/)
|
||||
* [Rust](https://rust-lang.github.io/api-guidelines/necessities.html#crate-and-its-dependencies-have-a-permissive-license-c-permissive) crates are overwhelmingly licensed [MIT](/licenses/mit/) [`OR`](https://spdx.github.io/spdx-spec/v2.3/SPDX-license-expressions/#d42-disjunctive-or-operator) [Apache License 2.0](/licenses/apache-2.0/)
|
||||
* [WordPress](https://wordpress.org/about/license/) plugins and themes must be [GNU GPLv2](/licenses/gpl-2.0/) (or later)
|
||||
* [Joomla](https://tm.joomla.org/joomla-license-faq.html#can-i-release-an-extension-under-a-non-gpl-license) extensions and templates must be [GNU GPLv2](/licenses/gpl-2.0/) for the PHP code.
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue