From 9a78b77d4ce79036ab1994bfd320aeec7b113ff0 Mon Sep 17 00:00:00 2001
From: Tunghsiao Liu <t@sparanoid.com>
Date: Wed, 26 Aug 2015 10:11:06 +0800
Subject: [PATCH] fix(style): add `.no-enlarge` to exclude specific images

BREAKING CHANGE: Now you can add `.no-enlarge` to images that you'd like to keep it in normal width in smaller devices:

```html
<img class="no-enlarge" src="/ipad-frame-01.png">
```
---
 _app/assets/themes/curtana/_less/app.less | 17 ++++++++++++++---
 1 file changed, 14 insertions(+), 3 deletions(-)

diff --git a/_app/assets/themes/curtana/_less/app.less b/_app/assets/themes/curtana/_less/app.less
index a7282c2b7..73966f01f 100644
--- a/_app/assets/themes/curtana/_less/app.less
+++ b/_app/assets/themes/curtana/_less/app.less
@@ -338,8 +338,9 @@ body:hover .latest {
       // Override margin from article img
       svg,
       img {
-        // avoid images inside .browser stretched by global img styles
-        margin: 0;
+        // avoid header stretched by global img styles
+        margin-left: 0;
+        margin-right: 0;
         margin-bottom: .3em;
 
         @media (max-width: @breakpoint-sm) {
@@ -400,6 +401,7 @@ body:hover .latest {
     max-width: 100%;
     margin: 0 0 1.8rem;
 
+
     @media (max-width: @breakpoint-md) {
       margin-left: -@padding-md;
       margin-right: -@padding-md;
@@ -413,6 +415,14 @@ body:hover .latest {
       max-width: calc(100% + (@padding-sm * 2));
       width: calc(100% + (@padding-sm * 2));
     }
+
+    // avoid images with `.no-enlarge` stretched by global img styles
+    &.no-enlarge {
+      margin-left: 0;
+      margin-right: 0;
+      max-width: 100%;
+      width: auto;
+    }
   }
 
   blockquote {
@@ -619,7 +629,8 @@ body:hover .latest {
 
   img {
     // avoid images inside .browser stretched by global img styles
-    margin: 0;
+    margin-left: 0;
+    margin-right: 0;
     box-shadow: 0 -1px 0 0 rgba(0, 0, 0, .05);
 
     // Reset borwser image width for small screens