ui fixes, baselines, background image, sticky nav and close modal

This commit is contained in:
Janne Koivistoinen 2017-12-01 18:43:50 +02:00
parent 994761b2cf
commit 17e55c8116
6 changed files with 21 additions and 18 deletions

View file

@ -57,12 +57,12 @@
display: inline-block;
margin: 0;
padding: 6px 14px 11px 14px;
padding: 8.5px 14px 8.5px 14px;
border-radius: 8px;
box-shadow: var(--boxShadow);
@media (--viewportMedium) {
padding: 6px 14px 11px 14px;
padding: 8.5px 14px 8.5px 14px;
margin: 0;
}
}
@ -85,7 +85,7 @@
color: var(--matterColorAnti);
@media (--viewportMedium) {
margin: 7px 0 0 0;
margin: 6px 0 0 0;
}
}

View file

@ -2,6 +2,7 @@
.root {
width: 100%;
position: relative;
position: sticky;
top: 0;
z-index: var(--zIndexTopbar);
}

View file

@ -90,7 +90,7 @@
margin: 23px 24px 0 24px;
}
@media (--viewportLarge) {
margin: 23px 0 0 0;
margin: 22px 0 -2px 0;
}
}
@ -118,7 +118,7 @@
@media (--viewportLarge) {
position: absolute;
top: 25px;
top: 151px;
}
}
@ -207,7 +207,7 @@
}
.breakdownDesktop {
margin: 0 48px 50px 48px;
margin: 0 48px 47px 48px;
}
.feedContainer {

View file

@ -131,9 +131,6 @@
predictions list */
position: absolute;
top: 73px;
/* Pull text behind search suggestions */
z-index: -1;
}
/* ================ Modal ================ */

View file

@ -18,11 +18,6 @@
@media (--viewportMedium) {
min-height: calc(100vh - var(--topbarHeightDesktop));
border: solid 24px #fcfcfc;
}
@media (--viewportLarge) {
border: solid 36px #fcfcfc;
}
}
@ -34,7 +29,6 @@
@media (--viewportMedium) {
justify-content: center;
padding-top: 60px;
border-radius: 4px;
}
}

View file

@ -24,6 +24,16 @@
/* Align the image within the container */
background-position: center center;
@media (--viewportMedium) {
border-radius: 28px;
border: solid 24px var(--matterColorBright);
}
@media (--viewportLarge) {
border-radius: 40px;
border: solid 36px var(--matterColorBright);
}
}
/* ================ Colors ================ */
@ -444,7 +454,7 @@
--marketplaceModalCloseStyles {
/* Position inside modal */
position: absolute;
position: fixed;
top: 0;
right: 0;
@ -457,12 +467,13 @@
width: auto;
/* Sizing (touch area) */
padding: 24px 30px;
padding: 24px 40px;
margin: 0;
border: 0;
@media (--viewportMedium) {
padding: 27px 30px;
position: absolute;
}
/* Colors */