icd/social-media-cards
2
0
Fork 0
Code Issues Pull Requests 1 Projects Releases Wiki Activity

Redesign, dodanie fontu Poppins #1

Closed
arek wants to merge 1 commits from master into poppins-font
pull from: master
merge into: icd:poppins-font
Conversation 0 Commits 1 Files Changed - +29 -12
2 changed files with 29 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit db6ab4fc19 - Show all commits

41
generator.html
View File

@ -4,8 +4,17 @@
<meta charset="utf-8" />
<title>Generator kart na social media</title>
<style>
@font-face {
font-family: Poppins;
src: url(./poppins.ttf);
}
* {
font-family: sans-serif;
font-family: 'Noto Sans', sans-serif;
}
p {
font-family: Poppins;
}
#container.overflow {
@ -33,9 +42,17 @@
}
#text_box {
background-color: white;
padding-top: var(--padding);
background-color: var(--yellow);
color: #fff;
display: grid;
grid-template-columns: 1fr 1fr;
}
#text_target {
background-color: #000;
}
</style>
</head>
<body
@ -77,6 +94,7 @@ Treść komunikatu</textarea
style="
box-sizing: border-box;
border: calc(var(--padding) * var(--scale)) solid var(--yellow);
border-top: calc(var(--padding) * var(--scale)/3) solid var(--yellow);
display: flex;
flex-flow: column;
width: calc(var(--scale) * var(--width));
@ -84,24 +102,23 @@ Treść komunikatu</textarea
"
>
<div id="text_box">
<p
id="text_target"
style="font-size: calc(var(--scale) * 16px); padding: var(--padding);"
>
Treść komunikatu
</p>
<img
src="./logo.png"
width="80"
height="80"
style="
float: left;
height: calc(var(--scale) * 80px);
width: calc(var(--scale) * 80px);
padding-right: var(--padding);
margin-top: calc(-1 * var(--padding));
padding-left: var(--padding);
justify-self: flex-end;
"
/>
<p
id="text_target"
style="margin: 0; font-size: calc(var(--scale) * 16px)"
>
Treść komunikatu
</p>
</div>
<div
id="image_box"

BIN
poppins.ttf Normal file
View File

Binary file not shown.