framework7/components/subnavbar/subnavbar-ios.less

Full featured mobile HTML framework for building iOS & Android apps

.ios {
  .subnavbar {
    height: calc(var(--f7-subnavbar-height) + 1px);
    margin-top: -1px;
    padding-top: 1px;
    border-radius: var(--f7-subnavbar-height);
    box-shadow: var(--f7-glass-shadow);
    .ios-glass-backdrop();
    --f7-segmented-strong-bg-color: transparent;

    &:has(> .searchbar) {
      background: transparent;
      backdrop-filter: none;
      box-shadow: none;
    }

    .subnavbar-inner {
      border-radius: inherit;
    }

    .title {
      align-self: flex-start;
      flex-shrink: 10;
    }
    .ltr({
      .left, .right {
        a + a {
          margin-left: 16px;
        }
      }
      .left {
        margin-right: 10px;
      }
      .right {
        margin-left: 10px;
      }
      .right:first-child {
        right: 8px;
      }
    });
    .rtl({
      .left, .right {
        a + a {
          margin-right: 16px;
        }
      }
      .left {
        margin-left: 10px;
      }
      .right {
        margin-right: 10px;
      }
      .right:first-child {
        left: 8px;
      }
    });

    a.link {
      justify-content: flex-start;
    }
    a:is(.icon-only, :has(i:only-child), :has(svg:only-child)) {
      justify-content: center;
      margin: 0;
    }
  }
}