search

ansopedia / web-app

Ansopedia is an open-source learning platform that empowers you to explore diverse educational content. Access a vast repository of knowledge, including: posts, forums, quizzes, personalized experience, blog, leaderboard, school, college & university details, etc
3 stars 5 forks source link

FE - Add Mixins for Flex Layout #15

Open sameermakwana19 opened 4 months ago

sameermakwana19 commented 4 months ago

Description:

Currently, managing flexbox layouts and full-width containers in CSS can be a bit verbose and repetitive. It would be beneficial to have a mixin that simplifies and standardizes the process, making it easier and more efficient for developers to create flexible layouts.

Proposal:

I propose the addition of a mixin that combines the properties necessary for creating flexible layouts using flexbox, along with the ability to easily create full-width containers. This mixin should encapsulate common flexbox properties like display, flex-direction, justify-content, align-items, flex-wrap, and others, as well as settings for full-width containers.

@mixin flex-container($direction: row, $justify: flex-start, $align: stretch, $wrap: nowrap) {
  display: flex;
  flex-direction: $direction;
  justify-content: $justify;
  align-items: $align;
  flex-wrap: $wrap;
}