website

The files for mattfehrenbach.xyz, a fork of a template.
git clone git://git.mattfehrenbach.xyz/website.git
Log | Files | Refs | LICENSE

_actions.scss (1787B)

      1 ///
      2 /// Dimension by HTML5 UP
      3 /// html5up.net | @ajlkn
      4 /// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
      5 ///
      6 
      7 /* Actions */
      8 
      9 	ul.actions {
     10 		@include vendor('display', 'flex');
     11 		cursor: default;
     12 		list-style: none;
     13 		margin-left: (_size(element-margin) * -0.5);
     14 		padding-left: 0;
     15 
     16 		li {
     17 			padding: 0 0 0 (_size(element-margin) * 0.5);
     18 			vertical-align: middle;
     19 		}
     20 
     21 		&.special {
     22 			@include vendor('justify-content', 'center');
     23 			width: 100%;
     24 			margin-left: 0;
     25 
     26 			li {
     27 				&:first-child {
     28 					padding-left: 0;
     29 				}
     30 			}
     31 		}
     32 
     33 		&.stacked {
     34 			@include vendor('flex-direction', 'column');
     35 			margin-left: 0;
     36 
     37 			li {
     38 				padding: (_size(element-margin) * 0.65) 0 0 0;
     39 
     40 				&:first-child {
     41 					padding-top: 0;
     42 				}
     43 			}
     44 		}
     45 
     46 		&.fit {
     47 			width: calc(100% + #{_size(element-margin) * 0.5});
     48 
     49 			li {
     50 				@include vendor('flex-grow', '1');
     51 				@include vendor('flex-shrink', '1');
     52 				width: 100%;
     53 
     54 				> * {
     55 					width: 100%;
     56 				}
     57 			}
     58 
     59 			&.stacked {
     60 				width: 100%;
     61 			}
     62 		}
     63 
     64 		@include breakpoint('<=xsmall') {
     65 			&:not(.fixed) {
     66 				@include vendor('flex-direction', 'column');
     67 				margin-left: 0;
     68 				width: 100% !important;
     69 
     70 				li {
     71 					@include vendor('flex-grow', '1');
     72 					@include vendor('flex-shrink', '1');
     73 					padding: (_size(element-margin) * 0.5) 0 0 0;
     74 					text-align: center;
     75 					width: 100%;
     76 
     77 					> * {
     78 						width: 100%;
     79 					}
     80 
     81 					&:first-child {
     82 						padding-top: 0;
     83 					}
     84 
     85 					input[type="submit"],
     86 					input[type="reset"],
     87 					input[type="button"],
     88 					button,
     89 					.button {
     90 						width: 100%;
     91 
     92 						&.icon {
     93 							&:before {
     94 								margin-left: -0.5em;
     95 							}
     96 						}
     97 					}
     98 				}
     99 			}
    100 		}
    101 	}