Element Plus Header

Usage

el_header(..., height = "60px", style = NULL, class = NULL)

Arguments

...: Content.
height: Header height. Defaults to "60px", as in Element Plus, which sets it as the CSS variable --el-<part>-<size>.
style: Extra inline style.
class: Extra CSS classes.

Value

A Shiny UI element.

Examples

el_header("Dashboard")
#> <header class="el-header" style="--el-header-height:60px">Dashboard</header>
el_header(height = "80px", el_button("refresh", "Refresh"))
#> <header class="el-header" style="--el-header-height:80px">
#>   <div id="refresh" data-shiny-vue style="display: contents">
#>     <script type="text/x-template" data-shiny-vue-template><div id="refresh_container" style="display: contents">
#>   <el-button :type="type === null ? undefined : type" :plain="plain === null ? undefined : plain" :round="round === null ? undefined : round" :circle="circle" :loading="loading" :disabled="disabled" :native-type="native_type" @click="handleClick" :size="size === null ? undefined : size" :icon="icon === null ? undefined : icon" :autofocus="autofocus === null ? undefined : autofocus" :auto-insert-space="autoInsertSpace === null ? undefined : autoInsertSpace" :bg="bg === null ? undefined : bg" :color="color === null ? undefined : color" :dark="dark === null ? undefined : dark" :dashed="dashed === null ? undefined : dashed" :link="link === null ? undefined : link" :loading-icon="loadingIcon === null ? undefined : loadingIcon" :tag="tag === null ? undefined : tag" :text="text === null ? undefined : text">{{label}}</el-button>
#> </div></script>
#>     <script type="application/json" data-shiny-vue-options>{"options":{"data":{"label":"Refresh","type":null,"size":null,"plain":null,"round":null,"circle":false,"loading":false,"disabled":false,"native_type":"button","icon":null,"count":0,"autofocus":false,"autoInsertSpace":null,"bg":null,"color":null,"dark":null,"dashed":null,"link":null,"loadingIcon":null,"tag":null,"text":null},"methods":{"handleClick":"function() { if (this.disabled || this.loading) return; this.count++; }"}},"input":"count","rate":null,"type":"shiny.action","use":["shinyElement.plugin"],"evals":["options.methods.handleClick"]}</script>
#>   </div>
#> </header>