fancyapps / ui

A library of JavaScript UI components, includes the best lightbox - Fancybox5
https://fancyapps.com/
Other
772 stars 97 forks source link

[Documentation] Typos #406

Closed msev closed 1 year ago

msev commented 1 year ago

Hi @fancyapps,

First of all, thank you for this library.

I found some typos here https://fancyapps.com/fancybox/plugins/toolbar/#items :

<button> tags are not closed in the case of prev, next, thumbs and close.

{
  infobar: {
    tpl: '<div class="fancybox__infobar" tabindex="-1"><span data-fancybox-current-index></span>/<span data-fancybox-count></span></div>',
  },
  download: {
    tpl: '<a title="{{DOWNLOAD}}" class="f-button" data-fancybox-download href="javasript:;"><svg><path d="M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-2M7 11l5 5 5-5M12 4v12"/></svg></a>',
  },
  prev: {
    tpl: '<button title="{{PREV}}" class="f-button" data-fancybox-prev><svg><path d="m15 6-6 6 6 6"/></svg><button>',
  },
  next: {
    tpl: '<button title="{{NEXT}}" class="f-button" data-fancybox-next><svg><path d="m9 6 6 6-6 6"/></svg><button>',
  },
  slideshow: {
    tpl: '<button class="f-button" title="{{TOGGLE_SLIDESHOW}}" data-fancybox-toggle-slideshow><svg><g><path d="M8 4v16l13 -8z"></path></g><g><path d="M8 4v15M17 4v15"/></g></svg></button>',
  },
  fullscreen: {
    tpl: '<button class="f-button" title="{{TOGGLE_FULLSCREEN}}" data-fancybox-toggle-fullscreen><svg><g><path d="M4 8V6a2 2 0 0 1 2-2h2M4 16v2a2 2 0 0 0 2 2h2M16 4h2a2 2 0 0 1 2 2v2M16 20h2a2 2 0 0 0 2-2v-2"/></g><g><path d="M15 19v-2a2 2 0 0 1 2-2h2M15 5v2a2 2 0 0 0 2 2h2M5 15h2a2 2 0 0 1 2 2v2M5 9h2a2 2 0 0 0 2-2V5"/></g></svg></button>',
  },
  thumbs: {
    tpl: '<button class="f-button" title="{{TOGGLE_THUMBS}}" data-fancybox-toggle-thumbs><svg><circle cx="5.5" cy="5.5" r="1"/><circle cx="12" cy="5.5" r="1"/><circle cx="18.5" cy="5.5" r="1"/><circle cx="5.5" cy="12" r="1"/><circle cx="12" cy="12" r="1"/><circle cx="18.5" cy="12" r="1"/><circle cx="5.5" cy="18.5" r="1"/><circle cx="12" cy="18.5" r="1"/><circle cx="18.5" cy="18.5" r="1"/></svg><button>',
  },
  close: {
    tpl: '<button class="f-button" title="{{CLOSE}}" data-fancybox-close><svg><path d="m19.5 4.5-15 15M4.5 4.5l15 15"/></svg><button>',
  },
}
fancyapps commented 1 year ago

Hi,

Thank you so much for noticing and reporting! Docs were updated and the code changes will be included in the next commit.