SIGMA/swedishchamber-granprize
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

* mobile layout changes

Browse Source
This commit is contained in:
Danyi Dávid
2018-05-06 16:40:01 +02:00
parent 3304966c52
commit a78d46645f
2 changed files with 34 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
public/styles/main.css
View File

@@ -69,7 +69,7 @@ section.error {
@media only screen and (max-width: 779px) {
.app-container {
grid-template-columns: auto;
grid-template-rows: 170px 150px auto 70px;
grid-template-rows: auto auto auto 70px;
grid-template-areas:
"header"
"nav"
@@ -99,7 +99,7 @@ section.error {
}
img.embedded-image {
max-width: 30%;
max-width: 50%;
float: right;
margin-left: 10px;
margin-bottom: 10px;
@@ -115,11 +115,11 @@ section.error {
a.awardee {
float: left;
margin-right: 20px;
grid-template-columns: 180px auto;
grid-template-columns: 80px auto;
}
section.awardee {
grid-template-columns: 180px auto;
grid-template-columns: 80px auto;
}
a.awardee {
@@ -128,6 +128,14 @@ section.error {
padding-right: 20px;
}
section.awardees > .awardee > img.profile,
section.profile> .awardee > img.profile {
width: 80px;
height: 80px;
border-radius: 40px;
align-self: center;
}
header,
footer,
nav {
@@ -135,6 +143,10 @@ section.error {
padding-right: 20px;
}
header.main .title img {
width: 55px;
}
section.profile {
grid-template-columns: auto;
grid-template-rows: auto auto;
@@ -148,27 +160,6 @@ section.error {
margin-right: 20px;
}
nav > ul {
position: relative;
}
nav > ul > li {
display: inline-block;
width: auto;
padding-right: 30px;
}
nav ul.menu_level_1 {
left: 0;
position: absolute;
}
nav ul.menu_level_1 > li {
position: relative;
display: inline-block;
max-width: 20%;
}
section.error {
margin-left: 20px;
margin-right: 20px;
@@ -229,6 +220,7 @@ section.error {
a.awardee {
float: left;
width: 470px;
margin-right: 20px;
margin-left: 20px;
grid-template-columns: 180px 270px;
@@ -238,8 +230,11 @@ section.error {
grid-template-columns: 180px 380px;
}
a.awardee {
width: 470px;
section.awardees > .awardee > img.profile,
section.profile> .awardee > img.profile {
width: 180px;
height: 180px;
border-radius: 90px;
}
section.profile {
@@ -301,14 +296,18 @@ section.error {
float: left;
margin-right: 20px;
grid-template-columns: 180px 270px;
width: 470px;
}
section.awardee {
grid-template-columns: 180px 380px;
}
a.awardee {
width: 470px;
section.awardees > .awardee > img.profile,
section.profile> .awardee > img.profile {
width: 180px;
height: 180px;
border-radius: 90px;
}
section.profile {
@@ -373,6 +372,7 @@ section.judge > img.profile {
section.judge > .title {
font-size: 18pt;
font-weight: bold;
}
section.judge > .description {
@@ -386,9 +386,7 @@ section.awardees {
section.awardees > .awardee > img.profile,
section.profile> .awardee > img.profile {
width: 180px;
height: 180px;
border-radius: 90px;
grid-area: image;
}
/* awardee (profile) */
@@ -431,12 +429,14 @@ section.awardee {
.awardee .year {
grid-area: year;
font-family: 'Raleway', sans-serif;
font-size: 32pt;
align-self: end;
}
.awardee .name {
grid-area: name;
font-family: 'PT Serif', serif;
font-size: 34pt;
line-height: 32pt;
font-weight: bold;
@@ -455,6 +455,7 @@ header.main {
header .title {
margin-top: 30px;
font-size: 40pt;
font-weight: bold;
}
header .description {