Upload demo and images for a potential blog post.
authorbdakin@apple.com <bdakin@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 4 Sep 2013 20:48:55 +0000 (20:48 +0000)
committerbdakin@apple.com <bdakin@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 4 Sep 2013 20:48:55 +0000 (20:48 +0000)
* blog-files/regions: Added.
* blog-files/regions/pizza-is-amazing.png: Added.
* demos/regions: Added.
* demos/regions/pizza-regions-manifesto-regionstyling.html: Added.
* demos/regions/pizza-regions-manifesto.html: Added.
* demos/regions/yellow-pizza.jpg: Added.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@155063 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Websites/webkit.org/ChangeLog
Websites/webkit.org/blog-files/regions/pizza-is-amazing.png [new file with mode: 0644]
Websites/webkit.org/demos/regions/pizza-regions-manifesto-regionstyling.html [new file with mode: 0755]
Websites/webkit.org/demos/regions/pizza-regions-manifesto.html [new file with mode: 0755]
Websites/webkit.org/demos/regions/yellow-pizza.jpg [new file with mode: 0755]

index 5a085d3..922c487 100644 (file)
@@ -1,3 +1,14 @@
+2013-09-04  Beth Dakin  <bdakin@apple.com>
+
+        Upload demo and images for a potential blog post.
+
+        * blog-files/regions: Added.
+        * blog-files/regions/pizza-is-amazing.png: Added.
+        * demos/regions: Added.
+        * demos/regions/pizza-regions-manifesto-regionstyling.html: Added.
+        * demos/regions/pizza-regions-manifesto.html: Added.
+        * demos/regions/yellow-pizza.jpg: Added.
+
 2013-09-03  Benjamin Poulain  <benjamin@webkit.org>
 
         Fix the recommended testing platform on the website
