Select content of parent component

[IntellectProductions]

Right now I have this as my HTML:

<slider count="2" v-ref="slider" class="slider" parent-styles="@{{ styles }}">
    <div class="slide">
        All of this stuff is irrelevant
    </div>
    <div class="slide">
        All of this stuff is irrelevant
    </div>
</slider>

In my slider component, I'm using this template:

<div class="slider">
    <slides v-ref="slides" width="{{ slidesContainer.width }}" height="{{ height }}" slide-width="{{ slideWidth }}" count="{{ count }}">
        <sliderslide v-repeat="count" width="{{ slideWidth }}" height="{{ height }}">
            <content select=".slide:nth-child({{ $index + 1 }})"></content>
        </sliderslide>
    </slides>

    <sliderarrows></sliderarrows>
</div>

However, .slide:nth-child() won't be available since it's in a child component. Is there anyway to select this? The reasoning is because every time I use this slider component, I don't want to have to pass all those props I'm passing to get the width of height. I rather do it all in the component so it can figure itself out and my HTML stays clean.

Thanks for any help on how to rework this.