From b37cc0ee797939354b907ddf265a0474ddce8112 Mon Sep 17 00:00:00 2001 From: anthonytadina Date: Fri, 11 Oct 2013 14:19:15 -0700 Subject: [PATCH] Updated Inky --- images/inky-all-devices.svg | 159 ++++++------ images/inky-stamp-2.svg | 348 ++++++++++++++++++++++++++ images/inky-stamp.svg | 184 +++++++------- images/inky-template.svg | 479 ++++++++++++++++++++++++++++++++++++ includes/_footer.php | 6 +- includes/_subscribe.php | 4 +- index.php | 18 +- sass/_footer.scss | 2 +- sass/app.scss | 11 +- sass/topbar.scss | 12 +- stylesheets/app.css | 126 +++++----- stylesheets/topbar.css | 12 +- templates.php | 6 +- 13 files changed, 1097 insertions(+), 270 deletions(-) create mode 100644 images/inky-stamp-2.svg create mode 100644 images/inky-template.svg diff --git a/images/inky-all-devices.svg b/images/inky-all-devices.svg index bee3a8e3..2d905561 100644 --- a/images/inky-all-devices.svg +++ b/images/inky-all-devices.svg @@ -45,9 +45,9 @@ - + - + @@ -79,7 +79,7 @@ c0.147-0.341,0.151-0.72,0.013-1.064l-12.098-30.222C261.638,116.944,260.882,116.59,260.188,116.817 C260.188,116.817,260.882,116.59,260.188,116.817L260.188,116.817L260.188,116.817z"/> - + @@ -132,17 +132,17 @@ c0,0,0.004-0.008,0.006-0.013c0.539,0.709,2.612,1.698,10.368-3.69c8.365-5.811,7.375-8.155,6.836-8.761L227.031,180.549 L227.031,180.549L227.031,180.549L227.031,180.549z"/> - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + @@ -519,19 +519,19 @@ c-0.604-0.277-1.292-0.277-1.832-0.056C189.699,200.005,191.018,200.443,192.765,201.443 C192.765,201.443,191.018,200.443,192.765,201.443L192.765,201.443L192.765,201.443z"/> - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + @@ -566,11 +566,11 @@ c0.008,0.54,0.194,0.964,0.528,1.373C78.09,221.259,79.574,220.645,81.73,219.802C81.73,219.802,79.574,220.645,81.73,219.802 L81.73,219.802L81.73,219.802z"/> - + - + - + - + - - - - - - - - - + + - + - + - + @@ -708,17 +701,17 @@ c0.296,0.84,1.966,2.417,11-0.336c9.743-2.969,9.519-5.503,9.191-6.246L40.895,127.169L40.895,127.169L40.895,127.169 L40.895,127.169z"/> - + - + - + - + - + - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/images/inky-stamp.svg b/images/inky-stamp.svg index 752ff7f6..a5eb7e04 100644 --- a/images/inky-stamp.svg +++ b/images/inky-stamp.svg @@ -14,7 +14,7 @@ - + - + - + @@ -104,7 +104,7 @@ - + - - - + + - - - + - - - - - - - - + + - - + - - + - - - + + - - + - - - + + - - - + - - - - - - - - + + - - + - - - - - + + + + - - + - - - - - + + + + - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/includes/_footer.php b/includes/_footer.php index 17f0f2e2..51ac36c2 100644 --- a/includes/_footer.php +++ b/includes/_footer.php @@ -15,7 +15,7 @@ @@ -30,8 +30,8 @@

Stay in touch

-

Get monthly updates from ZURB in your inbox. Read our latest news & buzz.

- Get ZURBnews! +

Get monthly updates from Ink in your inbox. Read our latest news & buzz.

+ Get Ink News
diff --git a/includes/_subscribe.php b/includes/_subscribe.php index 5cfbb2be..da66927f 100644 --- a/includes/_subscribe.php +++ b/includes/_subscribe.php @@ -1,8 +1,8 @@
-
Stay updated on responsive design with Responsive from ZURB.
-

Sign up to receive monthly Responsive Reading highlights. Read Last Month's Edition »

+
Stay updated on Ink with Responsive Emails from ZURB.
+

Sign up to receive monthly Responsive Emails highlights. Read Last Month's Edition »

diff --git a/index.php b/index.php index 65959384..d2ec3756 100644 --- a/index.php +++ b/index.php @@ -22,7 +22,7 @@ Menu-wht

Ink

Ink

-

Quickly create responsive emails that work on any device & client. Even Outlook.

+

Quickly create responsive HTML emails that work on any device & client. Even Outlook.

Download Ink 0.7.1
@@ -34,9 +34,9 @@
-

Email. Anywhere. On Any Device.

-

How email was meant to be read.

-

Reach out your tentacles to a broad range of readers. Our CSS framework helps you craft emails that can be read anywhere on any device. Gone are the days where you had to choose between Outlook and email optimized for smartphones and tablets. Ink's responsive, 12-column grid blends flexibility and stability so your readers can view your emails perfectly from wherever they may be.

+

Email anywhere. On any device.

+

How HTML email was meant to be read.

+

Reach out your tentacles to a broad range of people who subscribe to your emails. Our CSS framework helps you craft HTML emails that can be read anywhere on any device. Gone are the days where you had to choose between Outlook and email optimized for smartphones and tablets. Ink's responsive, 12-column grid blends flexibility and stability so your readers can view your emails perfectly from wherever they may be.

@@ -45,7 +45,7 @@
Shiny email templates

We've created some common layouts for you to start from so you can cook your emails faster.

- Go to Templates + Go to Email Templates
@@ -56,26 +56,26 @@

