Popup

一個在局部顯示提示或通知的組件。

預設樣式

主要元件有 .popup , 標題 .popup-title 以及放置內容的 .popup-content

<div class="popup">
    <div class="popup-box">
        <h6 class="popup-title">Popup Title</h6>
        <p class="popup-content">~略~</p>
    </div>
</div>

箭頭

當需要標示箭頭裝飾圖案時,可在 .popup 上加 .popup-arrow 以及各個方位的 class。

<div class="popup popup-arrow popup-top">~略~</div>

方位

Popup 除了預設位置之外,還有下方、右方跟左方。

<div class="popup popup-arrow popup-top">~略~</div>
<div class="popup popup-arrow popup-top-left">~略~</div>
<div class="popup popup-arrow popup-bottom">~略~</div>
<div class="popup popup-arrow popup-bottom-left">~略~</div>
<div class="popup popup-arrow popup-right">~略~</div>
<div class="popup popup-arrow popup-left">~略~</div>