diff options
| author | Arne Rief <arne.rief@gmail.com> | 2023-02-11 19:55:41 +0100 |
|---|---|---|
| committer | Arne Rief <arne.rief@gmail.com> | 2023-02-11 19:55:41 +0100 |
| commit | 0a341c08423151cf2bc3d2ce8cb7192026cf4935 (patch) | |
| tree | 34e087ad5129c77f07aa663d35416feb23421228 /sass/abstracts | |
| parent | 5bab4502a098eb0e3b5a59b68bc9d8d23529ea55 (diff) | |
Responsive design
Diffstat (limited to 'sass/abstracts')
| -rw-r--r-- | sass/abstracts/_animations.scss | 12 | ||||
| -rw-r--r-- | sass/abstracts/_mixins.scss | 12 |
2 files changed, 24 insertions, 0 deletions
diff --git a/sass/abstracts/_animations.scss b/sass/abstracts/_animations.scss index 819b356..48c0ce6 100644 --- a/sass/abstracts/_animations.scss +++ b/sass/abstracts/_animations.scss @@ -30,3 +30,15 @@ transform: translate(0) skewX(-12deg); } } + +// without skew effect for smaller screens +@keyframes moveInRightMobile { + 0% { + opacity: 0; + transform: translateX(10rem); + } + 100% { + opacity: 1; + transform: translate(0); + } +} diff --git a/sass/abstracts/_mixins.scss b/sass/abstracts/_mixins.scss index 98351c4..5a05ec3 100644 --- a/sass/abstracts/_mixins.scss +++ b/sass/abstracts/_mixins.scss @@ -11,6 +11,13 @@ justify-content: space-around; } +@mixin flex-column-center { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +} + @mixin standard-grid { display: grid; grid-template-columns: 1fr 1fr; @@ -30,3 +37,8 @@ margin-bottom: 5rem; } } + +@mixin mobile-container { + margin: 8rem auto; + width: 80%; +} |