Skip to content

Commit

Permalink
Fixed #116 - Add vertical alignment classes
Browse files Browse the repository at this point in the history
  • Loading branch information
mertsincan committed Apr 22, 2022
1 parent 3a883aa commit fcd91ff
Show file tree
Hide file tree
Showing 3 changed files with 182 additions and 34 deletions.
78 changes: 45 additions & 33 deletions _sass/lib/src/_typography.scss
Original file line number Diff line number Diff line change
@@ -1,52 +1,52 @@
$text-align-props: (
"text-center": center,
"text-justify": justify,
"text-left": left,
"text-right": right
'text-center': center,
'text-justify': justify,
'text-left': left,
'text-right': right
);

$text-decoration-props: (
"underline": underline,
"line-through": line-through,
"no-underline": none
'underline': underline,
'line-through': line-through,
'no-underline': none
);

$text-transform-props: (
"lowercase": lowercase,
"uppercase": uppercase,
"capitalize": capitalize
'lowercase': lowercase,
'uppercase': uppercase,
'capitalize': capitalize
);

$text-overflow-props: (
"text-overflow-clip": clip,
"text-overflow-ellipsis": ellipsis
'text-overflow-clip': clip,
'text-overflow-ellipsis': ellipsis
);

$font-weight-props: (
"font-light": 300,
"font-normal": 400,
"font-medium": 500,
"font-semibold": 600,
"font-bold": 700
'font-light': 300,
'font-normal': 400,
'font-medium': 500,
'font-semibold': 600,
'font-bold': 700
);

$font-style-props: (
"font-italic": italic
'font-italic': italic
);

$font-size-props: (
"text-xs": .75rem,
"text-sm": .875rem,
"text-base": 1rem,
"text-lg": 1.125rem,
"text-xl": 1.25rem,
"text-2xl": 1.5rem,
"text-3xl": 1.75rem,
"text-4xl": 2rem,
"text-5xl": 2.5rem,
"text-6xl": 3rem,
"text-7xl": 4rem,
"text-8xl": 6rem
'text-xs': .75rem,
'text-sm': .875rem,
'text-base': 1rem,
'text-lg': 1.125rem,
'text-xl': 1.25rem,
'text-2xl': 1.5rem,
'text-3xl': 1.75rem,
'text-4xl': 2rem,
'text-5xl': 2.5rem,
'text-6xl': 3rem,
'text-7xl': 4rem,
'text-8xl': 6rem
);

$line-height-props: (
Expand All @@ -57,8 +57,19 @@ $line-height-props: (
);

$white-space-props: (
"white-space-normal": normal,
"white-space-nowrap": nowrap
'white-space-normal': normal,
'white-space-nowrap': nowrap
);

$vertical-align-props: (
'vertical-align-baseline': baseline,
'vertical-align-top': top,
'vertical-align-middle': middle,
'vertical-align-bottom': bottom,
'vertical-align-text-top': text-top,
'vertical-align-text-bottom': text-bottom,
'vertical-align-sub': sub,
'vertical-align-super': super
);

@include style-class('text-align', $text-align-props, true);
Expand All @@ -69,4 +80,5 @@ $white-space-props: (
@include style-class('font-style', $font-style-props);
@include style-class('font-size', $font-size-props, true);
@include style-class('line-height', $line-height-props);
@include style-class('white-space', $white-space-props);
@include style-class('white-space', $white-space-props);
@include style-class('vertical-align', $vertical-align-props, true);
136 changes: 136 additions & 0 deletions dist/primeflex.css
Original file line number Diff line number Diff line change
Expand Up @@ -7380,6 +7380,142 @@
white-space: nowrap !important;
}

.vertical-align-baseline {
vertical-align: baseline !important;
}

.vertical-align-top {
vertical-align: top !important;
}

.vertical-align-middle {
vertical-align: middle !important;
}

.vertical-align-bottom {
vertical-align: bottom !important;
}

.vertical-align-text-top {
vertical-align: text-top !important;
}

.vertical-align-text-bottom {
vertical-align: text-bottom !important;
}

.vertical-align-sub {
vertical-align: sub !important;
}

.vertical-align-super {
vertical-align: super !important;
}

@media screen and (min-width: 576px) {
.sm\:vertical-align-baseline {
vertical-align: baseline !important;
}
.sm\:vertical-align-top {
vertical-align: top !important;
}
.sm\:vertical-align-middle {
vertical-align: middle !important;
}
.sm\:vertical-align-bottom {
vertical-align: bottom !important;
}
.sm\:vertical-align-text-top {
vertical-align: text-top !important;
}
.sm\:vertical-align-text-bottom {
vertical-align: text-bottom !important;
}
.sm\:vertical-align-sub {
vertical-align: sub !important;
}
.sm\:vertical-align-super {
vertical-align: super !important;
}
}
@media screen and (min-width: 768px) {
.md\:vertical-align-baseline {
vertical-align: baseline !important;
}
.md\:vertical-align-top {
vertical-align: top !important;
}
.md\:vertical-align-middle {
vertical-align: middle !important;
}
.md\:vertical-align-bottom {
vertical-align: bottom !important;
}
.md\:vertical-align-text-top {
vertical-align: text-top !important;
}
.md\:vertical-align-text-bottom {
vertical-align: text-bottom !important;
}
.md\:vertical-align-sub {
vertical-align: sub !important;
}
.md\:vertical-align-super {
vertical-align: super !important;
}
}
@media screen and (min-width: 992px) {
.lg\:vertical-align-baseline {
vertical-align: baseline !important;
}
.lg\:vertical-align-top {
vertical-align: top !important;
}
.lg\:vertical-align-middle {
vertical-align: middle !important;
}
.lg\:vertical-align-bottom {
vertical-align: bottom !important;
}
.lg\:vertical-align-text-top {
vertical-align: text-top !important;
}
.lg\:vertical-align-text-bottom {
vertical-align: text-bottom !important;
}
.lg\:vertical-align-sub {
vertical-align: sub !important;
}
.lg\:vertical-align-super {
vertical-align: super !important;
}
}
@media screen and (min-width: 1200px) {
.xl\:vertical-align-baseline {
vertical-align: baseline !important;
}
.xl\:vertical-align-top {
vertical-align: top !important;
}
.xl\:vertical-align-middle {
vertical-align: middle !important;
}
.xl\:vertical-align-bottom {
vertical-align: bottom !important;
}
.xl\:vertical-align-text-top {
vertical-align: text-top !important;
}
.xl\:vertical-align-text-bottom {
vertical-align: text-bottom !important;
}
.xl\:vertical-align-sub {
vertical-align: sub !important;
}
.xl\:vertical-align-super {
vertical-align: super !important;
}
}
.flex-row {
flex-direction: row !important;
}
Expand Down
2 changes: 1 addition & 1 deletion dist/primeflex.min.css

Large diffs are not rendered by default.

0 comments on commit fcd91ff

Please sign in to comment.