scss-library/components/01_Layouts/breakPoint/_breakPoint.styl

75 lines
1.3 KiB
Stylus

RV-BreakPoint__Item(breakPoint)
+RV-Element()
RV-FlexRow__Item()
flex-basis 'calc(%s * 999 - 100% * 999)' % breakPoint
overflow: hidden;
--outer-spacing 0
--inner-spacing 0
RV-BreakPoint__Item--outside()
+RV-Element--modifier()
flex-shrink 999
RV-BreakPoint__Item--inside()
+RV-Element--modifier()
flex-grow 0
RV-BreakPoint(breakPoint)
RV-FlexRow()
+RV-Squash()
RV-FlexRow--wrap()
overflow-y hidden
RV-Reset()
gap 0px
RV-BreakPoint--wrap()
+RV-Block--modifier()
+RV-Element('Item')
+RV-Element--modifier('outside')
margin-bottom -100vh
RV-BreakPoint--horizontal()
+RV-Block--modifier()
flex-wrap nowrap
+RV-Element('Item')
+RV-Element--modifier('outside')
margin-bottom unset
height unset
RV-BreakPoint--vertical()
+RV-Block--modifier()
flex-direction column
flex-wrap nowrap
height 100%
+RV-Element('Item')
+RV-Element--modifier('outside')
margin-bottom unset
height unset
+RV-Block('RV-BreakPoint')
RV-CSSParameter({
breakPoint: 500px
fixedSize: 100px
})
&&
--inner-spacing 0
RV-BreakPoint(--breakPoint)
+RV-Element()
RV-BreakPoint__Item(--breakPoint)
RV-BreakPoint__Item--outside()
RV-BreakPoint__Item--inside()
RV-BreakPoint__Item--fixedSize(--fixedSize)
RV-BreakPoint--wrap()
RV-BreakPoint--horizontal()
RV-BreakPoint--vertical()