1 files changed, 300 insertions, 0 deletions
diff --git a/Recipes/Polenta with Sicilian Tomato Sauce.html b/Recipes/Polenta with Sicilian Tomato Sauce.html
new file mode 100644
index 0000000..6371348
--- /dev/null
+++ b/Recipes/Polenta with Sicilian Tomato Sauce.html
@@ -0,0 +1,300 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="UTF-8">
+        <style type="text/css">
+            /* Shared styles */
+            body {
+                font-family: Helvetica, sans-serif;
+                font-size: 16.0px;
+                color: #34302e;
+                margin: 0.25in;
+            }
+            .name {
+                font-size: 18.0px;
+                font-family: Helvetica, sans-serif;
+                font-weight: normal;
+                margin: 0 0 10px 0;
+            }
+            .categories {
+                color: #605D5D;
+                font-size: 14.0px;
+                font-family: Helvetica, sans-serif;
+                font-style: italic;
+            }
+            .rating {
+                color: #d10505;
+                font-size: 14.0px;
+            }
+            .metadata {
+                font-size: 14.0px;
+            }
+            .infobox p {
+                margin: 0;
+                line-height: 150%;
+            }
+            .subhead {
+                color: #d10505;
+                font-weight: bold;
+                font-size: 14.0px;
+                text-transform: uppercase;
+                margin: 10px 0;
+            }
+            
+            .ingredients p {
+                margin: 4px 0;
+            }
+            /* To prevent nutrition/directions from getting too close
+               to ingredients */
+            .ingredients {
+                padding-bottom: 10px;
+            }
+            .clear {
+                clear:both;
+            }
+            a {
+                color: #4990E2;
+                text-decoration: none;
+            }
+            /* Full page specific styles */
+            .text {
+                line-height: 130%;
+            }
+            .photobox {
+                
+                float: left;
+                margin-right: 14px;
+                
+                
+            }
+            .photo {
+                max-width: 140.0px;
+                max-height: 140.0px;
+                width: auto;
+                height: auto;
+            }
+            
+            .inline-image {
+                max-width: 25%;
+                max-height: 25%;
+                width: auto;
+                height: auto;
+            }
+            .photoswipe {
+                border: 1px #dddddd solid;
+                cursor: pointer;
+            }
+            .pswp__caption__center {
+                text-align: center !important;
+            }
+            .recipe {
+                
+                page-break-after: always;
+                
+                
+            }
+            .recipe:first-child {
+                border-top: 0 none;
+                margin-top: 0;
+                padding-top: 0;
+            }
+        </style>
+    </head>
+    <body>
+        <!-- Recipe -->
+<div class="recipe" itemscope itemtype="http://schema.org/Recipe" >
+    
+    <div class="infobox">
+
+        <!-- Image -->
+        
+        <div class="photobox">
+            
+            <a href="#">
+                <img src="Images/518A4E06-852D-41E7-B2FD-842F8C1DF73B/559DD1E3-D90C-4CB3-AD00-C660BF6405B0.jpg" itemprop="image" class="photo photoswipe"/>
+            </a>
+            
+            
+        </div>
+        
+
+        <!-- Name -->
+        <h1 itemprop="name" class="name">Polenta with Sicilian Tomato Sauce</h1>
+        
+        <!-- Info -->
+        
+        
+        <!-- Rating, categories -->
+        <p itemprop="aggregateRating" class="rating" value="5">★★★★★</p>
+        
+        
+        <p class="metadata">
+        
+            <!-- Cook time, prep time, servings, difficulty -->
+            
+
+            <!-- Source -->
+            
+        </p>
+        
+        
+        
+        <div class="clear"></div>
+        
+
+    </div>
+    
+    <div class="left-column">
+
+        <!-- Ingredients -->
+        
+        <div class="ingredientsbox">
+            <h3 class="subhead">Ingredients</h3>
+            <div class="ingredients text">
+                <p class="line" itemprop="recipeIngredient"><strong>1</strong> litre water</p><p class="line" itemprop="recipeIngredient">salt</p><p class="line" itemprop="recipeIngredient"><strong>175</strong>g polenta</p><p class="line" itemprop="recipeIngredient"><strong>25</strong>g unsalted butter</p><p class="line" itemprop="recipeIngredient">olive oil for frying</p><p class="line" itemprop="recipeIngredient">grated parmesan</p><p class="line" itemprop="recipeIngredient">basil</p><br/><p class="line" itemprop="recipeIngredient"><strong>3</strong> tbsp olive oil</p><p class="line" itemprop="recipeIngredient"><strong>1</strong> small onion, chopped</p><p class="line" itemprop="recipeIngredient"><strong>2</strong> garlic cloves, crushed</p><p class="line" itemprop="recipeIngredient"><strong>1</strong> red chilli, seeded and finely chopped</p><p class="line" itemprop="recipeIngredient"><strong>450</strong>g plum tomatoes, seeded and chopped</p><p class="line" itemprop="recipeIngredient"><strong>2</strong> tbsp capers</p><p class="line" itemprop="recipeIngredient"><strong>2</strong> tbsp pine nuts</p><p class="line" itemprop="recipeIngredient"><strong>115</strong> g kalamata olives</p><br/><br/><p></p>
+            </div>
+        </div>
+        
+        
+        <!-- Nutrition (in two-column mode it goes below the ingredients) -->
+        
+
+    </div>
+    
+    <div class="right-column">
+    
+    <!-- Description -->
+    
+    <div class="descriptionbox">
+        <h3 class="subhead">Description</h3>
+        <div itemprop="description" class="description text">
+            <p>Traditionally polenta is peasant food - hearty and rustic.</p><p>However, it has now become an elegant and fashionable dish, toasted or fried in good olive oil or butter. You can serve it either way in this recipe, soft or fried, with a piquant fresh tomato and chilli sauce. </p><p>To make soft polenta decadently rich and wonderful, stir in some mascarpone, sliced Taleggio or crumbled gorgonzola cheese before serving.</p>
+        </div>
+    </div>
+    
+
+    <!-- Directions -->
+    
+    <div class="directionsbox">
+        <h3 class="subhead">Directions</h3>
+        <div itemprop="recipeInstructions" class="directions text">
+            <p class="line">1. Make the polenta: bring the water and salt to the boil in a large saucepan. Add the polenta gradually in a thin, steady stream, whisking all the time. Reduce the heat as low as it will go and continue stirring the polenta with a wooden spoon until it is thick and smooth and has absorbed all the liquid. This takes about 15-20 minutes.</p><p class="line">2. When the polenta leaves the sides of the pan clean, stir in the butter. You can serve the polenta like this - all fluffed up like mashed potato, adding some grated cheese and black pepper, if wished, or you can pour it into an oiled tin and leave to cool. When cold, cut into squares and fry in olive oil or butter until crisp and golden.</p><p class="line">3. To make the tomato sauce, heat the olive oil and gently sweat the onion and garlic until soft. Add the chilli and cook for 2 minutes. Stir in the tomatoes, capers, pine nuts and olives and simmer gently, uncovered, for 30 minutes, until reduced and thickened. Stir in the torn basil leaves and season.</p><p class="line">4. Serve the sauce with the polenta, sprinkled with some freshly grated Parmesan cheese and garnish with more basil.</p>
+        </div>
+    </div>
+    
+
+    <!-- Notes -->
+    
+
+    <!-- Nutrition (in regular mode it goes below the notes) -->
+    
+        <!-- Used in two different places depending on the recipe layout -->
+
+
+    
+    
+    </div>
+    
+    <div class="clear"></div>
+
+</div>
+
+
+<!-- Photo gallery is only included when exporting. -->
+<!-- PhotoSwipe gallery -->
+
+<link rel="stylesheet" href="Resources/PhotoSwipe/photoswipe.css">
+<link rel="stylesheet" href="Resources/PhotoSwipe/default-skin/default-skin.css">
+<script src="Resources/PhotoSwipe/photoswipe.min.js"></script>
+<script src="Resources/PhotoSwipe/photoswipe-ui-default.min.js"></script>
+
+<div class="pswp" tabindex="-1" role="dialog" aria-hidden="true">
+    <div class="pswp__bg"></div>
+    <div class="pswp__scroll-wrap">
+        <div class="pswp__container">
+            <div class="pswp__item"></div>
+            <div class="pswp__item"></div>
+            <div class="pswp__item"></div>
+        </div>
+        <div class="pswp__ui pswp__ui--hidden">
+            <div class="pswp__top-bar">
+                <div class="pswp__counter"></div>
+                <button class="pswp__button pswp__button--close" title="Close"></button>
+            </div>
+            <button class="pswp__button pswp__button--arrow--left" title="Previous">
+            </button>
+            <button class="pswp__button pswp__button--arrow--right" title="Next">
+            </button>
+            <div class="pswp__caption">
+                <div class="pswp__caption__center"></div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<script type="text/javascript">
+    var openPhotoSwipe = function(event) {
+        var pswp = document.querySelector('.pswp');
+        
+        var element = event.target;
+        var src = element.getAttribute('src');
+        
+        // build items array
+        var items = [
+            
+            {
+                msrc: 'Images/518A4E06-852D-41E7-B2FD-842F8C1DF73B/A4EB2729-8B26-454B-A9B4-E7A1ED41042E.jpg',
+                src: 'Images/518A4E06-852D-41E7-B2FD-842F8C1DF73B/A4EB2729-8B26-454B-A9B4-E7A1ED41042E.jpg',
+                w: 1536.0,
+                h: 2048.0,
+                title: '1'
+            },
+            
+            {
+                msrc: 'Images/518A4E06-852D-41E7-B2FD-842F8C1DF73B/355FC163-D56A-46B2-B38F-9A715972C3B5.jpg',
+                src: 'Images/518A4E06-852D-41E7-B2FD-842F8C1DF73B/355FC163-D56A-46B2-B38F-9A715972C3B5.jpg',
+                w: 1536.0,
+                h: 2048.0,
+                title: '2'
+            },
+            
+        ];
+        
+        var index = 0;
+        for (var i=0; i<items.length; i++) {
+            var item = items[i];
+            if (item.src == src) {
+                index = i;
+            }
+        }
+                         
+        var options = {
+            index: index,
+            history: false,
+            focus: true,
+            captionEl: true,
+            fullscreenEl: false,
+            zoomEl: false,
+            shareEl: false,
+            preloaderEl: false,
+            bgOpacity: 0.9,
+            showHideOpacity: true
+        };
+                             
+        var gallery = new PhotoSwipe(pswp, PhotoSwipeUI_Default, items, options);
+        gallery.init();
+    };
+
+    var elements = document.querySelectorAll('.photoswipe');
+    for (var i=0; i<elements.length; i++) {
+        var element = elements[i];
+        element.addEventListener('click', openPhotoSwipe);
+    }
+</script>
+
+
+
+
+
+    </body>
+</html>