50 lines
		
	
	
		
			869 B
		
	
	
	
		
			SCSS
		
	
	
	
	
	
			
		
		
	
	
			50 lines
		
	
	
		
			869 B
		
	
	
	
		
			SCSS
		
	
	
	
	
	
| // Flexbox Utility Classes
 | |
| .flex-group-center {
 | |
|   @include flexbox(center, center);
 | |
|   text-align: center;
 | |
| }
 | |
| 
 | |
| .flex-group-left {
 | |
|   @include flexbox(flex-start, center);
 | |
|   text-align: left;
 | |
| }
 | |
| 
 | |
| .flex-group-right {
 | |
|   @include flexbox(flex-end, center);
 | |
|   text-align: right;
 | |
| }
 | |
| 
 | |
| .flexshrink {
 | |
|   flex: 0;
 | |
| }
 | |
| 
 | |
| .flex-between {
 | |
|   justify-content: space-between;
 | |
| }
 | |
| 
 | |
| .flexlarge {
 | |
|   flex: 2;
 | |
| }
 | |
| 
 | |
| // Alignment Utility Classes
 | |
| .align-left {
 | |
|   @include flexbox(flex-start, center);
 | |
|   text-align: left;
 | |
| }
 | |
| 
 | |
| .align-right {
 | |
|   @include flexbox(flex-end, center);
 | |
|   text-align: right;
 | |
| }
 | |
| 
 | |
| .align-center {
 | |
|   @include flexbox(center, center);
 | |
|   text-align: center;
 | |
| }
 | |
| 
 | |
| // Only apply the right alignment to specific inputs with this class
 | |
| .right-align-input {
 | |
|   flex: 1;
 | |
|   margin-left: auto; // Push the input to the far right
 | |
|   max-width: 260px; // Optional: Control the width of the input field
 | |
| } |