reverend/scss-library
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Chaning Folder structure

Browse Source
This commit is contained in:
reverend
2021-03-09 12:36:45 +01:00
parent fd848277ff
commit 07e8b269e2
26 changed files with 0 additions and 388 deletions
Download Patch File Download Diff File Expand all files Collapse all files

100
components/05_Molecules/overlayButton/_overlayButton.styl Normal file
View File

@@ -0,0 +1,100 @@
RV-OverlayButton__Item()
position relative
&:hover > *
opacity 1
RV-OverlayButton__Button--circle()
border-radius 50%
RV-OverlayButton__Button--topRight()
right 0
top 0
RV-OverlayButton__Button--bottomLeft()
bottom 0
left 0
RV-OverlayButton__Button--bottomRight()
bottom 0
right 0
RV-OverlayButton__Button--small()
width 3*spacing-small
height 3*spacing-small
font-size 1.5*spacing-small
line-height 1.5*spacing-small
RV-OverlayButton__Button--medium()
width 2*spacing-medium
height 2*spacing-medium
font-size spacing-medium
line-height spacing-medium
RV-OverlayButton__Button--large()
width 2*spacing-large
height 2*spacing-large
font-size spacing-large
line-height spacing-large
RV-OverlayButton__Row()
RV-Alignment--center()
RV-Spacing__Inner--medium()
RV-FlexRow__Container()
position absolute
bottom 0
height 4em
opacity .2
width 100%
justify-content center
background-color alpha(white, .5)
padding-left 0
padding-right 0
*
position initial
opacity initial
margin 0
padding 0
RV-OverlayButton__Button()
text-align center
display inline-block
position absolute
background-color beige
margin spacing-small
opacity .2
border-radius spacing-small
text-decoration none
RV-Alignment--center()
RV-OverlayButton__Button--medium()
&--circle
RV-OverlayButton__Button--circle()
&--topRight
RV-OverlayButton__Button--topRight()
&--small
RV-OverlayButton__Button--small()
&--medium
RV-OverlayButton__Button--medium()
&--large
RV-OverlayButton__Button--large()
RV-OverlayButton()
&__Item
RV-OverlayButton__Item()
&__Button
RV-OverlayButton__Button()
&__Row
RV-OverlayButton__Row()
.RV-OverlayButton
RV-OverlayButton()

1
components/05_Molecules/overlayButton/overlayButton.config.json Normal file
View File

@@ -0,0 +1 @@
{}

12
components/05_Molecules/overlayButton/overlayButton.hbs Normal file
View File

@@ -0,0 +1,12 @@
<div class="red square RV-OverlayButton__Item">
<a href="#" class="RV-OverlayButton__Button RV-OverlayButton__Button--topRight">X</a>
<a href="#" class="RV-OverlayButton__Button RV-OverlayButton__Button--circle">X</a>
<div class="RV-OverlayButton__Row">
<a href="#" class="RV-OverlayButton__Button RV-OverlayButton__Button--circle">X</a>
<a href="#" class="RV-OverlayButton__Button RV-OverlayButton__Button--topRight">X</a>
<a href="#" class="RV-OverlayButton__Button RV-OverlayButton__Button--topRight">X</a>
</div>
<p>some content</p>
</div>

15
components/05_Molecules/overlayButton/pagination/_pagination.styl Normal file
View File

@@ -0,0 +1,15 @@
RV-Pagination__Item()
+RV-Element--name('Item')
RV-ElementList__Item()
+RV-Block('RV-Pagination')
max-width 600px
RV-ElementList()
RV-FlexRow--horizontal()
justify-content space-between
overflow hidden
height 2em
+RV-Element('Item')
RV-Pagination__Item()

3
components/05_Molecules/overlayButton/pagination/pagination.config.json Normal file
View File

@@ -0,0 +1,3 @@
{
"title": "Pagnination"
}

77
components/05_Molecules/overlayButton/pagination/pagination.hbs Normal file
View File

@@ -0,0 +1,77 @@
<ul class="RV-Pagination">
<li class="RV-Pagination__Item RV-Pagination__Item--other RV-Pagination__Item--first">
<a href="#" class="RV-Button RV-Button--small RV-Button--link">
<div class="RV-Button__Icon">
⟪
</div>
<div class="RV-Button__Text">
First
</div>
</a>
</li>
<li class="RV-Pagination__Item RV-Pagination__Item--other RV-Pagination__Item--disabled RV-Pagination__Item--previous">
<a href="#" class="RV-Button RV-Button--small RV-Button--link">
<div class="RV-Button__Icon">
⟨
</div>
<div class="RV-Button__Text">
Prev
</div>
</a>
</li>
<li class="RV-Pagination__Item RV-Pagination__Item--neighbor">
<a href="#" class="RV-Button RV-Button--small RV-Button--link">
<div class="RV-Button__Text">
1
</div>
</a>
</li>
<li class="RV-Pagination__Item RV-Pagination__Item--neighbor">
<a href="#" class="RV-Button RV-Button--small RV-Button--link">
<div class="RV-Button__Text">
2
</div>
</a>
</li>
<li class="RV-Pagination__Item RV-Pagination__Item--neighbor">
<a href="#" class="RV-Button RV-Button--small RV-Button--link">
<div class="RV-Button__Text">
3
</div>
</a>
</li>
<li class="RV-Pagination__Item RV-Pagination__Item--neighbor">
<a href="#" class="RV-Button RV-Button--small RV-Button--link">
<div class="RV-Button__Text">
4
</div>
</a>
</li>
<li class="RV-Pagination__Item RV-Pagination__Item--neighbor">
<a href="#" class="RV-Button RV-Button--small RV-Button--link">
<div class="RV-Button__Text">
5
</div>
</a>
</li>
<li class="RV-Pagination__Item RV-Pagination__Item--other RV-Pagination__Item--next">
<a href="#" class="RV-Button RV-Button--small RV-Button--link">
<div class="RV-Button__Text">
Next
</div>
<div class="RV-Button__Icon">
⟩
</div>
</a>
</li>
<li class="RV-Pagination__Item RV-Pagination__Item--other RV-Pagination__Item--last">
<a href="#" class="RV-Button RV-Button--small RV-Button--link">
<div class="RV-Button__Text">
Last
</div>
<div class="RV-Button__Icon">
⟫
</div>
</a>
</li>
</ul>