Skip to content

Instantly share code, notes, and snippets.

@gullinbursti

gullinbursti/mask.css

Created April 7, 2019 03:11
Show Gist options
  • Save gullinbursti/c5795f76d281d533f4fa425b18c08aa3 to your computer and use it in GitHub Desktop.
Save gullinbursti/c5795f76d281d533f4fa425b18c08aa3 to your computer and use it in GitHub Desktop.
Download ZIP
Design Engine auto generated syntax v1
Raw
mask.css
/* CSS Generator v1.0 */
/* Code snippets by Design Engine. */
/* Made in Mountain View, CA. */
/* -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- */
.not-available {
position: absolute;
top: 0px;
left: 0px;
width: 414px;
height: 736px;
}
.background {
position: absolute;
top: 0px;
left: 0px;
width: 414px;
height: 736px;
background-color: #FCFFF1;
}
.mask {
position: absolute;
top: 0px;
left: 0px;
width: 414px;
height: 736px;
background-color: #FCFFF1;
}
.path-2-copy {
position: absolute;
top: 184px;
left: 119px;
width: 178px;
height: 186px;
background-color: #44DA00;
}
.available {
position: absolute;
top: 264px;
left: 155px;
width: 104px;
height: 20px;
font-family: "AvenirNext DemiBold", sans-serif;
font-weight: 600;
font-size: 24px;
color: #4A4A4A;
letter-spacing: 0.00px;
line-height: 32px;
text-align: center;
}
.rectangle-5 {
position: absolute;
top: 389px;
left: 17px;
width: 380px;
height: 196px;
background-color: #FFFFFF;
}
.buy {
position: absolute;
top: 499px;
left: 27px;
width: 360px;
height: 38px;
background-color: #44DA00;
}
.rectangle-3 {
position: absolute;
top: 499px;
left: 27px;
width: 360px;
height: 38px;
background-color: #44DA00;
}
.buy {
position: absolute;
top: 511px;
left: 192px;
width: 29px;
height: 19px;
font-family: "AvenirNext DemiBold", sans-serif;
font-weight: 600;
font-size: 18px;
color: #4A4A4A;
letter-spacing: 0.00px;
line-height: 24px;
text-align: center;
}
.buy {
position: absolute;
top: 547px;
left: 27px;
width: 360px;
height: 38px;
background-color: #D3D3D3;
}
.rectangle-3 {
position: absolute;
top: 547px;
left: 27px;
width: 360px;
height: 38px;
background-color: #D3D3D3;
}
.cancel {
position: absolute;
top: 558px;
left: 179px;
width: 55px;
height: 15px;
font-family: "AvenirNext DemiBold", sans-serif;
font-weight: 600;
font-size: 18px;
color: #9B9B9B;
letter-spacing: 0.00px;
line-height: 24px;
text-align: center;
}
.text {
position: absolute;
top: 414px;
left: 27px;
width: 360px;
height: 75px;
background-color: ;
}
.size-82-up2-price {
position: absolute;
top: 450px;
left: 129px;
width: 157px;
height: 37px;
font-family: "AvenirNext DemiBold", sans-serif;
font-weight: 600;
font-size: 15px;
color: #9B9B9B;
letter-spacing: 0.00px;
line-height: 23px;
text-align: center;
}
.670-market-st-san-f {
position: absolute;
top: 418px;
left: 47px;
width: 319px;
height: 19px;
font-family: "AvenirNext Bold", sans-serif;
font-weight: 700;
font-size: 20px;
color: #4C56FF;
letter-spacing: 0.00px;
line-height: 20px;
text-align: center;
}
.footer {
position: absolute;
top: 696px;
left: 0px;
width: 414px;
height: 40px;
background-color: #616161;
}
.background {
position: absolute;
top: 696px;
left: 0px;
width: 414px;
height: 40px;
background-color: #616161;
}
.rectangle-2 {
position: absolute;
top: 696px;
left: 0px;
width: 414px;
height: 40px;
background-color: #616161;
}
.user {
position: absolute;
top: 698px;
left: 23px;
width: 98px;
height: 36px;
background-color: #FFFFFF;
}
.combined-shape {
position: absolute;
top: 708px;
left: 23px;
width: 18px;
height: 16px;
background-color: #FFFFFF;
}
.idanzuck {
position: absolute;
top: 709px;
left: 52px;
width: 62px;
height: 13px;
font-family: "AvenirNext DemiBold", sans-serif;
font-weight: 600;
font-size: 15px;
color: #FFFFFF;
letter-spacing: 0.00px;
line-height: 20px;
text-align: left;
}
.portfolio {
position: absolute;
top: 698px;
left: 161px;
width: 92px;
height: 36px;
background-color: #FFFFFF;
}
.13698 {
position: absolute;
top: 709px;
left: 193px;
width: 58px;
height: 15px;
font-family: "AvenirNext DemiBold", sans-serif;
font-weight: 600;
font-size: 15px;
color: #FFFFFF;
letter-spacing: 0.00px;
line-height: 20px;
text-align: left;
}
.shape {
position: absolute;
top: 708px;
left: 161px;
width: 22px;
height: 16px;
background-color: #FFFFFF;
}
.my-portfolio {
position: absolute;
top: 709px;
left: 305px;
width: 84px;
height: 17px;
font-family: "AvenirNext DemiBold", sans-serif;
font-weight: 600;
font-size: 15px;
color: #FFFFFF;
letter-spacing: 0.00px;
line-height: 20px;
text-align: right;
}
.footer {
position: absolute;
top: 696px;
left: 0px;
width: 414px;
height: 40px;
background-color: #4A4A4A;
}
.background {
position: absolute;
top: 696px;
left: 0px;
width: 414px;
height: 40px;
background-color: #4A4A4A;
}
.rectangle-2 {
position: absolute;
top: 696px;
left: 0px;
width: 414px;
height: 40px;
background-color: #4A4A4A;
}
.user {
position: absolute;
top: 698px;
left: 23px;
width: 98px;
height: 36px;
background-color: #FFFFFF;
}
.combined-shape {
position: absolute;
top: 708px;
left: 23px;
width: 18px;
height: 16px;
background-color: #FFFFFF;
}
.idanzuck {
position: absolute;
top: 709px;
left: 52px;
width: 62px;
height: 13px;
font-family: "AvenirNext DemiBold", sans-serif;
font-weight: 600;
font-size: 15px;
color: #FFFFFF;
letter-spacing: 0.00px;
line-height: 20px;
text-align: left;
}
.portfolio {
position: absolute;
top: 698px;
left: 161px;
width: 92px;
height: 36px;
background-color: #FFFFFF;
}
.13698 {
position: absolute;
top: 709px;
left: 193px;
width: 58px;
height: 15px;
font-family: "AvenirNext DemiBold", sans-serif;
font-weight: 600;
font-size: 15px;
color: #FFFFFF;
letter-spacing: 0.00px;
line-height: 20px;
text-align: left;
}
.shape {
position: absolute;
top: 708px;
left: 161px;
width: 22px;
height: 16px;
background-color: #FFFFFF;
}
.my-portfolio {
position: absolute;
top: 709px;
left: 305px;
width: 84px;
height: 17px;
font-family: "AvenirNext DemiBold", sans-serif;
font-weight: 600;
font-size: 15px;
color: #FFFFFF;
letter-spacing: 0.00px;
line-height: 20px;
text-align: right;
}
.background {
position: absolute;
top: 0px;
left: 0px;
width: 414px;
height: 68px;
background-color: #5EBEA2;
}
.rectangle {
position: absolute;
top: 0px;
left: 0px;
width: 414px;
height: 68px;
background-color: #5EBEA2;
}
.right {
position: absolute;
top: 13px;
left: 207px;
width: 119px;
height: 42px;
background-color: #FFFFFF;
}
.rectangle-3 {
position: absolute;
top: 13px;
left: 207px;
width: 119px;
height: 42px;
background-color: #FFFFFF;
}
.list-view {
position: absolute;
top: 27px;
left: 230px;
width: 72px;
height: 15px;
font-family: "AvenirNext DemiBold", sans-serif;
font-weight: 600;
font-size: 18px;
color: #FFFFFF;
letter-spacing: 0.00px;
line-height: 24px;
text-align: center;
}
.left {
position: absolute;
top: 13px;
left: 88px;
width: 119px;
height: 42px;
background-color: #000000;
}
.rectangle-3 {
position: absolute;
top: 13px;
left: 88px;
width: 119px;
height: 42px;
background-color: #000000;
}
.map-view {
position: absolute;
top: 27px;
left: 107px;
width: 82px;
height: 19px;
font-family: "AvenirNext DemiBold", sans-serif;
font-weight: 600;
font-size: 18px;
color: #FFFFFF;
letter-spacing: 0.00px;
line-height: 24px;
text-align: center;
}
.search {
position: absolute;
top: 10px;
left: 354px;
width: 48px;
height: 48px;
background-color: #FFFFFF;
}
.shape {
position: absolute;
top: 20px;
left: 364px;
width: 28px;
height: 28px;
background-color: #FFFFFF;
}
.home {
position: absolute;
top: 10px;
left: 10px;
width: 48px;
height: 48px;
background-color: #FFFFFF;
}
.logo {
position: absolute;
top: 14px;
left: 21px;
width: 23px;
height: 40px;
background-color: #FFFFFF;
}
.background {
position: absolute;
top: 0px;
left: 0px;
width: 414px;
height: 68px;
background-color: #5EBEA2;
}
.rectangle {
position: absolute;
top: 0px;
left: 0px;
width: 414px;
height: 68px;
background-color: #5EBEA2;
}
.right {
position: absolute;
top: 13px;
left: 207px;
width: 119px;
height: 42px;
background-color: #FFFFFF;
}
.rectangle-3 {
position: absolute;
top: 13px;
left: 207px;
width: 119px;
height: 42px;
background-color: #FFFFFF;
}
.group-2 {
position: absolute;
top: 24px;
left: 255px;
width: 24px;
height: 20px;
background-color: #FFFFFF;
}
.rectangle-4 {
position: absolute;
top: 24px;
left: 255px;
width: 24px;
height: 4px;
background-color: #FFFFFF;
}
.rectangle-4 {
position: absolute;
top: 32px;
left: 255px;
width: 24px;
height: 4px;
background-color: #FFFFFF;
}
.rectangle-4 {
position: absolute;
top: 40px;
left: 255px;
width: 24px;
height: 4px;
background-color: #FFFFFF;
}
.left {
position: absolute;
top: 13px;
left: 88px;
width: 119px;
height: 42px;
background-color: #000000;
}
.rectangle-3 {
position: absolute;
top: 13px;
left: 88px;
width: 119px;
height: 42px;
background-color: #000000;
}
.shape {
position: absolute;
top: 22px;
left: 138px;
width: 19px;
height: 25px;
background-color: #000000;
}
.search {
position: absolute;
top: 10px;
left: 354px;
width: 48px;
height: 48px;
background-color: #FFFFFF;
}
.shape {
position: absolute;
top: 20px;
left: 364px;
width: 28px;
height: 28px;
background-color: #FFFFFF;
}
.home {
position: absolute;
top: 10px;
left: 10px;
width: 48px;
height: 48px;
background-color: #FFFFFF;
}
.logo {
position: absolute;
top: 14px;
left: 21px;
width: 23px;
height: 40px;
background-color: #FFFFFF;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment