mirror/feather
1
0
Fork 0
mirror of https://github.com/feathericons/feather.git synced 2023-08-10 21:13:24 +03:00
Code Issues Projects Releases Wiki Activity

Include Carbon Ads

Browse Source
This commit is contained in:
Cole Bemis 2017-07-08 02:52:54 -07:00
parent 2191ca23e5
commit 76d31ecb03
6 changed files with 78 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
_includes/footer.html
View File

@ -1,5 +1,5 @@
<footer class="flex flex-column items-center pv6-l pv5"> <footer class="flex flex-column items-center pv6-l pv5">
<ul class="flex flex-column flex-row-l justify-center w-80 mv0 pl0 list"> <ul class="flex flex-column flex-row-l justify-center w-80 mw8 mv0 pl0 list">
{% for link in include.links %} {% for link in include.links %}
<li class="mh3-l pv3 pv0-l f5 bb b--black-10 bn-l"> <li class="mh3-l pv3 pv0-l f5 bb b--black-10 bn-l">
<a class="lh-copy color-inherit no-underline dim" href="{{ link.url }}" target="_blank">{{ link.title }}</a> <a class="lh-copy color-inherit no-underline dim" href="{{ link.url }}" target="_blank">{{ link.title }}</a>

2
_includes/header.html
View File

@ -1,5 +1,5 @@
<header class="pv3 bb b--black-10"> <header class="pv3 bb b--black-10">
<div class="w-80 center flex justify-between items-center"> <div class="w-80 mw8 center flex justify-between items-center">
<h1 class="mv0 normal f3 lh-copy black-90">Feather</h1> <h1 class="mv0 normal f3 lh-copy black-90">Feather</h1>
<ul class="list mv0 pl0 flex"> <ul class="list mv0 pl0 flex">

2
_includes/hero.html
View File

@ -1,4 +1,4 @@
<div class="flex flex-column items-center w-80 pv5 pv6-ns center"> <div class="flex flex-column items-center w-80 mw8 pv5 pv6-ns center">
<h2 class="mt0 mb4 f2 fw3 tc lh-title black-90">Simply beautiful open source icons</h2> <h2 class="mt0 mb4 f2 fw3 tc lh-title black-90">Simply beautiful open source icons</h2>
<a <a
class="button white bg-accent dim br2" class="button white bg-accent dim br2"

2
_includes/icons.html
View File

@ -1,4 +1,4 @@
<div class="w-80 center"> <div class="w-80 mw8 center">
<ul class="icon-grid mv0 pl0 list"> <ul class="icon-grid mv0 pl0 list">
{% for file in site.static_files %} {% for file in site.static_files %}
{% if file.path contains 'dist/icons/' %} {% if file.path contains 'dist/icons/' %}

4
index.html
View File

@ -37,9 +37,11 @@ links:
{% include header.html %} {% include header.html %}
{% include hero.html %} {% include hero.html %}
<script async type="text/javascript" src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=feathericonscom" id="_carbonads_js"></script>
{% include icons.html %} {% include icons.html %}
{% include footer.html links=page.links %} {% include footer.html links=page.links %}
</script>
</body> </body>
</html> </html>

72
style.css
View File

@ -50,6 +50,8 @@
padding: 0 0.5rem 1rem; padding: 0 0.5rem 1rem;
} }
/* medium breakpoint */ /* medium breakpoint */
@media (min-width: 30em) { @media (min-width: 30em) {
.icon-grid li { .icon-grid li {
@ -68,7 +70,7 @@
@supports (display: grid) { @supports (display: grid) {
.icon-grid { .icon-grid {
display: grid; display: grid;
grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
grid-gap: 1rem; grid-gap: 1rem;
margin: 0; margin: 0;
} }
@ -79,3 +81,71 @@
padding: 0; padding: 0;
} }
} }
/* Carbon Ads */
#carbonads {
width: 80%;
margin: 0 auto;
padding: 1rem;
margin-bottom: 1rem;
font-size: 0.875rem;
line-height: 1.5;
background: #f4f4f4;
border-radius: .25rem;
}
#carbonads a {
text-decoration: none;
}
.carbon-wrap {
display: flex;
}
.carbon-img {
display: flex;
align-items: center;
margin-right: 1rem;
line-height: 0;
}
.carbon-text {
color: currentColor;
}
.carbon-poweredby {
display: block;
margin-top: 1rem;
font-size: 0.75rem;
text-transform: uppercase;
letter-spacing: 1px;
text-align: center;
color: rgba(0, 0, 0, 0.4);
}
@media (min-width: 45em) {
#carbonads {
position: fixed;
bottom: 1.5rem;
right: 1.5rem;
max-width: 12rem;
margin: 0;
background: rgba(255,255,255,0.9);
box-shadow: 0 0 0 1px rgba(0,0,0,0.1);
}
.carbon-wrap {
flex-direction: column;
align-items: center;
}
.carbon-img {
margin-right: 0;
}
.carbon-text {
text-align: center;
margin-top: 1rem;
}
}