diff --git a/Websites/webkit.org/blog-files/regions/pizza-is-amazing.png b/Websites/webkit.org/blog-files/regions/pizza-is-amazing.png
new file mode 100644 (file)
index 0000000..f80897f
Binary files /dev/null and b/Websites/webkit.org/blog-files/regions/pizza-is-amazing.png differ
diff --git a/Websites/webkit.org/demos/regions/pizza-regions-manifesto-regionstyling.html b/Websites/webkit.org/demos/regions/pizza-regions-manifesto-regionstyling.html
new file mode 100755 (executable)
index 0000000..b05d920
--- /dev/null
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>My Pizza is Amazing</title>
+  <style>
+    body {
+      font-family: "Lucida Grande", "Lucida Sans Unicode", Thonburi, sans-serif;
+    }
+
+    /* Content flow */
+    .contentFlow {
+      -webkit-flow-into: content-flow;
+    }
+
+    h1 {
+        text-align: center;
+        font-size: 42px;
+        margin: 0.4em auto 0.4em auto;
+    }
+
+    p {
+      font-size: 17px;
+      line-height: 26px;
+    }
+
+    /* Content flow regions */
+    .regionContentFlow {
+      -webkit-flow-from: content-flow;
+    }
+
+    .regionBox {
+      margin: 8px;
+      width: 700px;
+      height: 90px;
+    }
+
+    #region-4 {
+      float: left;
+      width: 340px;
+    }
+
+    #region-5 {
+      float: left;
+      width: 340px;
+    }
+
+    #region-6 {
+      position:absolute;
+      top: 0px;
+      left:724px;
+      width: 360px;
+      height: auto;
+    }
+
+    /* Image flow */
+    .imageFlow {
+      -webkit-flow-into: image-flow;
+    }
+
+    img {
+        display: block;
+        width: 512px;
+        height: 342px;
+        margin: auto;
+    }
+
+    /* Image flow region */
+    .regionImageFlow {
+      -webkit-flow-from: image-flow;
+    }
+
+    #region-2 {
+      height:375px;
+    }
+
+    /* Style the content in regions */
+    @-webkit-region #region-3 {
+      p { color: green; }
+    }
+
+    @-webkit-region #region-4, #region-5 {
+      p { color: coral; }
+    }
+
+    @-webkit-region #region-6 {
+      p { color: crimson; }
+    }
+  </style>
+</head>
+
+<body>
+  <!-- Content that will be flowed into regions.-->
+  <div class="contentFlow">
+    <h1>Pizza is Amazing</h1>
+    <!-- The image will be collected in a different named flow. -->
+    <img class="imageFlow" src="yellow-pizza.jpg" />
+    <p>Is there any food better than pizza? I don't think so. Its simplest form is really my favorite -
+      a perfect thin crust, a barely-altered tomato sauce, fresh mozzarella, and a light sprinkling of basil.
+      But I like all of the less pure interpretations of pizza too. From a mushroom-and-sausage-filled
+      Chicago-style deep dish to a California sourdough crust with fresh corn, feta cheese, and cilantro,
+      to an almost sweet Hawaiian pie <span class="">(don't tell Enrica about that one),</span> I just love it all. Is there anyone who doesn't love pizza? I pity the fool who does not love pizza. So until then, I will continue to believe that pizza the most universally-loved food. (I know what you're thinking. You're thinking, "What about chocolate?" Well, I have met people who don't like chocolate. I know, they cray, but they do exist.)</p>
+    <p>Is there any food better than pizza? I don't think so. Its simplest form is really my favorite -
+      a perfect thin crust, a barely-altered tomato sauce, fresh mozzarella, and a light sprinkling of basil.
+      But I like all of the less pure interpretations of pizza too. From a mushroom-and-sausage-filled
+      Chicago-style deep dish to a California sourdough crust with fresh corn, feta cheese, and cilantro,
+      to an almost sweet Hawaiian pie (don't tell Enrica about that one), I just love it all. Is there anyone
+      who doesn't love pizza? I pity the fool who does not love pizza. Speak now or forever hold your peas. So until
+      someone drops their peas, I will continue to believe that pizza the most universally-loved food.</p>
+  </div>
+  
+  <!-- Layout of the page using regions displaying content from different named flows -->
+  <div id="regionContainer">
+    <div id="region-1" class="regionContentFlow regionBox"></div>
+    <!-- The following region element displays content from the image flow -->
+    <div id="region-2" class="regionImageFlow regionBox"></div>
+    <div id="region-3" class="regionContentFlow regionBox"></div>
+    <div id="region-4" class="regionContentFlow regionBox"></div>
+    <div id="region-5" class="regionContentFlow regionBox"></div>
+    <div id="region-6" class="regionContentFlow regionBox"></div>
+  </div>
+  
+</body>
+</html>
diff --git a/Websites/webkit.org/demos/regions/pizza-regions-manifesto.html b/Websites/webkit.org/demos/regions/pizza-regions-manifesto.html
new file mode 100755 (executable)
index 0000000..ef1e57a
--- /dev/null
@@ -0,0 +1,110 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>My Pizza is Amazing</title>
+  <style>
+    body {
+      font-family: "Lucida Grande", "Lucida Sans Unicode", Thonburi, sans-serif;
+    }
+
+    /* Content flow */
+    .contentFlow {
+      -webkit-flow-into: content-flow;
+    }
+
+    h1 {
+        text-align: center;
+        font-size: 42px;
+        margin: 0.4em auto 0.4em auto;
+    }
+
+    p {
+      font-size: 17px;
+      line-height: 26px;
+    }
+
+    /* Content flow regions */
+    .regionContentFlow {
+      -webkit-flow-from: content-flow;
+    }
+
+    .regionBox {
+      margin: 8px;
+      width: 700px;
+      height: 90px;
+    }
+
+    #region-4 {
+      float: left;
+      width: 340px;
+    }
+
+    #region-5 {
+      float: left;
+      width: 340px;
+    }
+
+    #region-6 {
+      position:absolute;
+      top: 0px;
+      left:724px;
+      width: 360px;
+      height: auto;
+    }
+
+    /* Image flow */
+    .imageFlow {
+      -webkit-flow-into: image-flow;
+    }
+
+    img {
+        display: block;
+        width: 512px;
+        height: 342px;
+        margin: auto;
+    }
+
+    /* Image flow region */
+    .regionImageFlow {
+      -webkit-flow-from: image-flow;
+    }
+
+    #region-2 {
+      height:375px;
+    }
+  </style>
+</head>
+
+<body>
+  <!-- Content that will be flowed into regions.-->
+  <div class="contentFlow">
+    <h1>Pizza is Amazing</h1>
+    <!-- The image will be collected in a different named flow. -->
+    <img class="imageFlow" src="yellow-pizza.jpg" />
+    <p>Is there any food better than pizza? I don't think so. Its simplest form is really my favorite -
+      a perfect thin crust, a barely-altered tomato sauce, fresh mozzarella, and a light sprinkling of basil.
+      But I like all of the less pure interpretations of pizza too. From a mushroom-and-sausage-filled
+      Chicago-style deep dish to a California sourdough crust with fresh corn, feta cheese, and cilantro,
+      to an almost sweet Hawaiian pie <span class="">(don't tell Enrica about that one),</span> I just love it all. Is there anyone who doesn't love pizza? I pity the fool who does not love pizza. So until then, I will continue to believe that pizza the most universally-loved food. (I know what you're thinking. You're thinking, "What about chocolate?" Well, I have met people who don't like chocolate. I know, they cray, but they do exist.)</p>
+    <p>Is there any food better than pizza? I don't think so. Its simplest form is really my favorite -
+      a perfect thin crust, a barely-altered tomato sauce, fresh mozzarella, and a light sprinkling of basil.
+      But I like all of the less pure interpretations of pizza too. From a mushroom-and-sausage-filled
+      Chicago-style deep dish to a California sourdough crust with fresh corn, feta cheese, and cilantro,
+      to an almost sweet Hawaiian pie (don't tell Enrica about that one), I just love it all. Is there anyone
+      who doesn't love pizza? I pity the fool who does not love pizza. Speak now or forever hold your peas. So until
+      someone drops their peas, I will continue to believe that pizza the most universally-loved food.</p>
+  </div>
+  
+  <!-- Layout of the page using regions displaying content from different named flows -->
+  <div id="regionContainer">
+    <div id="region-1" class="regionContentFlow regionBox"></div>
+    <!-- The following region element displays content from the image flow -->
+    <div id="region-2" class="regionImageFlow regionBox"></div>
+    <div id="region-3" class="regionContentFlow regionBox"></div>
+    <div id="region-4" class="regionContentFlow regionBox"></div>
+    <div id="region-5" class="regionContentFlow regionBox"></div>
+    <div id="region-6" class="regionContentFlow regionBox"></div>
+  </div>
+  
+</body>
+</html>
diff --git a/Websites/webkit.org/demos/regions/yellow-pizza.jpg b/Websites/webkit.org/demos/regions/yellow-pizza.jpg
new file mode 100755 (executable)
index 0000000..cdad0ab
Binary files /dev/null and b/Websites/webkit.org/demos/regions/yellow-pizza.jpg differ