bellingcat/ukraine-timemap
1
0
Fork 0
mirror of https://github.com/bellingcat/ukraine-timemap.git synced 2026-06-11 21:08:36 +03:00
Code Issues Packages Projects Releases Wiki Activity

better narrative card styles with scroll

Browse Source
This commit is contained in:
Lachlan Kermode
2019-01-17 12:32:44 +00:00
committed by Franc Camps-Febrer
parent 798d0b0703
commit dbc0b0b0f2
3 changed files with 11 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/presentational/NarrativeCard.js
View File

@@ -24,7 +24,9 @@ function NarrativeCard ({ narrative }) {
{/* <i className='material-icons left'>location_on</i> */}
{/* {_renderActions(current, steps)} */}
<p className='narrative-info-desc'>{narrative.description}</p>
<div className='narrative-info-desc'>
<p>{narrative.description}</p>
</div>
</div>
)
} else {

2
src/scss/cardstack.scss
View File

@@ -2,7 +2,7 @@
@import 'card';
$card-width: 370px;
$narrative-info-max-height: 170px;
$narrative-info-max-height: 200px;
$timeline-height: 170px;
.card-stack {

13
src/scss/narrativecard.scss
View File

@@ -1,4 +1,4 @@
$narrative-info-width: 370px;
$narrative-info-width: 386px;
$timeline-height: 170px;
/*
@@ -8,8 +8,8 @@ NARRATIVE INFO
position: fixed;
top: 30px;
left: auto;
right: 25px;
height: 170px;
right: 9px;
height: 205px;
width: $narrative-info-width;
box-sizing: border-box;
max-height: calc(100% - 250px);
@@ -39,7 +39,8 @@ NARRATIVE INFO
}
.narrative-info-desc {
overflow: auto;
height: 153px;
overflow-y: auto;
}
p {
@@ -117,7 +118,7 @@ NARRATIVE INFO
&.right {
// right: calc(#{$narrative-info-width} + 10px);
right: 10px;
right: 25px;
}
.material-icons {
@@ -142,7 +143,7 @@ NARRATIVE INFO
position: fixed;
padding: 2px 5px 0 5px;
// right: $narrative-info-width - 15px - 10px;
right: 25px;
right: 10px;
top: 5px;
width: $narrative-info-width - 10px - 2px;
// width: 15px;