No internet connection
  1. Home
  2. Ideas

Add a border to images

By @Mr.Nobody
    2022-05-05 12:55:29.528Z2022-05-05 14:36:17.187Z

    Most screenshots have white background, like the forum, which makes it hard to see where a screenshot starts and ends. This can be confusing when screenshotting text.

    Could you add the "shadow class" to images by default? https://about.gitlab.com/handbook/markdown-guide/#shadow

    I tried adding it manually to the image, but the editor does not recognize it.

    Preview of issue:

    https://forum.nuance.xyz/-42/editor-is-not-displaying-line-spacing-correctly-header-spacing-very-buggy

    Solved in post #2, click to view
    • 3 replies
    1. Nice idea. Thanks for the links. Hmm, maybe whether or not the .shadow class is there by default or not, could be a theme config option (later when there are themes). (Probably I shouldn't change how this looks, in all existing sites. But seems like a good default for new sites.)

      For now, to add shadows around all images, you can edit the CSS: (here: https:// ty site /-/admin/customize/css-js)

      .dw-p-bd-blk img {
          box-shadow: 2px 2px 10px rgb(0 0 0 / 35%);
          margin-left: 6px;
          max-width: calc(100% - 13px);
      }
      

      (This is the shadow color GitLab uses: box-shadow: 0 4px 18px 0 rgba(0,0,0,.1),0 6px 20px 0 rgba(0,0,0,.09); )

      Reply1 LikeSolution
      1. @Mr.Nobody
          2022-05-17 17:59:05.147Z

          works! and looks sooo much better (IMO), thank you!

          1. Ok :- )

        • Progress
          with doing this idea
        • @KajMagnus marked this topic as Planned 2022-05-17 15:13:57.364Z.