@collab-ui/core
Version:
Cisco Collab UI CSS Framework
62 lines (61 loc) • 2.65 kB
HTML
<div class="cui-lightbox__container">
<div aria-labelledby="cui-lightbox" class="cui-lightbox" id=
"react-aria-modal-dialog" role="dialog" tabindex="-1">
<div class="cui-lightbox__header">
<div class="cui-lightbox__header-item--left">
<div class="cui-lightbox__header-meta">
<div class="cui-lightbox__header-sharer">
Shared by test
</div>
<div class="cui-lightbox__header-timestamp">
At 4/17/2018, 10:02 AM
</div>
</div>
</div>
<div class="cui-lightbox__header-item--center">
<div class="cui-lightbox__header-name">
Screen Shot 2018-04-11 at 7.32.51 PM.png
</div>
</div>
<div class="cui-lightbox__header-item--right">
<span></span>
<div class="cui-lightbox__control" role="button" tabindex="0">
<span><i class="cui-icon icon icon-cancel_16"></i></span>
</div>
</div>
</div>
<div class="cui-lightbox__body">
<div class="cui-lightbox__content" role="button" tabindex="0">
<div class="cui-lightbox__viewport">
<div class="cui-lightbox__viewport-wrapper" style=
"width: 500px; height: 500px;"><img alt="" class=
"cui-lightbox__viewport-image" draggable="false" src=
"https://place-hold.it/500x500&text=Placeholder&fontsize=33"></div>
</div>
<div class="cui-lightbox__viewer-controls" role="button" tabindex="0">
<div class="cui-lightbox__controls">
<span></span>
<div class="cui-lightbox__control" role="button" tabindex="0">
<span><i class="cui-icon icon icon-zoom-out_16"></i></span>
</div><span class=
"cui-lightbox__control-value">100%</span><span></span>
<div class="cui-lightbox__control" role="button" tabindex="0">
<span><i class="cui-icon icon icon-zoom-out_16"></i></span>
</div>
</div>
<div class="cui-lightbox__controls">
<span class="cui-lightbox__control-value">1</span>
</div>
<div class="cui-lightbox__controls">
<span class="cui-lightbox__control-value">34.4
KB</span><span></span>
<div class="cui-lightbox__control cui-lightbox__control-download"
role="button" tabindex="0">
<span><i class="cui-icon icon icon-download_16"></i></span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>