David A. Windham
david
/
lychee
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Tree: 4acf76181e
Branches Tags
lychee
/
assets
/
scss
/
tooltip.scss

tooltip.scss 2.0 KB
History Raw

123456789101112131415161718192021222324252627282930313233 
  1. /**
    2. 

  2.  * @name        tooltip.css
    3. 

  3.  */
    4. 

  4. 

  5. .tipsy {
    6. 

  6. 	padding: 4px;
    7. 

  7. 	font-size: 12px;
    8. 

  8. 	position: absolute;
    9. 

  9. 	z-index: 100000;
    10. 

  10. 	animation-name: fadeIn;
    11. 

  11. 	animation-duration: .3s;
    12. 

  12. }
    13. 

  13. .tipsy-inner {
    14. 

  14. 	padding: 8px 10px 7px;
    15. 

  15. 	color: #fff;
    16. 

  16. 	max-width: 200px;
    17. 

  17. 	text-align: center;
    18. 

  18. 	background: rgba(0, 0, 0, .8);
    19. 

  19. 	border-radius: 25px;
    20. 

  20. }
    21. 

  21. .tipsy-arrow { position: absolute; width: 0; height: 0; line-height: 0; border: 5px dashed rgba(0, 0, 0, .8); }
    22. 

  22. .tipsy-arrow-n { border-bottom-color: rgba(0, 0, 0, .8); }
    23. 

  23. .tipsy-arrow-s { border-top-color: rgba(0, 0, 0, .8); }
    24. 

  24. .tipsy-arrow-e { border-left-color: rgba(0, 0, 0, .8); }
    25. 

  25. .tipsy-arrow-w { border-right-color: rgba(0, 0, 0, .8); }
    26. 

  26. .tipsy-n .tipsy-arrow { top: 0px; left: 50%; margin-left: -5px; border-bottom-style: solid; border-top: none; border-left-color: transparent; border-right-color: transparent; }
    27. 

  27. .tipsy-nw .tipsy-arrow { top: 0; left: 10px; border-bottom-style: solid; border-top: none; border-left-color: transparent; border-right-color: transparent;}
    28. 

  28. .tipsy-ne .tipsy-arrow { top: 0; right: 10px; border-bottom-style: solid; border-top: none;  border-left-color: transparent; border-right-color: transparent;}
    29. 

  29. .tipsy-s .tipsy-arrow { bottom: 0; left: 50%; margin-left: -5px; border-top-style: solid; border-bottom: none;  border-left-color: transparent; border-right-color: transparent; }
    30. 

  30. .tipsy-sw .tipsy-arrow { bottom: 0; left: 10px; border-top-style: solid; border-bottom: none;  border-left-color: transparent; border-right-color: transparent; }
    31. 

  31. .tipsy-se .tipsy-arrow { bottom: 0; right: 10px; border-top-style: solid; border-bottom: none; border-left-color: transparent; border-right-color: transparent; }
    32. 

  32. .tipsy-e .tipsy-arrow { right: 0; top: 50%; margin-top: -5px; border-left-style: solid; border-right: none; border-top-color: transparent; border-bottom-color: transparent; }
    33. 

  33. .tipsy-w .tipsy-arrow { left: 0; top: 50%; margin-top: -5px; border-right-style: solid; border-left: none; border-top-color: transparent; border-bottom-color: transparent; }
    34.