[Summary view] [Print] [Text view]

   1  .wp-block-navigation {
   2  
   3      .wp-block-navigation-link {
   4          .wp-block-navigation-link__label {
   5              font-family: var(--primary-nav--font-family);
   6              font-size: var(--primary-nav--font-size);
   7              font-weight: var(--primary-nav--font-weight);
   8          }
   9      }
  10  
  11      .wp-block-navigation-link__submenu-icon {
  12          padding: 0;
  13      }
  14  
  15      // Top level navigation container.
  16      > .wp-block-navigation__container {
  17  
  18          .has-child {
  19  
  20              .wp-block-navigation-link {
  21                  display: inherit;
  22              }
  23  
  24              .wp-block-navigation__container {
  25                  border: none;
  26                  left: 0;
  27                  min-width: max-content;
  28                  opacity: 0;
  29                  padding: 0;
  30                  position: inherit;
  31                  top: inherit;
  32  
  33                  .wp-block-navigation-link__submenu-icon {
  34                      display: none;
  35                  }
  36              }
  37          }
  38  
  39          > .has-child {
  40  
  41              > .wp-block-navigation__container {
  42                  background: var(--global--color-background);
  43                  margin: 0;
  44                  padding: 0;
  45                  position: absolute;
  46                  top: 100%;
  47                  border: 1px solid var(--primary-nav--border-color);
  48  
  49                  &:before,
  50                  &:after {
  51                      content: "";
  52                      display: block;
  53                      position: absolute;
  54                      width: 0;
  55                      top: -10px;
  56                      left: var(--global--spacing-horizontal);
  57                      border-style: solid;
  58                      border-color: var(--primary-nav--border-color) transparent;
  59                      border-width: 0 7px 10px 7px;
  60                  }
  61  
  62                  &:after {
  63                      top: -9px;
  64                      border-color: var(--global--color-background) transparent;
  65                  }
  66              }
  67          }
  68      }
  69  
  70      &:not(.has-background) {
  71  
  72          .wp-block-navigation__container {
  73              background: var(--global--color-background);
  74  
  75              .wp-block-navigation__container {
  76                  background: var(--global--color-background);
  77              }
  78          }
  79      }
  80  
  81      &:not(.has-text-color) {
  82  
  83          .wp-block-navigation-link {
  84  
  85              > a {
  86  
  87                  &:hover,
  88                  &:focus {
  89                      color: var(--primary-nav--color-link-hover);
  90                  }
  91  
  92                  &:hover {
  93                      text-decoration: underline;
  94                      text-decoration-style: dotted;
  95                  }
  96              }
  97          }
  98  
  99          .wp-block-navigation-link__content {
 100              color: currentColor;
 101          }
 102      }
 103  }