mirror of
https://github.com/Mibew/simple-icons.git
synced 2025-05-22 18:18:56 +03:00
Improved font metrics
This commit is contained in:
Dan Leech
parent
f0c6aeb837
commit
fbdacb3724
33
404.html
33
404.html
@ -55,18 +55,15 @@
|
|||||||
}
|
}
|
||||||
.title {
|
.title {
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
font-weight: 400;
|
font-weight: 600;
|
||||||
letter-spacing: 0.05rem;
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 1.5rem 1.5rem 0;
|
padding: 1.5rem 1.5rem 0;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
}
|
}
|
||||||
.navbar__text {
|
.navbar__text {
|
||||||
font-size: 0.75rem;
|
font-size: 0.8125rem;
|
||||||
letter-spacing: 0.05rem;
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
text-transform: uppercase;
|
|
||||||
}
|
}
|
||||||
.donate-form {
|
.donate-form {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
@ -81,13 +78,11 @@
|
|||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
font-family: inherit;
|
font-family: inherit;
|
||||||
font-size: 0.75rem;
|
font-size: 0.8125rem;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
letter-spacing: 0.05rem;
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
text-transform: uppercase;
|
|
||||||
}
|
}
|
||||||
.donate-button:focus, .donate-button:hover {
|
.donate-button:focus, .donate-button:hover {
|
||||||
color: #999;
|
color: #999;
|
||||||
@ -111,13 +106,10 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.hero {
|
.hero {
|
||||||
font-size: 0.75rem;
|
|
||||||
letter-spacing: 0.05rem;
|
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
max-width: 18rem;
|
max-width: 18rem;
|
||||||
padding: 3rem 3rem 0;
|
padding: 3rem 3rem 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
text-transform: uppercase;
|
|
||||||
}
|
}
|
||||||
.search-field {
|
.search-field {
|
||||||
-webkit-appearance: none;
|
-webkit-appearance: none;
|
||||||
@ -130,13 +122,11 @@
|
|||||||
color: #999;
|
color: #999;
|
||||||
display: block;
|
display: block;
|
||||||
font-family: inherit;
|
font-family: inherit;
|
||||||
font-size: 0.75rem;
|
font-size: 1rem;
|
||||||
letter-spacing: 0.05rem;
|
line-height: 1rem;
|
||||||
line-height: 0.75rem;
|
|
||||||
margin: 1.5rem auto;
|
margin: 1.5rem auto;
|
||||||
outline: 0;
|
outline: 0;
|
||||||
padding: 0.375rem 0.375rem 0.375rem 1.375rem;
|
padding: 0.375rem 0.375rem 0.375rem 1.375rem;
|
||||||
text-transform: uppercase;
|
|
||||||
width: 12rem;
|
width: 12rem;
|
||||||
}
|
}
|
||||||
.tiles {
|
.tiles {
|
||||||
@ -151,8 +141,7 @@
|
|||||||
background: #333;
|
background: #333;
|
||||||
border: 0.25rem solid #FFF;
|
border: 0.25rem solid #FFF;
|
||||||
color: #FFF;
|
color: #FFF;
|
||||||
font-size: 0.75rem;
|
font-size: 0.8125rem;
|
||||||
letter-spacing: 0.05rem;
|
|
||||||
line-height: 1rem;
|
line-height: 1rem;
|
||||||
padding: 1.25rem 0.75rem 1.25rem;
|
padding: 1.25rem 0.75rem 1.25rem;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
@ -186,25 +175,25 @@
|
|||||||
width: 2rem;
|
width: 2rem;
|
||||||
}
|
}
|
||||||
.hex {
|
.hex {
|
||||||
|
font-size: 0.75rem;
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
|
text-transform: uppercase;
|
||||||
}
|
}
|
||||||
@media (min-width: 500px) { .tiles li { width: 50%; } }
|
@media (min-width: 500px) { .tiles li { width: 50%; } }
|
||||||
@media (min-width: 700px) { .tiles li { width: 33.333%; } }
|
@media (min-width: 700px) { .tiles li { width: 33.333%; } }
|
||||||
@media (min-width: 900px) { .tiles li { width: 25% } }
|
@media (min-width: 900px) { .tiles li { width: 25% } }
|
||||||
@media (min-width: 1100px) { .tiles li { width: 20% } }
|
@media (min-width: 1100px) { .tiles li { width: 20% } }
|
||||||
@media (min-width: 1250px) { .tiles li { width: 16.666% } }
|
@media (min-width: 1400px) { .tiles li { width: 16.666% } }
|
||||||
@media (min-width: 1700px) { .tiles li { width: 12.5% } }
|
@media (min-width: 1700px) { .tiles li { width: 12.5% } }
|
||||||
@media (min-width: 2100px) { .tiles li { width: 10% } }
|
@media (min-width: 2100px) { .tiles li { width: 10% } }
|
||||||
.footer {
|
.footer {
|
||||||
margin: 3rem;
|
margin: 3rem;
|
||||||
}
|
}
|
||||||
.footer p {
|
.footer p {
|
||||||
font-size: 0.75rem;
|
font-size: 0.8125rem;
|
||||||
letter-spacing: 0.05rem;
|
|
||||||
margin: 1.5rem auto 0;
|
margin: 1.5rem auto 0;
|
||||||
max-width: 31.5rem;
|
max-width: 25.5rem;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
text-transform: uppercase;
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
|
|||||||
33
index.html
33
index.html
@ -55,18 +55,15 @@
|
|||||||
}
|
}
|
||||||
.title {
|
.title {
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
font-weight: 400;
|
font-weight: 600;
|
||||||
letter-spacing: 0.05rem;
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 1.5rem 1.5rem 0;
|
padding: 1.5rem 1.5rem 0;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
}
|
}
|
||||||
.navbar__text {
|
.navbar__text {
|
||||||
font-size: 0.75rem;
|
font-size: 0.8125rem;
|
||||||
letter-spacing: 0.05rem;
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
text-transform: uppercase;
|
|
||||||
}
|
}
|
||||||
.donate-form {
|
.donate-form {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
@ -81,13 +78,11 @@
|
|||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
font-family: inherit;
|
font-family: inherit;
|
||||||
font-size: 0.75rem;
|
font-size: 0.8125rem;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
letter-spacing: 0.05rem;
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
text-transform: uppercase;
|
|
||||||
}
|
}
|
||||||
.donate-button:focus, .donate-button:hover {
|
.donate-button:focus, .donate-button:hover {
|
||||||
color: #999;
|
color: #999;
|
||||||
@ -111,13 +106,10 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.hero {
|
.hero {
|
||||||
font-size: 0.75rem;
|
|
||||||
letter-spacing: 0.05rem;
|
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
max-width: 18rem;
|
max-width: 18rem;
|
||||||
padding: 3rem 3rem 0;
|
padding: 3rem 3rem 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
text-transform: uppercase;
|
|
||||||
}
|
}
|
||||||
.search-field {
|
.search-field {
|
||||||
-webkit-appearance: none;
|
-webkit-appearance: none;
|
||||||
@ -130,13 +122,11 @@
|
|||||||
color: #999;
|
color: #999;
|
||||||
display: block;
|
display: block;
|
||||||
font-family: inherit;
|
font-family: inherit;
|
||||||
font-size: 0.75rem;
|
font-size: 1rem;
|
||||||
letter-spacing: 0.05rem;
|
line-height: 1rem;
|
||||||
line-height: 0.75rem;
|
|
||||||
margin: 1.5rem auto;
|
margin: 1.5rem auto;
|
||||||
outline: 0;
|
outline: 0;
|
||||||
padding: 0.375rem 0.375rem 0.375rem 1.375rem;
|
padding: 0.375rem 0.375rem 0.375rem 1.375rem;
|
||||||
text-transform: uppercase;
|
|
||||||
width: 12rem;
|
width: 12rem;
|
||||||
}
|
}
|
||||||
.tiles {
|
.tiles {
|
||||||
@ -151,8 +141,7 @@
|
|||||||
background: #333;
|
background: #333;
|
||||||
border: 0.25rem solid #FFF;
|
border: 0.25rem solid #FFF;
|
||||||
color: #FFF;
|
color: #FFF;
|
||||||
font-size: 0.75rem;
|
font-size: 0.8125rem;
|
||||||
letter-spacing: 0.05rem;
|
|
||||||
line-height: 1rem;
|
line-height: 1rem;
|
||||||
padding: 1.25rem 0.75rem 1.25rem;
|
padding: 1.25rem 0.75rem 1.25rem;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
@ -186,25 +175,25 @@
|
|||||||
width: 2rem;
|
width: 2rem;
|
||||||
}
|
}
|
||||||
.hex {
|
.hex {
|
||||||
|
font-size: 0.75rem;
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
|
text-transform: uppercase;
|
||||||
}
|
}
|
||||||
@media (min-width: 500px) { .tiles li { width: 50%; } }
|
@media (min-width: 500px) { .tiles li { width: 50%; } }
|
||||||
@media (min-width: 700px) { .tiles li { width: 33.333%; } }
|
@media (min-width: 700px) { .tiles li { width: 33.333%; } }
|
||||||
@media (min-width: 900px) { .tiles li { width: 25% } }
|
@media (min-width: 900px) { .tiles li { width: 25% } }
|
||||||
@media (min-width: 1100px) { .tiles li { width: 20% } }
|
@media (min-width: 1100px) { .tiles li { width: 20% } }
|
||||||
@media (min-width: 1250px) { .tiles li { width: 16.666% } }
|
@media (min-width: 1400px) { .tiles li { width: 16.666% } }
|
||||||
@media (min-width: 1700px) { .tiles li { width: 12.5% } }
|
@media (min-width: 1700px) { .tiles li { width: 12.5% } }
|
||||||
@media (min-width: 2100px) { .tiles li { width: 10% } }
|
@media (min-width: 2100px) { .tiles li { width: 10% } }
|
||||||
.footer {
|
.footer {
|
||||||
margin: 3rem;
|
margin: 3rem;
|
||||||
}
|
}
|
||||||
.footer p {
|
.footer p {
|
||||||
font-size: 0.75rem;
|
font-size: 0.8125rem;
|
||||||
letter-spacing: 0.05rem;
|
|
||||||
margin: 1.5rem auto 0;
|
margin: 1.5rem auto 0;
|
||||||
max-width: 31.5rem;
|
max-width: 25.5rem;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
text-transform: uppercase;
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
|
|||||||
@ -55,18 +55,15 @@
|
|||||||
}
|
}
|
||||||
.title {
|
.title {
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
font-weight: 400;
|
font-weight: 600;
|
||||||
letter-spacing: 0.05rem;
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 1.5rem 1.5rem 0;
|
padding: 1.5rem 1.5rem 0;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
}
|
}
|
||||||
.navbar__text {
|
.navbar__text {
|
||||||
font-size: 0.75rem;
|
font-size: 0.8125rem;
|
||||||
letter-spacing: 0.05rem;
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
text-transform: uppercase;
|
|
||||||
}
|
}
|
||||||
.donate-form {
|
.donate-form {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
@ -81,13 +78,11 @@
|
|||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
font-family: inherit;
|
font-family: inherit;
|
||||||
font-size: 0.75rem;
|
font-size: 0.8125rem;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
letter-spacing: 0.05rem;
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
text-transform: uppercase;
|
|
||||||
}
|
}
|
||||||
.donate-button:focus, .donate-button:hover {
|
.donate-button:focus, .donate-button:hover {
|
||||||
color: #999;
|
color: #999;
|
||||||
@ -111,13 +106,10 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.hero {
|
.hero {
|
||||||
font-size: 0.75rem;
|
|
||||||
letter-spacing: 0.05rem;
|
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
max-width: 18rem;
|
max-width: 18rem;
|
||||||
padding: 3rem 3rem 0;
|
padding: 3rem 3rem 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
text-transform: uppercase;
|
|
||||||
}
|
}
|
||||||
.search-field {
|
.search-field {
|
||||||
-webkit-appearance: none;
|
-webkit-appearance: none;
|
||||||
@ -130,13 +122,11 @@
|
|||||||
color: #999;
|
color: #999;
|
||||||
display: block;
|
display: block;
|
||||||
font-family: inherit;
|
font-family: inherit;
|
||||||
font-size: 0.75rem;
|
font-size: 1rem;
|
||||||
letter-spacing: 0.05rem;
|
line-height: 1rem;
|
||||||
line-height: 0.75rem;
|
|
||||||
margin: 1.5rem auto;
|
margin: 1.5rem auto;
|
||||||
outline: 0;
|
outline: 0;
|
||||||
padding: 0.375rem 0.375rem 0.375rem 1.375rem;
|
padding: 0.375rem 0.375rem 0.375rem 1.375rem;
|
||||||
text-transform: uppercase;
|
|
||||||
width: 12rem;
|
width: 12rem;
|
||||||
}
|
}
|
||||||
.tiles {
|
.tiles {
|
||||||
@ -151,8 +141,7 @@
|
|||||||
background: #333;
|
background: #333;
|
||||||
border: 0.25rem solid #FFF;
|
border: 0.25rem solid #FFF;
|
||||||
color: #FFF;
|
color: #FFF;
|
||||||
font-size: 0.75rem;
|
font-size: 0.8125rem;
|
||||||
letter-spacing: 0.05rem;
|
|
||||||
line-height: 1rem;
|
line-height: 1rem;
|
||||||
padding: 1.25rem 0.75rem 1.25rem;
|
padding: 1.25rem 0.75rem 1.25rem;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
@ -186,25 +175,25 @@
|
|||||||
width: 2rem;
|
width: 2rem;
|
||||||
}
|
}
|
||||||
.hex {
|
.hex {
|
||||||
|
font-size: 0.75rem;
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
|
text-transform: uppercase;
|
||||||
}
|
}
|
||||||
@media (min-width: 500px) { .tiles li { width: 50%; } }
|
@media (min-width: 500px) { .tiles li { width: 50%; } }
|
||||||
@media (min-width: 700px) { .tiles li { width: 33.333%; } }
|
@media (min-width: 700px) { .tiles li { width: 33.333%; } }
|
||||||
@media (min-width: 900px) { .tiles li { width: 25% } }
|
@media (min-width: 900px) { .tiles li { width: 25% } }
|
||||||
@media (min-width: 1100px) { .tiles li { width: 20% } }
|
@media (min-width: 1100px) { .tiles li { width: 20% } }
|
||||||
@media (min-width: 1250px) { .tiles li { width: 16.666% } }
|
@media (min-width: 1400px) { .tiles li { width: 16.666% } }
|
||||||
@media (min-width: 1700px) { .tiles li { width: 12.5% } }
|
@media (min-width: 1700px) { .tiles li { width: 12.5% } }
|
||||||
@media (min-width: 2100px) { .tiles li { width: 10% } }
|
@media (min-width: 2100px) { .tiles li { width: 10% } }
|
||||||
.footer {
|
.footer {
|
||||||
margin: 3rem;
|
margin: 3rem;
|
||||||
}
|
}
|
||||||
.footer p {
|
.footer p {
|
||||||
font-size: 0.75rem;
|
font-size: 0.8125rem;
|
||||||
letter-spacing: 0.05rem;
|
|
||||||
margin: 1.5rem auto 0;
|
margin: 1.5rem auto 0;
|
||||||
max-width: 31.5rem;
|
max-width: 25.5rem;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
text-transform: uppercase;
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user