Converting the rest to stylus
This commit is contained in:
@@ -1 +0,0 @@
|
||||
@import 'menu/menu';
|
2
components/05_Components/_components.styl
Normal file
2
components/05_Components/_components.styl
Normal file
@@ -0,0 +1,2 @@
|
||||
@import 'menu/_menu'
|
||||
@import 'imageGrid/_imageGrid'
|
13
components/05_Components/imageGrid/_imageGrid.styl
Normal file
13
components/05_Components/imageGrid/_imageGrid.styl
Normal file
@@ -0,0 +1,13 @@
|
||||
RV-ImageGrid()
|
||||
RV-FlexGrid()
|
||||
|
||||
&__Container
|
||||
RV-Spacing__Inner--small()
|
||||
RV-FlexGrid__Container--autoWidth()
|
||||
|
||||
&__Item
|
||||
RV-ContentCrop()
|
||||
RV-ContentCrop--center()
|
||||
|
||||
.RV-ImageGrid
|
||||
RV-ImageGrid()
|
1
components/05_Components/imageGrid/imageGrid.config.json
Normal file
1
components/05_Components/imageGrid/imageGrid.config.json
Normal file
@@ -0,0 +1 @@
|
||||
{}
|
8
components/05_Components/imageGrid/imageGrid.hbs
Normal file
8
components/05_Components/imageGrid/imageGrid.hbs
Normal file
@@ -0,0 +1,8 @@
|
||||
<div class="RV-ImageGrid">
|
||||
<ul class="RV-ImageGrid__Container">
|
||||
<li class="RV-ImageGrid__Item"><img src="{{path '/images/hasi01.png'}}" alt=""></li>
|
||||
<li class="RV-ImageGrid__Item"><img src="{{path '/images/hasi02.jpeg'}}" alt=""></li>
|
||||
<li class="RV-ImageGrid__Item"><img src="{{path '/images/hasi03.jpeg'}}" alt=""></li>
|
||||
<li class="RV-ImageGrid__Item RV-ImageGrid__Item"><img src="{{path '/images/hasi04.png'}}" alt=""></li>
|
||||
</ul>
|
||||
</div>
|
@@ -1,35 +0,0 @@
|
||||
@mixin RV-Menu {
|
||||
|
||||
&--vertical &__List {
|
||||
@include RV-FlexRow__Container--vertical;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&--horizontal &__List {
|
||||
@include RV-FlexRow__Container--horizontal;
|
||||
@include RV-FlexRow__Container--breakPoint(400px);
|
||||
}
|
||||
|
||||
&__List {
|
||||
@include RV-FlexRow__Container($-prefix: '.RV-Menu');
|
||||
@include RV-ElementList;
|
||||
}
|
||||
|
||||
&__Item {
|
||||
@include RV-FlexRow__Item;
|
||||
@include RV-FlexRow__Item--shorthands;
|
||||
width: 100px;
|
||||
|
||||
.RV-Link {
|
||||
padding: $-spacing-small;
|
||||
background-color: beige;
|
||||
display: block;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.RV-Menu {
|
||||
@include RV-Menu;
|
||||
}
|
26
components/05_Components/menu/_menu.styl
Normal file
26
components/05_Components/menu/_menu.styl
Normal file
@@ -0,0 +1,26 @@
|
||||
RV-Menu()
|
||||
&--vertical &__List
|
||||
RV-FlexRow__Container--vertical()
|
||||
width 100%
|
||||
|
||||
&--horizontal &__List
|
||||
RV-FlexRow__Container--horizontal()
|
||||
RV-FlexRow__Container--breakPoint(400px)
|
||||
|
||||
&__List
|
||||
RV-FlexRow__Container(prefix='.RV-Menu')
|
||||
RV-ElementList()
|
||||
|
||||
&__Item
|
||||
RV-FlexRow__Item()
|
||||
RV-FlexRow__Item--shorthands()
|
||||
width 100px
|
||||
|
||||
.RV-Link
|
||||
padding spacing-small
|
||||
background-color beige
|
||||
display block
|
||||
white-space nowrap
|
||||
|
||||
.RV-Menu
|
||||
RV-Menu()
|
Reference in New Issue
Block a user