www
/
www-new
12
3
Fork 5
Code Issues 58 Pull Requests 42 Projects Releases Wiki Activity

some styling for blue hotdogs and mobile styles

This commit is contained in:
Linna Luo 2021-06-26 22:03:28 -04:00
parent aa7f1c11d5
commit c73f6dd76d
2 changed files with 49 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
pages/about-us.module.css
View File

@ -31,11 +31,34 @@
.bubble {
padding: calc(48rem / 16) 0 calc(48rem / 16);
margin: calc(16rem / 16) 0;
/* border-radius: 20rem; */
}
/*box-sizing: border box*/
.bubble:nth-child(odd) {
background-color: #e1eefa;
/* .bubble:nth-child(odd) {
background-color: #e1eefa;
background: no-repeat url(/about/hotdog.svg);
background-size: contain;
background-position: right center;
} */
/*styling hotdogs*/
.bubble:nth-child(1) {
background: no-repeat url(/about/hotdog.svg);
background-size: contain;
background-position: left center;
}
.bubble:nth-child(3) {
background: no-repeat url(/about/hotdog.svg);
background-size: cover;
background-position: left center;
}
.bubble:nth-child(5) {
background: no-repeat url(/about/hotdog.svg);
background-size: cover;
background-position: left center;
}
.codey {
@ -71,3 +94,24 @@
.mailingList h2 {
color: var(--blue-2);
}
@media only screen and (max-width: calc(768rem / 16)) {
.bubble:nth-child(odd) {
background-color: #e1eefa;
}
.title {
color: var(--purple-2);
font-size: 48px;
display: flex;
justify-content: center;
}
.codey {
transform: rotate(1.91deg);
position: relative;
right: calc(1020rem / 16);
margin-bottom: -280px;
z-index: -1;
}
}

3
public/about/hotdog.svg Normal file
View File

@ -0,0 +1,3 @@
<svg width="1314" height="247" viewBox="0 0 1314 247" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="-548" y="0.188721" width="1862" height="246" rx="123" fill="#E1EEFA"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 189 B