我正在努力让VMware Clarity UI sidenav正常工作,并且会喜欢一个可靠的例子.我正在使用clear-seed项目和app.component.html里面我有他们提供的默认子项目:
<nav class="sub-nav" [clr-nav-level]="1">
<ul class="nav">
<li class="nav-item">
<a class="nav-link" href="#" [routerLink]="['/home']"
[class.active]="router.url==='/home' || router.url==='/'">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#" [routerLink]="['/about']" [class.active]="router.url==='/about'">About</a>
</li>
</ul>
</nav>
Run Code Online (Sandbox Code Playgroud)
我用以下内容替换了他们的主页:
<nav class="sidenav">
<section class="sidenav-content">
<a class="nav-link" href="/test">Test</a>
</section>
</nav>
Run Code Online (Sandbox Code Playgroud)
sidenav正确显示,但单击Test链接会导致整个应用程序刷新,我的测试页面的内容显示在主页下,但是subnav消失了.如何将测试页面的内容显示在子窗口的右侧?您可以在此处查看代码的GIST:https://gist.github.com/MichaelRegert/6c5d9d3c8b52aa99d1dc66a314239f0e
我正在使用VMware Clarity Design System UI(https://vmware.github.io/clarity/)并正在运行他们的种子应用程序.我正在尝试用我自己的品牌替换他们的品牌图标,但它的尺寸不同.我注意到该图标似乎是硬编码为36px x 36px.如果我尝试在CSS中设置新的大小,它仍然呈现为36px x 36px.这是硬编码的吗?