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

Current Bulid

Browse Source
This commit is contained in:
reverend 2020-08-23 14:40:14 +02:00
parent 0f32093dbf
commit 4e88fbbb9b
1 changed files with 116 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

198
public/rcss.css
View File

@ -1,67 +1,72 @@
@import url(./pink.css); @import url(./pink.css);
.RV-Alignment__Container {
display: grid; }
.RV-Alignment__Container--top {
align-content: start; }
.RV-Alignment__Container--bottom {
align-content: end; }
.RV-Alignment__Container--left {
justify-content: start; }
.RV-Alignment__Container--right {
justify-content: end; }
.RV-Alignment__Container--horizontalCenter {
justify-content: center; }
.RV-Alignment__Container--verticalCenter {
align-content: center; }
.RV-Alignment__Container--center {
justify-content: center;
align-content: center; }
.RV-FlexRow__Container { .RV-FlexRow__Container {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
gap: 10px;
justify-content: space-around; } justify-content: space-around; }
.RV-FlexRow__Container--wrap { .RV-FlexRow__Container--wrap {
flex-wrap: wrap; } flex-wrap: wrap; }
.RV-FlexRow__Item { .RV-FlexRow__Item {
width: 100%; } width: 100%; }
.RV-FlexRow__Item * { .RV-FlexRow__Item__Container {
text-align: unset; display: grid; }
display: flex; .RV-FlexRow__Item__Container--top {
flex-direction: row; } align-content: start; }
.RV-FlexRow__Item--fixedSize { .RV-FlexRow__Item__Container--bottom {
flex: 0 0; align-content: end; }
width: min-content; } .RV-FlexRow__Item__Container--left {
.RV-FlexRow__Item--center { justify-content: start; }
text-align: center; } .RV-FlexRow__Item__Container--right {
.RV-FlexRow__Item--center * { justify-content: end; }
.RV-FlexRow__Item__Container--horizontalCenter {
justify-content: center; } justify-content: center; }
.RV-FlexRow__Item--left { .RV-FlexRow__Item__Container--verticalCenter {
text-align: left; } align-content: center; }
.RV-FlexRow__Item--left * { .RV-FlexRow__Item__Container--center {
justify-content: flex-start; } justify-content: center;
.RV-FlexRow__Item--right { align-content: center; }
text-align: right; }
.RV-FlexRow__Item--right * {
justify-content: flex-end; }
.RV-FlexGrid__Container { .RV-FlexGrid__Container {
display: grid; display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
grid-template-rows: repeat(auto-fill, 300px); grid-template-rows: repeat(auto-fill, 300px);
grid-auto-rows: 300px; } grid-auto-rows: 300px; }
.RV-FlexGrid__Container--sameHeight {
grid-auto-rows: 1fr; }
.RV-FlexGrid__Container--spacing {
gap: 10px; }
.RV-FlexGrid__Item * { .RV-FlexGrid__Item__Container {
text-align: unset; display: grid; }
display: flex; .RV-FlexGrid__Item__Container--top {
flex-direction: row; } align-content: start; }
.RV-FlexGrid__Item__Container--bottom {
.RV-FlexGrid__Item--fixedSize { align-content: end; }
flex: 0 0; .RV-FlexGrid__Item__Container--left {
width: min-content; } justify-content: start; }
.RV-FlexGrid__Item__Container--right {
.RV-FlexGrid__Item--center { justify-content: end; }
text-align: center; } .RV-FlexGrid__Item__Container--horizontalCenter {
.RV-FlexGrid__Item--center * {
justify-content: center; } justify-content: center; }
.RV-FlexGrid__Item__Container--verticalCenter {
.RV-FlexGrid__Item--left { align-content: center; }
text-align: left; } .RV-FlexGrid__Item__Container--center {
.RV-FlexGrid__Item--left * { justify-content: center;
justify-content: flex-start; } align-content: center; }
.RV-FlexGrid__Item--right {
text-align: right; }
.RV-FlexGrid__Item--right * {
justify-content: flex-end; }
.RV-ContentCrop__Container, .RV-ContentCrop__Container * { .RV-ContentCrop__Container, .RV-ContentCrop__Container * {
overflow: hidden; overflow: hidden;
@ -87,13 +92,34 @@
.RV-ContentCrop__Container--center img { .RV-ContentCrop__Container--center img {
object-position: center; } object-position: center; }
.RV-Fan__Container--vertical {
flex-direction: column;
width: max-content; }
.RV-Fan__Container--vertical .RV-Fan__Surface {
width: 320px;
min-height: 280px; }
.RV-Fan__Container--horizontal {
flex-direction: row; }
.RV-Fan__Container--horizontal .RV-Fan__Surface {
min-width: 320px;
height: 280px; }
.RV-Fan__Container--auto {
flex-flow: row wrap; }
.RV-Fan__Container--auto .RV-Fan__Surface {
width: calc(100% - 320px);
min-width: 320px;
height: 280px; }
.RV-Fan__Container--fullWidth .RV-Fan__Base, .RV-Fan__Container--fullWidth .RV-Fan__Surface {
flex-grow: 1; }
.RV-Fan__Container { .RV-Fan__Container {
display: flex; } display: flex; }
.RV-Fan__Container--horizontal {
flex-direction: row; }
.RV-Fan__Container--vertical {
flex-direction: column;
width: max-content; }
.RV-Fan__Base { .RV-Fan__Base {
height: 280px; height: 280px;
@ -124,12 +150,6 @@
.RV-Fan__Surface--center img { .RV-Fan__Surface--center img {
object-position: center; } object-position: center; }
.RV-Fan__Container--horizontal .RV-Fan__Surface {
height: 280px; }
.RV-Fan__Container--vertical .RV-Fan__Surface {
width: 320px; }
.RV-FullWidthContent__Container { .RV-FullWidthContent__Container {
width: 100%; } width: 100%; }
@ -219,6 +239,30 @@
padding: 35px; padding: 35px;
gap: 35px; } gap: 35px; }
.RV-Iconized__Icon--small {
width: 1em;
height: 1em;
position: relative;
top: .125em; }
.RV-Iconized__Icon--medium {
width: 2em;
height: 2em;
position: relative;
top: .625em; }
.RV-Iconized__Icon--large {
width: 3em;
height: 3em;
position: relative;
top: 1.15573em; }
.RV-Iconized__Icon--huge {
width: 5em;
height: 5em;
position: relative;
top: 2.175em; }
.RV-ImageGrid__Container { .RV-ImageGrid__Container {
list-style-type: none; list-style-type: none;
margin: 0; margin: 0;
@ -241,34 +285,24 @@
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
grid-template-rows: repeat(auto-fill, 300px); grid-template-rows: repeat(auto-fill, 300px);
grid-auto-rows: 300px; } grid-auto-rows: 300px; }
.RV-ImageGrid__Container--sameHeight {
grid-auto-rows: 1fr; }
.RV-ImageGrid__Container--spacing {
gap: 10px; }
.RV-ImageGrid__Item * { .RV-ImageGrid__Item__Container {
text-align: unset; display: grid; }
display: flex; .RV-ImageGrid__Item__Container--top {
flex-direction: row; } align-content: start; }
.RV-ImageGrid__Item__Container--bottom {
.RV-ImageGrid__Item--fixedSize { align-content: end; }
flex: 0 0; .RV-ImageGrid__Item__Container--left {
width: min-content; } justify-content: start; }
.RV-ImageGrid__Item__Container--right {
.RV-ImageGrid__Item--center { justify-content: end; }
text-align: center; } .RV-ImageGrid__Item__Container--horizontalCenter {
.RV-ImageGrid__Item--center * {
justify-content: center; } justify-content: center; }
.RV-ImageGrid__Item__Container--verticalCenter {
.RV-ImageGrid__Item--left { align-content: center; }
text-align: left; } .RV-ImageGrid__Item__Container--center {
.RV-ImageGrid__Item--left * { justify-content: center;
justify-content: flex-start; } align-content: center; }
.RV-ImageGrid__Item--right {
text-align: right; }
.RV-ImageGrid__Item--right * {
justify-content: flex-end; }
.RV-ImageGrid__Container { .RV-ImageGrid__Container {
padding: 25px; padding: 25px;