@triptease/tt-navbar 0.0.13 → 0.0.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/src/TtNavbar.d.ts +5 -0
- package/dist/src/TtNavbar.js +59 -17
- package/dist/src/TtNavbar.js.map +1 -1
- package/dist/src/styles.js +62 -4
- package/dist/src/styles.js.map +1 -1
- package/dist/test/tt-navbar.test.js +87 -2
- package/dist/test/tt-navbar.test.js.map +1 -1
- package/dist/web/TtNavbar.js +253 -133
- package/dist/web/TtNavbar.js.map +4 -4
- package/dist/web/index.js +253 -133
- package/dist/web/index.js.map +4 -4
- package/dist/web/styles.js +63 -5
- package/dist/web/styles.js.map +2 -2
- package/dist/web/triptease-logo.js +1 -1
- package/dist/web/tt-navbar.js +253 -133
- package/dist/web/tt-navbar.js.map +4 -4
- package/package.json +1 -1
- package/src/TtNavbar.ts +74 -17
- package/src/styles.ts +63 -4
- package/test/tt-navbar.test.ts +136 -5
package/dist/web/styles.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @triptease/tt-navbar v0.0.
|
|
2
|
+
* @triptease/tt-navbar v0.0.14
|
|
3
3
|
*/
|
|
4
4
|
|
|
5
5
|
// ../../node_modules/@lit/reactive-element/css-tag.js
|
|
@@ -551,6 +551,18 @@ o4?.({ LitElement: i4 });
|
|
|
551
551
|
(s3.litElementVersions ?? (s3.litElementVersions = [])).push("4.2.0");
|
|
552
552
|
|
|
553
553
|
// src/styles.ts
|
|
554
|
+
var visuallyHiddenCss = i`
|
|
555
|
+
position: absolute;
|
|
556
|
+
width: 1px;
|
|
557
|
+
height: 1px;
|
|
558
|
+
margin: -1px;
|
|
559
|
+
padding: 0;
|
|
560
|
+
border: 0;
|
|
561
|
+
overflow: hidden;
|
|
562
|
+
clip: rect(0 0 0 0);
|
|
563
|
+
clip-path: inset(50%);
|
|
564
|
+
white-space: nowrap;
|
|
565
|
+
`;
|
|
554
566
|
var styles = i`
|
|
555
567
|
:host {
|
|
556
568
|
--nav-bar-width: 260px;
|
|
@@ -585,6 +597,39 @@ var styles = i`
|
|
|
585
597
|
width: 100%;
|
|
586
598
|
}
|
|
587
599
|
|
|
600
|
+
.nav-items.sidebar-closed {
|
|
601
|
+
a span {
|
|
602
|
+
${visuallyHiddenCss}
|
|
603
|
+
}
|
|
604
|
+
|
|
605
|
+
details summary span {
|
|
606
|
+
${visuallyHiddenCss}
|
|
607
|
+
}
|
|
608
|
+
}
|
|
609
|
+
|
|
610
|
+
.sidebar-header {
|
|
611
|
+
width: 100%;
|
|
612
|
+
display: grid;
|
|
613
|
+
grid-template-columns: 1fr auto;
|
|
614
|
+
align-items: center;
|
|
615
|
+
justify-content: center;
|
|
616
|
+
padding: 0 var(--space-scale-2);
|
|
617
|
+
|
|
618
|
+
button {
|
|
619
|
+
background-color: transparent;
|
|
620
|
+
color: var(--color-text-inverted-400);
|
|
621
|
+
border: none;
|
|
622
|
+
}
|
|
623
|
+
}
|
|
624
|
+
|
|
625
|
+
.sidebar-header.sidebar-closed {
|
|
626
|
+
padding: 0 var(--space-scale-1);
|
|
627
|
+
.logo {
|
|
628
|
+
display: none;
|
|
629
|
+
visibility: hidden;
|
|
630
|
+
}
|
|
631
|
+
}
|
|
632
|
+
|
|
588
633
|
hr {
|
|
589
634
|
width: 100%;
|
|
590
635
|
height: 1px;
|
|
@@ -610,6 +655,19 @@ var styles = i`
|
|
|
610
655
|
}
|
|
611
656
|
}
|
|
612
657
|
|
|
658
|
+
.tertiary-nav.sidebar-closed {
|
|
659
|
+
.external-link,
|
|
660
|
+
slot,
|
|
661
|
+
hr {
|
|
662
|
+
display: none;
|
|
663
|
+
visibility: hidden;
|
|
664
|
+
}
|
|
665
|
+
|
|
666
|
+
a span {
|
|
667
|
+
${visuallyHiddenCss}
|
|
668
|
+
}
|
|
669
|
+
}
|
|
670
|
+
|
|
613
671
|
.icon {
|
|
614
672
|
display: flex;
|
|
615
673
|
align-items: center;
|
|
@@ -632,6 +690,10 @@ var styles = i`
|
|
|
632
690
|
}
|
|
633
691
|
}
|
|
634
692
|
|
|
693
|
+
nav.sidebar-closed {
|
|
694
|
+
width: fit-content;
|
|
695
|
+
}
|
|
696
|
+
|
|
635
697
|
details {
|
|
636
698
|
border-radius: var(--border-radius-100);
|
|
637
699
|
|
|
@@ -700,10 +762,6 @@ var styles = i`
|
|
|
700
762
|
}
|
|
701
763
|
}
|
|
702
764
|
|
|
703
|
-
.logo {
|
|
704
|
-
padding: 0 var(--space-scale-2);
|
|
705
|
-
}
|
|
706
|
-
|
|
707
765
|
.sub-nav-item:hover,
|
|
708
766
|
.sub-nav-item:focus-visible,
|
|
709
767
|
.nav-item:hover,
|