docs upd

dimsemenov · Dec 12, 2014 · 886f9ba · 886f9ba
1 parent f5c57af
commit 886f9ba
Show file tree

Hide file tree

Showing 3 changed files with 83 additions and 12 deletions.
diff --git a/website/_includes/examples.html b/website/_includes/examples.html
@@ -135,7 +135,7 @@ <h3>Single image lightbox</h3>
 
   <div class="example gc3">
     <h3>Lightbox gallery</h3>
-    <p>You may put any HTML content in each gallery item and <a href="http://codepen.io/dimsemenov/pen/vKrqs">mix content types</a>. In this example lazy-loading of images is enabled for the next image based on move direction. If you wish to add touch-swipe support, check <a href="http://coding.smashingmagazine.com/2013/05/02/truly-responsive-lightbox/">my article</a> on the Smashing Magazine.</p>
+    <p>You may put any HTML content in each gallery item and <a href="http://codepen.io/dimsemenov/pen/vKrqs">mix content types</a>. In this example lazy-loading of images is enabled for the next image based on move direction. If you wish to add touch-swipe support, check <a href="http://coding.smashingmagazine.com/2013/05/02/truly-responsive-lightbox/">my article</a> on the Smashing Magazine, or <a href="http://photoswipe.com">new PhotoSwipe</a> script.</p>
     <div class="html-code grid-of-images">
       <div class="popup-gallery">
         <a href="http://farm9.staticflickr.com/8242/8558295633_f34a55c1c6_b.jpg" title="The Cleaner"><img src="http://farm9.staticflickr.com/8242/8558295633_f34a55c1c6_s.jpg" width="75" height="75" /></a>

diff --git a/website/documentation.md b/website/documentation.md
@@ -27,6 +27,9 @@ Here you can find the guide on how to use Magnific Popup. Besides this docs page
 
 Please ask general questions through <a href="http://stackoverflow.com/questions/ask?tags=magnific-popup">StackOverflow</a> tagged with `magnific-popup`.
 
+If you're looking for touch-friendly popup just for images, <a href="http://photoswipe.com">PhotoSwipe</a> might be a better choice.
+
+
 # magnific popup docs
 
 * This will become a table of contents (this text will be scraped).
@@ -1195,3 +1198,16 @@ Improve this documentation page (simply submit commit <a href="https://github.co
 <div>
   <iframe src="http://ghbtns.com/github-btn.html?user=dimsemenov&amp;repo=magnific-popup&amp;type=watch&amp;count=true&amp;size=large" allowtransparency="true" frameborder="0" scrolling="0" width="170" height="30">&nbsp;</iframe>
 </div>
+
+<h2>Keep updated</h2>
+<div id="mc_embed_signup" class="embed-form">
+  <form action="http://dimsemenov.us1.list-manage.com/subscribe/post?u=ef6026d946a7b5d41d92c02e4&amp;id=54fae727da" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate="">
+    <p>Get notified about important update or new release.</p>
+    <div class="mc-field-group">
+      <input type="email" value="" name="EMAIL" placeholder="Your email" class="required email" id="mce-EMAIL">
+      <input type="hidden" id="group_2" name="group[2065][2]" value="true">
+      <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button">
+    </div>
+    <p style="font-size: 12px; margin: 4px 0 0 0;">Newsletter is sent 3 times a year at max. Powered by Mailchimp.</p>
+  </form>
+ </div>
diff --git a/website/site-assets/site.css b/website/site-assets/site.css
@@ -186,45 +186,46 @@ h2.intro {
 }*/
 
 
-#magnific_popup_docs {
-  display: none;
-}
-.maruku_toc {
+#markdown-toc {
   position: fixed;
   left: 0;
   top: 50px;
   padding: 20px 20px;
   background: rgba(255, 255, 255, 0.71);
   -webkit-backface-visibility:hidden;
+  list-style: none;
 }
-.maruku_toc ul {
+#markdown-toc a[href="#magnific-popup-docs"] {
+  display: none;
+}
+#markdown-toc ul {
   list-style: none;
 }
-.maruku_toc ul ul {
+#markdown-toc ul ul {
   display: none;
 }
-.maruku_toc:before {
+#markdown-toc:before {
   content: 'Table of contents';
   font-weight: bold;
   display: block;
   margin-bottom: 10px;
 }
 @media all and (max-width: 75em) {
-  .maruku_toc {
+  #markdown-toc {
     position: static;
     padding: 0;
     background: none;
   } 
 }
-.maruku_toc a {
+#markdown-toc a {
   text-decoration: none;
   border-bottom: 1px dotted;
 }
-.maruku_toc ul {
+#markdown-toc ul {
   margin: 0;
   padding: 0;
 }
-.maruku_toc .active a{
+#markdown-toc .active a{
   text-decoration: none;
   color: #666;
 }
@@ -299,6 +300,60 @@ content: 'CSS';
 }
 
 
+#mc_embed_signup {
+  max-width: 350px;
+  padding: 32px;
+  background: #EEE;
+}
+#mc_embed_signup input[type="email"] {
+  border: 1px solid #CCC;
+  border-top: 1px solid #999;
+  padding: 5px;
+  font-size: 18px;
+  width: 200px;
+  margin-right: 10px;
+  height: 25px;
+  transition: all 0.3s ease;
+  -moz-transition: all 0.3s ease;
+  -webkit-transition: all 0.3s ease;
+  border-radius: 2px;
+  -moz-border-radius: 2px;
+  -webkit-border-radius: 2px;
+}
+#mc_embed_signup input[type="email"]:focus {
+  background-color: #FFF;
+  border: 1px solid #3169B3;
+  box-shadow: #3169B3 0px 0px 5px;
+  -moz-box-shadow: #3169B3 0px 0px 5px;
+  -webkit-box-shadow: #3169B3 0px 0px 5px;
+  outline: none;
+}
+#mc_embed_signup input[type="submit"] {
+  border: 1px solid #3169B3;
+  font-size: 13px;
+  font-weight: bold;
+  color: #FFF;
+  height: auto;
+  padding: 8px 13px;
+  cursor: pointer;
+  background-color: #3169B3;
+  display: inline-block;
+  width: auto;
+  -webkit-appearance: none;
+  border-radius: 2px;
+  -moz-border-radius: 2px;
+  -webkit-border-radius: 2px;
+  vertical-align: top;
+}
+.embed-form {
+  position: relative;
+}
+#mc_embed_signup p {
+  font-size: 15px;
+  color: #4F4F4F;
+}
+
+
 
 #main-wrapper {