linkform.css 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  1. /*
  2. * Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  4. */
  5. @import "@ckeditor/ckeditor5-ui/theme/mixins/_rwd.css";
  6. .ck.ck-link-form {
  7. padding: var(--ck-spacing-standard);
  8. &:focus {
  9. /* https://github.com/ckeditor/ckeditor5-link/issues/90 */
  10. outline: none;
  11. }
  12. & > :not(:first-child) {
  13. margin-left: var(--ck-spacing-standard);
  14. }
  15. @mixin ck-media-phone {
  16. padding: 0;
  17. width: calc(.8 * var(--ck-input-text-width));
  18. & .ck-labeled-input {
  19. margin: var(--ck-spacing-standard) var(--ck-spacing-standard) 0;
  20. & .ck-input-text {
  21. min-width: 0;
  22. width: 100%;
  23. }
  24. }
  25. & .ck-button {
  26. padding: var(--ck-spacing-standard);
  27. margin-top: var(--ck-spacing-standard);
  28. margin-left: 0;
  29. border-radius: 0;
  30. border: 0;
  31. border-top: 1px solid var(--ck-color-base-border);
  32. &:first-of-type {
  33. border-right: 1px solid var(--ck-color-base-border);
  34. }
  35. }
  36. }
  37. }
  38. /*
  39. * Style link form differently when manual decorators are available.
  40. * See: https://github.com/ckeditor/ckeditor5-link/issues/186.
  41. */
  42. .ck.ck-link-form_layout-vertical {
  43. padding: 0;
  44. min-width: var(--ck-input-text-width);
  45. & .ck-labeled-input {
  46. margin: var(--ck-spacing-standard) var(--ck-spacing-standard) var(--ck-spacing-small);
  47. & .ck-input-text {
  48. min-width: 0;
  49. width: 100%;
  50. }
  51. }
  52. & .ck-button {
  53. padding: var(--ck-spacing-standard);
  54. margin: 0;
  55. border-radius: 0;
  56. border: 0;
  57. border-top: 1px solid var(--ck-color-base-border);
  58. width: 50%;
  59. &:first-of-type {
  60. border-right: 1px solid var(--ck-color-base-border);
  61. }
  62. }
  63. /* Using additional `.ck` class for stronger CSS specificity than `.ck.ck-link-form > :not(:first-child)`. */
  64. & .ck.ck-list {
  65. margin-left: 0;
  66. & .ck-button.ck-switchbutton {
  67. border: 0;
  68. width: 100%;
  69. &:hover {
  70. background: none;
  71. }
  72. }
  73. }
  74. }