nav-links.css 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
  1. /* Styles for the node state*/
  2. .wh_publication_toc .topicref {
  3. display: flex;
  4. align-items: baseline;
  5. }
  6. .wh_publication_toc .wh-expand-btn:before{
  7. display: inline-block;
  8. font-family: "oXygen WebHelp", serif;
  9. font-size: .7em;
  10. font-weight: lighter;
  11. font-style: normal;
  12. width: 12px;
  13. height: 12px;
  14. margin-right: 4px;
  15. border: 2px solid transparent;
  16. opacity: 0.5;
  17. }
  18. .wh_publication_toc:hover .wh-expand-btn:before {
  19. opacity: 0.8;
  20. }
  21. @media only screen and (max-width: 767px) {
  22. .wh_publication_toc .wh-expand-btn:before {
  23. opacity: 0.8;
  24. }
  25. }
  26. .wh_publication_toc span[data-state=expanded] > .wh-expand-btn:before {
  27. content: "p";
  28. }
  29. .wh_publication_toc span[data-state=not-ready] > .wh-expand-btn:before,
  30. .wh_publication_toc span[data-state=collapsed] > .wh-expand-btn:before {
  31. content: "q";
  32. }
  33. .wh_publication_toc span[data-state=collapsed] ~ ul {
  34. display: none;
  35. }
  36. .wh_publication_toc span[data-state=leaf] > .wh-expand-btn:before {
  37. content : " ";
  38. }
  39. .wh_publication_toc span[data-state=pending] > .wh-expand-btn:before {
  40. display: inline-block;
  41. content: " ";
  42. border: 2px solid #f3f3f3; /* Light grey */
  43. border-top: 2px solid #3498db; /* Blue */
  44. border-radius: 50%;
  45. animation: spin 2s linear infinite;
  46. transition: border 1s;
  47. }
  48. @media screen {
  49. @keyframes spin {
  50. 0% { transform: rotate(0deg); }
  51. 100% { transform: rotate(360deg); }
  52. }
  53. }
  54. /* WH-1565 Inherit the styles of the parent node */
  55. .wh_publication_toc .topicref a * {
  56. color: inherit !important;
  57. background-color: transparent !important;
  58. }
  59. /* ------------------ Menu --------------------------- */
  60. @media screen {
  61. @keyframes blink {
  62. 0% { opacity: .2; }
  63. 20% { opacity: 1; }
  64. 100% { opacity: .2; }
  65. }
  66. }
  67. .wh_top_menu .loading {
  68. padding: 0 10px 10px 10px;
  69. }
  70. .wh_top_menu .loading .dot:before {
  71. content: ".";
  72. display: inline-block;
  73. font-size: 3em;
  74. font-weight: bold;
  75. line-height: 1em;
  76. color: #ffffff;
  77. }
  78. .wh_top_menu .loading .dot {
  79. animation-name: blink;
  80. animation-duration: 1.4s;
  81. animation-iteration-count: infinite;
  82. animation-fill-mode: both;
  83. }
  84. .wh_top_menu .loading .dot:nth-child(2) {
  85. animation-delay: .2s;
  86. }
  87. .wh_top_menu .loading .dot:nth-child(3) {
  88. animation-delay: .4s;
  89. }
  90. .wh_top_menu .state[data-state="expanded"] + .loading {
  91. display: none;
  92. }