Discover the world of Ink

-

Learn more about how to use Ink, or dive right in and start coding responsively.

+

Learn more about how to use Ink, or dive right in and start coding emails responsively.

Process - Get the 1-2-3 of how to use Ink to create your own HTML email. + Get the 1-2-3 of how to use Ink to create your own responsive HTML email.
Docs - Learn how to use all the powers of Ink to create beautiful, dynamic emails. + Learn how to use all the powers of Ink to create beautiful, dynamic HTML emails.
Download - Get the framework right now and start tinkering with it right away! + Get the responsive email framework right now and start tinkering with it right away!
diff --git a/sass/_footer.scss b/sass/_footer.scss index ceb39c81..46b7ee41 100644 --- a/sass/_footer.scss +++ b/sass/_footer.scss @@ -44,7 +44,7 @@ } } -.zurb-footer-bottom { background: #333; padding: 24px 0 10px; +.zurb-footer-bottom { background: #222; padding: 24px 0 10px; .design-border { border-bottom: 1px solid #484848; padding-bottom: 5px; margin-bottom: 25px; } a.zurb-logo { color: #858585; font-weight: normal; background: url("../images/icons/footer-icons.png") no-repeat 0 3px; padding: 25px 0 0 0; font-size: emCalc(16px); display: inline-block; font-family: 'Proxima Nova', 'proxima-nova', 'Helvetica Neue', 'HelveticaNeue', Helvetica, Arial, 'Lucida Grande', sans-serif; width: 90px; &:hover { opacity: 0.8; } diff --git a/sass/app.scss b/sass/app.scss index a14139b5..86974609 100644 --- a/sass/app.scss +++ b/sass/app.scss @@ -140,7 +140,7 @@ p { font-size: emCalc(14px); } /* callout */ .callout { background: #e5e9ea; margin-bottom: 60px; .row { position: relative; - .stamp { background: url(../images/inky-stamp.svg) no-repeat center center; position: absolute; width: 199px; right:-40px; height: 179px; top:-104px; background-size: cover; } + .stamp { background: url(../images/inky-stamp-2.svg) no-repeat center center; position: absolute; width: 231px; right:-40px; height: 179px; top:-104px; background-size: cover; } } } .space-callout { padding: 53px 0 31px; } @@ -184,7 +184,7 @@ p { font-size: emCalc(14px); } /* interior */ .top-headlines { margin-top: 50px; - h1 { margin-bottom: 0; } + h1 { margin-bottom: 0; line-height: 1; } } hr { border-style: dashed; } @@ -204,8 +204,8 @@ hr { border-style: dashed; } select { width: 110px; margin-left: 10px; } } .how-to-use { position: relative; padding: 30px 0; } -.inky-small { height: 377px; width: 273px; position: absolute; top: 0; right: -310px; z-index: 2;} -.inky-small.load { height: 377px; width: 273px; position: absolute; top: 0; right: -310px; z-index: 2;animation-name: small-inky; -webkit-animation-name: small-inky; animation-duration:9s; -webkit-animation-duration:9s; animation-iteration-count: infinite; -webkit-animation-iteration-count:infinite; } +.inky-small { height: 377px; width: 323px; position: absolute; top: 0; right: -310px; z-index: 2;} +.inky-small.load { animation-name: small-inky; -webkit-animation-name: small-inky; animation-duration:9s; -webkit-animation-duration:9s; animation-iteration-count: infinite; -webkit-animation-iteration-count:infinite; } /* downloading */ .main-text { position: relative; } @@ -403,6 +403,7 @@ ul.mobile-nav { display: block; margin-bottom: 0; } @media only screen and (min-width: 767px) and (max-width: 1024px) { + .callout .row .stamp { top: -134px; right: 0; } .inky { right: -620px; } .touch .how-to-use { position: relative; &.one { @@ -447,7 +448,7 @@ ul.mobile-nav { display: block; margin-bottom: 0; .number { display: block; font-family: $sans-serif; color: #a3abad; font-size: emCalc(138px); font-weight: bold; position: absolute; top: 23px; } .campaign-monitor { background: url(../images/campaign-monitor.png) no-repeat left center; background-size: 18px 12px; padding-left: 30px; } } - .inky-small.load { right: -250px; } + .inky-small.load { right: -250px; width: 283px;} .top-bar-section .has-form { padding: 11px 15px; height: 45px; } .button.tiny { padding: 5px 10px; } .top-area.main { overflow-x: hidden; } diff --git a/sass/topbar.scss b/sass/topbar.scss index 75518fff..6f5f51d6 100644 --- a/sass/topbar.scss +++ b/sass/topbar.scss @@ -31,12 +31,12 @@ li:last-child { padding-bottom: 0px !important; } } .top-bar li.name span a.toggle-nav { padding: 0px !important; } -.top-bar-section li a { background: #333; - &:not(.button) { background: #333; +.top-bar-section li a { background: #222; + &:not(.button) { background: #222; &:hover { background: #111; } } } -.top-bar-section .has-form { background: #333; } +.top-bar-section .has-form { background: #222; } .top-bar-section ul li > a.button { background: #FFF; color: #333 !important; } @@ -53,13 +53,13 @@ .top-bar-js-breakpoint { width: 940px !important; visibility: hidden; } /* Wrapped around .top-bar to contain to grid width */ -.contain-to-grid { width: 100%; background: #333333; } +.contain-to-grid { width: 100%; background: #222; } /* Wrapped around .top-bar to make it fixed at the top */ .fixed { width: 100%; left: 0; position: fixed; top: 0; z-index: 99; } /*