title: How to make Sliver headers sticky inside other Sliver
body: <p>I am trying to make nested Sliver headers sticky.</p>
  <p>I am unable to make the 'today' header sticky under the 'bruh' header(which is sticky). make it feel like some collapsing headers.</p>
  <p>can someone kindly give a hand</p>
  <pre><code>class ListExample extends StatelessWidget {
    const ListExample({
      Key key,
    }) : super(key: key);
  
    @override
    Widget build(BuildContext context) {
      return AppScaffold(
        title: 'List Example',
        slivers: [
          SliverToBoxAdapter(child: SoldEntryPage(),),
          _StickyHeaderDateSort(index: 34),
        ],
      );
    }
  }
  </code></pre>
  <pre><code>class _StickyHeaderDateSort extends StatelessWidget {
    const _StickyHeaderDateSort({
      Key key,
      this.index,
    }) : super(key: key);
  
    final int index;
  
    @override
    Widget build(BuildContext context) {
      return SliverStickyHeader(
        header: HeaderDatePicker(),  // this the 'bruh' sticky header
        sliver: SliverToBoxAdapter(
            child: ShrinkWrappingViewport(   // THis me trying to nest silvers
              offset: ViewportOffset.zero(),
              slivers: [
                _StickyHeaderList(index: 10),
                _StickyHeaderList(index: 11),],
            ),
          ),
      );
    }
  }
  </code></pre>
  <p>this is what most of that code is doing</p>
  <p><a href="https://i.stack.imgur.com/yWsXW.gif" rel="noreferrer"><img src="https://i.stack.imgur.com/yWsXW.gif" alt="enter image description here" /></a></p>