You are here

content_sync.help.css in Content Synchronization 3.0.x

Same filename and directory in other branches
  1. 8.2 css/content_sync.help.css
  2. 8 css/content_sync.help.css

Help styles.

See also

/admin/help/content_sync

/admin/help/content_sync/introduction

File

css/content_sync.help.css
View source
  1. /**
  2. * @file
  3. * Help styles.
  4. *
  5. * @see /admin/help/content_sync
  6. * @see /admin/help/content_sync/introduction
  7. */
  8. /**
  9. * Help block.
  10. */
  11. .block-help {
  12. margin: 1em 0;
  13. }
  14. /**
  15. * Help page.
  16. */
  17. .content_sync-help h2 {
  18. margin-bottom: 20px;
  19. }
  20. .content_sync-help h2 + div {
  21. margin-bottom: 30px;
  22. }
  23. .content_sync-help h4 {
  24. font-size: 1em;
  25. text-transform: uppercase;
  26. }
  27. .content_sync-help a,
  28. .content_sync-help ~ .links a {
  29. text-decoration: underline;
  30. }
  31. .content_sync-help a:hover,
  32. .content_sync-help ~ .links a:hover {
  33. text-decoration: none;
  34. }
  35. .content_sync-help a:focus,
  36. .content_sync-help ~ .links a:focus {
  37. outline: 1px dotted;
  38. text-decoration: none;
  39. }
  40. .content_sync-help dt a {
  41. font-weight: bold;
  42. text-decoration: none;
  43. }
  44. .content_sync-help dt a:hover {
  45. text-decoration: underline;
  46. }
  47. .content_sync-help img {
  48. width: 100%;
  49. height: auto;
  50. }
  51. .content_sync-help .button.button--primary {
  52. width: 100%;
  53. max-width: 600px;
  54. margin: 0;
  55. text-decoration: none;
  56. }
  57. .content_sync-help .button:focus {
  58. outline: none;
  59. }
  60. .content_sync-help .content_sync-help-video-youtube {
  61. max-width: 600px;
  62. }
  63. /**
  64. * Help play button.
  65. */
  66. .button.button-content_sync-play:before {
  67. content: '► ';
  68. font-size: .8em;
  69. }
  70. /**
  71. * Help menu.
  72. *
  73. * @see /core/themes/stable/css/core/dropbutton/dropbutton.css
  74. */
  75. .content_sync-help-menu {
  76. display: none;
  77. }
  78. .js .content_sync-help-menu {
  79. display: block;
  80. width: 250px;
  81. float: right;
  82. }
  83. .js .content_sync-help-menu .dropbutton-wrapper {
  84. min-height: 2em;
  85. }
  86. .js .content_sync-help-menu .dropbutton-wrapper {
  87. display: block;
  88. position: relative;
  89. }
  90. .js .content_sync-help-menu .dropbutton-widget {
  91. position: absolute;
  92. }
  93. /**
  94. * Hide throbber which causes layout issue in dropbutton
  95. */
  96. .content_sync-help-menu .dropbutton-multiple .ajax-progress-throbber {
  97. display: none;
  98. }
  99. @media screen and (max-width: 768px) {
  100. .js .content_sync-help-menu {
  101. display: none;
  102. }
  103. }
  104. /**
  105. * Help accordion.
  106. */
  107. .content_sync-help-accordion dt {
  108. font-weight: bold;
  109. }
  110. /**
  111. * Help video.
  112. */
  113. .content_sync-help-video-youtube {
  114. margin: 1.5em 0;
  115. max-width: 1024px;
  116. border: 1px solid #000;
  117. }
  118. .content_sync-help-video-youtube--container {
  119. position: relative;
  120. padding-bottom: 56.25%;
  121. padding-top: 30px;
  122. height: 0;
  123. overflow: hidden;
  124. }
  125. .content_sync-help-video-youtube iframe {
  126. position: absolute;
  127. top: 0;
  128. left: 0;
  129. width: 100%;
  130. height: 100%;
  131. }