suzanne.soy/travis-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixed weird spacing and responsive behaviour with flexbox

Browse Source
This commit is contained in:
Lisa P 2015-10-02 13:35:59 +02:00
parent d07afa8b6f
commit 27cb6035a3
3 changed files with 5 additions and 4 deletions
app/styles/app
components
build-tile.sass
layouts
branches.sassowner.sass

4
app/styles/app/components/build-tile.sass
View File

@ -20,7 +20,7 @@
.build-tiles .build-tiles
height: 5.6rem height: 4.7em
margin: 0 margin: 0
padding: 0 padding: 0
clear: both clear: both
@ -28,8 +28,8 @@
li li
position: relative position: relative
height: 100% height: 100%
width: 20%
float: left float: left
width: 20%
background-color: #F7F7F7 background-color: #F7F7F7
border-right: 1px solid $white border-right: 1px solid $white
&:last-of-type &:last-of-type

3
app/styles/app/layouts/branches.sass
View File

@ -15,6 +15,8 @@
background-color: #E9EBEB background-color: #E9EBEB
@media #{$medium-up} @media #{$medium-up}
display: flex
justify-content: space-between
& > div:first-of-type & > div:first-of-type
width: 30% width: 30%
padding-left: 1em padding-left: 1em
@ -26,7 +28,6 @@
// width: 5% // width: 5%
& > div:nth-of-type(4) & > div:nth-of-type(4)
width: 28% width: 28%
float: right
@media #{$large-up} @media #{$large-up}
& > div:nth-of-type(2) & > div:nth-of-type(2)
width: 21% width: 21%

2
app/styles/app/layouts/owner.sass
View File

@ -99,4 +99,4 @@
& > div:nth-of-type(4) & > div:nth-of-type(4)
width: 15% width: 15%
& > div:nth-of-type(5) & > div:nth-of-type(5)
width: 25% width: 24%