@appartmint/mint 0.12.26 → 0.12.30

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/css/mint.css CHANGED
@@ -652,14 +652,24 @@ app-footer::before {
652
652
  margin-bottom: 1rem !important;
653
653
  }
654
654
  }
655
- #mint-header::before {
655
+ #mint-header.mint-spread:not(.mint-expand) [aria-controls]:not([aria-controls=mint-wrapper]) {
656
+ display: none;
657
+ }
658
+ #mint-header.mint-spread:not(.mint-expand) [aria-controls]:not([aria-controls=mint-wrapper]) + ul {
659
+ display: flex !important;
660
+ height: auto !important;
661
+ margin-bottom: 1rem !important;
662
+ }
663
+ #mint-header:not(.mint-border)::before {
656
664
  content: "";
657
665
  position: absolute;
658
666
  top: 0;
659
667
  left: 0;
660
668
  width: 100%;
661
- height: var(--mint-header-height);
662
669
  background: var(--mint-header-back);
670
+ }
671
+ #mint-header::before {
672
+ height: var(--mint-header-height);
663
673
  z-index: -1;
664
674
  }
665
675
  #mint-header nav > ul {
@@ -716,6 +726,9 @@ app-footer::before {
716
726
  box-shadow: 0 0 2rem -0.5rem var(--mint-glow-2);
717
727
  z-index: 1000;
718
728
  }
729
+ #mint-header [aria-controls=mint-wrapper]:hover {
730
+ background: var(--mint-shadow-5);
731
+ }
719
732
  #mint-header [aria-controls=mint-wrapper]:hover .mint-menu-icon, #mint-header [aria-controls=mint-wrapper]:hover .mint-menu-icon::before, #mint-header [aria-controls=mint-wrapper]:hover .mint-menu-icon::after {
720
733
  background-color: var(--mint-back);
721
734
  }
@@ -768,7 +781,8 @@ app-footer::before {
768
781
  top: var(--mint-header-height);
769
782
  }
770
783
  #mint-header #mint-wrapper nav {
771
- height: 100%;
784
+ height: calc(100vh - var(--mint-header-height));
785
+ height: calc(100dvh - var(--mint-header-height));
772
786
  background: var(--mint-back);
773
787
  overflow: auto;
774
788
  background-repeat: repeat;
@@ -783,26 +797,42 @@ app-footer::before {
783
797
  #mint-header #mint-wrapper nav > :last-child {
784
798
  margin-bottom: 0;
785
799
  }
786
- @media (min-width: 1440px) {
800
+ #mint-header #mint-wrapper nav > ul {
801
+ height: 100%;
802
+ overflow: auto;
803
+ }
804
+ @media (min-width: 1024px) {
787
805
  #mint-header #mint-wrapper nav > ul {
788
806
  display: flex;
789
807
  flex-direction: row;
790
808
  flex-wrap: wrap;
809
+ align-items: center;
791
810
  justify-content: space-evenly;
792
811
  width: 100%;
793
812
  }
794
813
  }
814
+ #mint-header #mint-wrapper a {
815
+ display: flex;
816
+ }
795
817
  #mint-header #mint-wrapper a,
796
818
  #mint-header #mint-wrapper button {
819
+ align-items: center;
820
+ justify-content: center;
797
821
  font-family: serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
798
822
  font-size: 3em;
799
823
  padding: 0.5rem;
800
824
  text-align: center;
825
+ border-radius: 1rem;
801
826
  }
802
827
  @media (min-width: 480px) {
803
828
  #mint-header #mint-wrapper a,
804
829
  #mint-header #mint-wrapper button {
805
830
  font-size: 4em;
831
+ padding: 1rem 1.5rem;
832
+ }
833
+ #mint-header #mint-wrapper a i,
834
+ #mint-header #mint-wrapper button i {
835
+ font-size: 0.5em;
806
836
  }
807
837
  }
808
838
  #mint-header #mint-wrapper a:hover,
@@ -1050,10 +1080,10 @@ nav ul > li > ul {
1050
1080
  }
1051
1081
  }
1052
1082
  a i:first-child {
1053
- margin-right: 0.25rem;
1083
+ margin-right: 0.25em;
1054
1084
  }
1055
1085
  a i:last-child {
1056
- margin-left: 0.25rem;
1086
+ margin-left: 0.25em;
1057
1087
  }
1058
1088
 
1059
1089
  button,