Box Arrow

Preview

Module & Import

js

import { BoxArrow } from 'gadjet/dist/module/ui/box-arrow/box-arrow.js';

Usage

js <script defer>

import { BoxArrow } from 'gadjet';

BoxArrow.define('el-box-arrow');
BoxArrow.tagStyle({
    arrow: 'top', // arrow direction: top, right, bottom or left
    arrowSize: '8px',
    position: '50%', // arrow position on it's side.
    bgColor: '#ccc',
    borderWidth: '1px',
    borderStyle: 'solid',
    borderColor: 'black',
    borderRadius: '4px'
})

BoxArrow.classStyle('right', {arrow: 'right'});

html

<el-box-arrow>Top Arow</el-box-arrow>
<el-box-arrow class="right">Right Arrow</el-box-arrow>