yusufipek/teknolojirehberleri.xyz
1
0
Fork 0
mirror of https://github.com/yusufipk/teknolojirehberleri.xyz.git synced 2026-09-11 10:56:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

create(layout) created persistance layout

Browse Source
This commit is contained in:
Yusuf İpek
2021-07-26 15:10:13 +03:00
parent 833c6c79cd
commit 20b769086a
18 changed files with 814 additions and 203 deletions
Download Patch File Download Diff File Expand all files Collapse all files
styles/layout/_grid-float.scss
+66
View File
@@ -0,0 +1,66 @@
.row {
max-width: $grid-width;
margin: 0 auto;
&:not(:last-child) {
margin-bottom: $gutter-vertical;
@include respond(tab-port) {
margin-bottom: $gutter-horizontal;
}
}
@include respond(tab-port) {
max-width: 50rem;
padding: 0 3rem;
}
@include clearfix;
[class^="col-"] {
float: left;
&:not(:last-child) {
margin-right: $gutter-horizontal;
@include respond(tab-port) {
margin-right: 0;
margin-bottom: $gutter-horizontal;
}
}
@include respond(tab-port) {
width: 100% !important;
}
}
.col-1-of-2 {
width: calc((100% - #{$gutter-horizontal}) / 2);
}
.col-1-of-3 {
width: calc((100% - (2 * #{$gutter-horizontal})) / 3);
}
.col-1-of-4 {
width: calc((100% - (3 * #{$gutter-horizontal})) / 4);
}
.col-2-of-3 {
width: calc(
2 * ((100% - (2 * #{$gutter-horizontal})) / 3) + #{$gutter-horizontal}
);
}
.col-2-of-4 {
width: calc(
2 * ((100% - (3 * #{$gutter-horizontal})) / 4) + #{$gutter-horizontal}
);
}
.col-3-of-4 {
width: calc(
3 * ((100% - (3 * #{$gutter-horizontal})) / 4) + 2 * #{$gutter-horizontal}
);
}
}