Superset导航栏高亮问题处理
在superset => templates => appbuilder 文件夹下找到 navbar.html 如果没有可对应新建,navbar.html内容如下
{% set menu = appbuilder.menu %}
{% set languages = appbuilder.languages %}
{% set WARNING_MSG = appbuilder.app.config.get('WARNING_MSG') %}
{% set app_icon_width = appbuilder.app.config.get('APP_ICON_WIDTH', 126) %}
{% set logo_target_path = appbuilder.app.config.get('LOGO_TARGET_PATH') or '/profile/{}/'.format(current_user.username) %}
<div class="navbar navbar-static-top {{ menu.extra_classes }}" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="{{ '/superset' + logo_target_path if current_user.username is defined else '#' }}">
<img
width="{{ app_icon_width }}"
src="{{ appbuilder.app_icon }}"
alt="{{ appbuilder.app_name }}"
/>
</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
{% if WARNING_MSG %}
<li class="alert alert-danger">
{{ WARNING_MSG | safe }}
</li>
{% endif %}
{% include 'appbuilder/navbar_menu.html' %}
</ul>
<ul class="nav navbar-nav navbar-right">
{% include 'appbuilder/navbar_right.html' %}
</ul>
</div>
</div>
</div>
<script>
// Highlight the navbar menu
const menus = document.querySelectorAll('.nav.navbar-nav li')
for (const menu of menus.values()) {
const classes = menu.getAttribute('class')
const as = menu.querySelectorAll('a')
for (const a of as.values()) {
const href = a.getAttribute('href')
let path = location.pathname
if (path.indexOf(href) > -1) {
menu.setAttribute('class', `${classes} active`)
} else {
menu.setAttribute('class', `${classes}`)
}
}
}
</script>
存在的问题:带有下拉菜单的不能高亮
Superset导航栏高亮问题处理的更多相关文章
- jquery导航栏高亮(二级菜单点击一级保持高亮)
<script type="text/javascript"> var urlstr = location.href; var urlstatus=false; $(& ...
- phpcms 完美实现 导航栏当前栏目高亮
我们在用phpcms做网站的时候,经常碰到导航栏高亮功能,或者侧栏高亮,这个会涉及到几个问题: .栏目列表页子栏目高亮判断,如果当前页面为子栏目,他的顶级栏目如果在导航栏也要高亮. .内容页高亮,这个 ...
- elementUI的导航栏在刷新页面的时候选中状态消失的解决
首先elementUI的导航栏中的选中项的高亮显示时的字体颜色可以在属性中设置,但是高亮时的背景颜色不能设置,所以要自己修改高亮的背景颜色 .el-menu-item.is-active { back ...
- PHPCMS V9 导航栏当前栏目高亮
实际上这个东西可有可无,很多站点看似导航栏当鼠标指向后都会变化等高亮处理,一般都比较醒目,但是实质点击过去后,都还是只是刚才的样式,因为这些站点的导航栏都没有对当前选中栏目做CSS的指定变化处理. 该 ...
- vue-router+elelment-ui,实现导航栏激活高亮
<el-menu :default-active="$route.path" class="el-menu-vertical-demo" backgrou ...
- iOS开发笔记13:顶部标签式导航栏及下拉分类菜单
当内容及分类较多时,往往采用顶部标签式导航栏,例如网易新闻客户端的顶部分类导航,最近刚好有这样的应用场景,参考网络上一些demo,实现了这种导航效果,记录一些要点. 效果图(由于视频转GIF掉帧,滑动 ...
- [iOS微博项目 - 1.1] - 设置导航栏主题(统一样式)
A.导航栏两侧文字按钮 1.需求: 所有导航栏两侧的文字式按钮统一样式 普通样式:橙色 高亮样式:红色 不可用样式:亮灰 阴影:不使用 字体大小:15 github: https://github ...
- mui底部导航栏切换分页
使用Hbuilder的mui框架开发移动端非常便利.高效: 底部导航栏切换功能也是移动APP开发中必须实现的: 引入mui文件.下面会用到jquery,同时引进 <link href=" ...
- element-ui使用导航栏跳转路由用法
element-ui使用导航栏跳转路由用法 最近初学vue,试着做一个小项目熟悉语法与思想,其中使用elemen-ui的导航栏做路由跳转切换页面.下面记录一下学习过程 element-ui引入vue项 ...
- 根据location地址,在导航栏高亮显示当前页面
获取当前页面的地址栏.与导航栏中所有<a> 标签的href属性 进行比较.如果相等则高亮显示 此<a>标签. 注意点:a 标签的href 属性在浏览器解析时 是绝对路径. a ...
随机推荐
- Linux 内核:设备树(1)dtb格式
Linux 内核:设备树(1)dtb格式 背景 dtb作为二进制文件被加载到内存中,然后由内核读取并进行解析,如果对dtb文件的格式不了解,那么在看设备树解析相关的内核代码时将会寸步难行,而阅读源代码 ...
- Xilinux PS与PL交互::Linux-App读写REG
Xilinux PS与PL交互::Linux-App读写REG 背景 PL配置好有关的硬件,PS端做验证. 设计方案:针对REG地址,不使用设备树配置. 遇到的问题:暂无. 验证目的 验证PL-PS的 ...
- Freertos学习:05-内核控制
--- title: rtos-freertos-05-kernel-control date: 2020-06-22 11:10:19 categories: tags: - kernel - fr ...
- Java -jar 启动程序参数说明
Springboot环境下的启动参数说明 # Java启动命令语法: java [options] -jar file.jar [arguments] java -jar [options] file ...
- SQL注入方法
目录 前言 如何测试与利用注入点 手工 注入思路 工具 sqlmap -r -u -m --level --risk -v -p --threads -batch-smart --os-shell - ...
- 基于Java网络书店商城设计实现(源码+lw+部署文档+讲解等)
系统介绍: 随着科学技术的飞速发展,各行各业都在努力与现代先进技术接轨,通过科技手段提高自身的优势:对于网络书店商城当然也不能排除在外,随着网络技术的不断成熟,带动了网络书店商城,它彻底改变了过去传统 ...
- [oeasy]python0029_放入系统路径_PATH_chmod_程序路径_执行原理
放入路径 回忆上次内容 上次总算可以把 sleep.py 直接执行了 sleep.py文件头部要声明好打开方式 #!/usr/bin/python3 用的是 python3 解释 sleep.py ...
- 在Eclipse中使用Project Explorer视图与Package Explorer视图
1.在项目文件比较多的情况下,为了方便查看整体和及时定位到项目文件,通常会同时使用Project Explorer视图与Package Explorer视图. 2.打开Project Explorer ...
- Springboot层级关系以及作用
entity entity是实体层,与model,pojo相似,是存放实体的类,类中定义了多个类属性,并且与数据库表的字段保持一致,一张表对应了一个entity类.主要用于定于与数据库对象对应的属性, ...
- 关于netty 一些使用细节
netty 的客户端通常是websoket 但是为了演示也可以用netty做客户端, Channel:可以被理解为数据传输的通道. Pipeline:可以被视为一个由多个工序组成的流水线,负责将数 ...