77 lines
1.5 KiB
Sass
77 lines
1.5 KiB
Sass
|
$size-la-une: 220px
|
||
|
$size-news: 100px
|
||
|
.post
|
||
|
display: flex
|
||
|
flex-wrap: nowrap
|
||
|
margin-bottom: 2rem
|
||
|
|
||
|
@media screen and (max-width: $size-sm)
|
||
|
flex-direction: column
|
||
|
justify-content: center
|
||
|
align-items: center
|
||
|
.picture
|
||
|
width: $size-news
|
||
|
height: $size-news
|
||
|
background: $orange
|
||
|
flex-shrink: 0
|
||
|
@media screen and (max-width: $size-sm)
|
||
|
margin-bottom: 1rem
|
||
|
|
||
|
a
|
||
|
width: 100%
|
||
|
height: 100%
|
||
|
display: block
|
||
|
|
||
|
&.big
|
||
|
|
||
|
.picture
|
||
|
width: $size-la-une
|
||
|
height: $size-la-une
|
||
|
@media screen and (max-width: $size-sm)
|
||
|
width: 100%
|
||
|
overflow: hidden
|
||
|
margin: 0
|
||
|
img
|
||
|
width: 100%
|
||
|
.details
|
||
|
padding: 20px
|
||
|
background: $grey
|
||
|
height: $size-la-une
|
||
|
overflow: hidden
|
||
|
text-overflow: ellipsis
|
||
|
@media screen and (max-width: $size-sm)
|
||
|
height: inherit
|
||
|
.details
|
||
|
padding: 0 1rem
|
||
|
height: $size-news
|
||
|
max-width: 100%
|
||
|
overflow: hidden
|
||
|
@media screen and (max-width: $size-sm)
|
||
|
height: inherit
|
||
|
text-align: center
|
||
|
|
||
|
span
|
||
|
font-size: .8rem
|
||
|
display: block
|
||
|
h2
|
||
|
margin: .6rem 0
|
||
|
white-space: nowrap
|
||
|
overflow: hidden
|
||
|
text-overflow: ellipsis
|
||
|
h3
|
||
|
margin: .3rem 0
|
||
|
white-space: nowrap
|
||
|
overflow: hidden
|
||
|
text-overflow: ellipsis
|
||
|
|
||
|
.text
|
||
|
font-size: .9rem
|
||
|
overflow: hidden
|
||
|
text-overflow: ellipsis
|
||
|
width: 100%
|
||
|
padding-top: 6px
|
||
|
|
||
|
p
|
||
|
margin: 0
|
||
|
display: inline
|