You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ignite.apache.org by dm...@apache.org on 2020/03/11 22:11:46 UTC

svn commit: r1875105 [6/7] - in /ignite/site/branches/ignite-redisign: ./ arch/ community/ css/ features/ scss/ use-cases/

Modified: ignite/site/branches/ignite-redisign/screencasts.html
URL: http://svn.apache.org/viewvc/ignite/site/branches/ignite-redisign/screencasts.html?rev=1875105&r1=1875104&r2=1875105&view=diff
==============================================================================
--- ignite/site/branches/ignite-redisign/screencasts.html (original)
+++ ignite/site/branches/ignite-redisign/screencasts.html Wed Mar 11 22:11:46 2020
@@ -42,44 +42,22 @@ under the License.
     <!--#include virtual="/includes/styles.html" -->
 </head>
 <body>
-<div id="wrapper">
     <!--#include virtual="/includes/header.html" -->
-
-    <main id="main" role="main" class="container">
-
-        <section id="screencast" class="page-section">
-            <h1 class="first">Apache Ignite Screencasts</h1>
-            <p>Ignite's memory-centric architecture  provides rich support for SQL queries including distributed joins, full ACID transactions, key-value data store, collocated processing, elastic scalability, and high availability.</p><br/>
-            <p>Take a look at how this works.</p>
-            <div class="col-sm-12 col-md-12 col-xs-12" style="padding-left: 0; padding-right: 20px; top: -30px;">
-                <section id="screencast-1" class="page-section">
-                    <!--<div class="col-sm-4 col-md-4 col-xs-12 screencast-left">-->
-                        <!--<h2>SQL Queries</h2>-->
-                        <!--&lt;!&ndash; Trigger Modal &ndash;&gt;-->
-                        <!--<a href="#sql-modal" data-toggle="modal"><img src="/images/sql-queries-video.png" width="300" height="155"></a>-->
-                        <!--<span class="screencast-duration">03:27</span>-->
-
-                        <!--&lt;!&ndash; Modal HTML &ndash;&gt;-->
-                        <!--<div id="sql-modal" class="modal fade">-->
-                            <!--<div class="modal-dialog">-->
-                                <!--<div class="modal-content video-modal-content" >-->
-                                    <!--<div class="modal-header">-->
-                                        <!--<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>-->
-                                        <!--<h4 class="modal-title">Apache Ignite Distributed SQL Queries</h4>-->
-                                    <!--</div>-->
-                                    <!--<div class="modal-body">-->
-                                        <!--<iframe id="sql" width="668" height="400" src="https://www.youtube.com/embed/eZUujozYt-g" frameborder="0" allowfullscreen></iframe>-->
-                                    <!--</div>-->
-                                <!--</div>-->
-                            <!--</div>-->
-                        <!--</div>-->
-                    <!--</div>-->
-                    <div class="col-sm-4 col-md-4 col-xs-12 screencast-left">
-                        <div class="relative">
-                            <!-- Trigger Modal -->
-                            <a href="#sql-db-modal" data-toggle="modal"><img src="/images/video-screen-2.jpg" alt="Video Screenshot" width="300" height="180">
-                                <p class="video-image-text">DISTRIBUTED SQL <br/>DATABASE </p></a>
-                        </div>
+<article>
+    <div class="container">
+        
+        <h1 >Apache Ignite <strong>Screencasts</strong></h1>
+
+        <p>Ignite's memory-centric architecture  provides rich support for SQL queries including distributed joins, full ACID transactions, key-value data store, collocated processing, elastic scalability, and high availability.</p><br/>
+        <p>Take a look at how this works.</p>
+
+        
+            <div class="row">
+                    <div class="col-sm-4 ">
+                        
+                        <!-- Trigger Modal -->
+                        <a href="#sql-db-modal" data-toggle="modal"><img src="/images/video-screen-2.jpg" alt="Video Screenshot" width="300" height="180">
+                        <p class="video-image-text">DISTRIBUTED SQL <br/>DATABASE </p></a>
                         <span class="screencast-duration">02:59</span>
 
                         <!-- Modal HTML -->
@@ -98,12 +76,11 @@ under the License.
                         </div>
                     </div>
 
-                    <div class="col-sm-4 col-md-4 col-xs-12 screencast-center">
-                        <div class="relative">
-                            <!-- Trigger Modal -->
-                            <a href="#data-grid-modal" data-toggle="modal"><img src="/images/video-screen-2.jpg" alt="Video Screenshot" width="300" height="180">
-                                <p class="video-image-text">KEY-VALUE OPERATIONS<br/>AND ACID TRANSACTIONS </p></a>
-                        </div>
+                    <div class="col-sm-4 ">
+                        
+                        <!-- Trigger Modal -->
+                        <a href="#data-grid-modal" data-toggle="modal"><img src="/images/video-screen-2.jpg" alt="Video Screenshot" width="300" height="180">
+                        <p class="video-image-text">KEY-VALUE OPERATIONS<br/>AND ACID TRANSACTIONS </p></a>
                         <span class="screencast-duration">03:49</span>
 
                         <!-- Modal HTML -->
@@ -122,13 +99,13 @@ under the License.
                         </div>
                     </div>
 
-                    <div class="col-sm-4 col-md-4 col-xs-12 screencast-right">
-                        <div class="relative">
-                            <!-- Trigger Modal -->
-                            <a href="#clustering-modal" data-toggle="modal"><img src="/images/video-screen-2.jpg" alt="Video Screenshot" width="300" height="180">
-                                <p class="video-image-text">GETTING STARTED<br/> WITH COMPUTE GRID</p></a>
-                        </div>
+                    <div class="col-sm-4 ">
+                        
+                        <!-- Trigger Modal -->
+                        <a href="#clustering-modal" data-toggle="modal"><img src="/images/video-screen-2.jpg" alt="Video Screenshot" width="300" height="180">
+                        <p class="video-image-text">GETTING STARTED<br/> WITH COMPUTE GRID</p></a>
                         <span class="screencast-duration">03:50</span>
+
                         <!-- Modal HTML -->
                         <div id="clustering-modal" class="modal fade">
                             <div class="modal-dialog">
@@ -144,18 +121,22 @@ under the License.
                             </div>
                         </div>
                     </div>
-                    <p>&nbsp;</p>
-                </section>
-                <section id="screencast-2" class="page-section">
-                    <h2>Ignite Web Console - Automatic RDBMS Integration</h2>
-                    <p class="video-description">This tutorial is divided in to 3 parts- Part 1 shows how to automatically import schema metadata from an RDBMS;
+                    
+                </div>
+
+
+
+                <h2>Ignite Web Console - Automatic RDBMS Integration</h2>
+                <p >This tutorial is divided in to 3 parts- Part 1 shows how to automatically import schema metadata from an RDBMS;
                         Part 2 shows how to start an Ignite cluster and load data from the database; Part 3 shows how to use Ignite web console to run sql queries on distributed data stored across the cluster. </p>
-                    <div class="col-sm-4 col-md-4 col-xs-12 screencast-left">
-                        <div class="relative">
-                            <!-- Trigger Modal -->
-                            <a href="#database-import-modal" data-toggle="modal"><img src="/images/video-screen-2.jpg" alt="Video Screenshot" width="300" height="180">
-                                <p class="video-image-text">Part 1 <br/>Database Model Import</p></a>
-                        </div>
+
+                <div class="row">
+                    <div class="col-sm-4">
+                        
+                        <!-- Trigger Modal -->
+                        <a href="#database-import-modal" data-toggle="modal"><img src="/images/video-screen-2.jpg" alt="Video Screenshot" width="300" height="180">
+                            <p class="video-image-text">Part 1 <br/>Database Model Import</p></a>
+                        
                         <span class="screencast-duration">03:50</span>
                         <!-- Modal HTML -->
                         <div id="database-import-modal" class="modal fade">
@@ -172,13 +153,14 @@ under the License.
                             </div>
                         </div>
                     </div>
-                    <div class="col-sm-4 col-md-4 col-xs-12 screencast-center">
-                        <div class="relative">
-                            <!-- Trigger Modal -->
-                            <a href="#data-loading-modal" data-toggle="modal"><img src="/images/video-screen-2.jpg" alt="Video Screenshot" width="300" height="180">
-                                <p class="video-image-text">Part 2 <br/>Data Loading</p></a>
-                        </div>
+
+                    <div class="col-sm-4">
+                        
+                        <!-- Trigger Modal -->
+                        <a href="#data-loading-modal" data-toggle="modal"><img src="/images/video-screen-2.jpg" alt="Video Screenshot" width="300" height="180">
+                            <p class="video-image-text">Part 2 <br/>Data Loading</p></a>
                         <span class="screencast-duration">03:25</span>
+
                         <!-- Modal HTML -->
                         <div id="data-loading-modal" class="modal fade">
                             <div class="modal-dialog">
@@ -194,13 +176,14 @@ under the License.
                             </div>
                         </div>
                     </div>
-                    <div class="col-sm-4 col-md-4 col-xs-12 screencast-right">
-                        <div class="relative">
-                            <!-- Trigger Modal -->
-                            <a href="#webconsole-sql-modal" data-toggle="modal"><img src="/images/video-screen-2.jpg" alt="Video Screenshot" width="300" height="180">
-                                <p class="video-image-text">Part 3 <br/>Running SQL Queries</p></a>
-                        </div>
+
+                    <div class="col-sm-4">
+                        <!-- Trigger Modal -->
+                        <a href="#webconsole-sql-modal" data-toggle="modal"><img src="/images/video-screen-2.jpg" alt="Video Screenshot" width="300" height="180">
+                            <p class="video-image-text">Part 3 <br/>Running SQL Queries</p></a>
+                        
                         <span class="screencast-duration">03:27</span>
+                        
                         <!-- Modal HTML -->
                         <div id="webconsole-sql-modal" class="modal fade">
                             <div class="modal-dialog">
@@ -218,15 +201,14 @@ under the License.
                     </div>
 
 
-                    <p>&nbsp;</p>
-                </section>
+                    
+                </div>
 
             </div>
-        </section>
-    </main>
 
+</article>
     <!--#include virtual="/includes/footer.html" -->
-</div>
+
 <!--#include virtual="/includes/scripts.html" -->
 <!--
 <script type="text/javascript" src="js/jquery.main.js"></script>

Modified: ignite/site/branches/ignite-redisign/scss/ignite-redesign.scss
URL: http://svn.apache.org/viewvc/ignite/site/branches/ignite-redisign/scss/ignite-redesign.scss?rev=1875105&r1=1875104&r2=1875105&view=diff
==============================================================================
Binary files - no diff available.

Modified: ignite/site/branches/ignite-redisign/use-cases/datagrid.html
URL: http://svn.apache.org/viewvc/ignite/site/branches/ignite-redisign/use-cases/datagrid.html?rev=1875105&r1=1875104&r2=1875105&view=diff
==============================================================================
--- ignite/site/branches/ignite-redisign/use-cases/datagrid.html (original)
+++ ignite/site/branches/ignite-redisign/use-cases/datagrid.html Wed Mar 11 22:11:46 2020
@@ -48,14 +48,12 @@ under the License.
     <!--#include virtual="/includes/sh.html" -->
 </head>
 <body>
-<div id="wrapper">
-    <!--#include virtual="/includes/header.html" -->
-
-    <main id="main" role="main" class="container">
-        <section id="datagrid" class="page-section">
-            <h1 class="first">In-Memory Data Grid With SQL, ACID Transactions and Compute APIs</h1>
-            <div class="col-sm-12 col-md-12 col-xs-12" style="padding:0 0 20px 0;">
-                <p>
+<!--#include virtual="/includes/header.html" -->
+<article>
+<div class="container">
+				<h1>In-Memory Data Grid <strong>With SQL, <br />ACID Transactions and Compute APIs</strong></h1>
+			
+				<p>
                     Apache Ignite provides an extensive set of user-friendly APIs to serve as an in-memory data grid
                     that integrates into your existing architecture seamlessly and accelerates databases, services, and
                     custom APIs.
@@ -66,6 +64,7 @@ under the License.
                     While the application layer writes to and reads from Ignite, the latter ensures that any underlying
                     database stays updated and consistent with in-memory data.
                 </p>
+                <img class="img-fluid diagram-right" src="/images/IMDG.png" />
                 <p>
                     As an in-memory data grid, Ignite provides all essential APIs needed to simplify its adoption.
                     The APIs include distributed key-value and ANSI SQL queries, ACID transactions, co-located
@@ -73,14 +72,15 @@ under the License.
                     group distributed data sets, the compute and machine learning components help to eliminate data
                     shuffling over the network, thus, boosting compute and data-intensive calculations.
                 </p>
+                
                 <p>
                     Ignite is capable of storing data both in memory and on disk with two options for data persistence
                     -- you can persist changes in an external database or let Ignite keep data in its native persistence.
                     Let's review both of these options.
                 </p>
-
-                <div class="col-sm-8 col-md-8 col-xs-12" style="padding-left:0; padding-right:0">
-                    <div class="page-heading">Ignite and External Databases</div>
+      
+                <h2>Ignite and External Databases</h2>
+                
                     <p>
                         Ignite can improve the performance and scalability of any external database such as RDBMS,
                         NoSQL or Hadoop, by sliding in as an in-memory cache between the application and the database
@@ -101,74 +101,66 @@ under the License.
                         all the data has been preloaded to the in-memory cluster. Note that Ignite SQL or scan queries
                         can read data from disk only if it is stored in Ignite native persistence.
                     </p>
-                </div>
-
-                <div class="col-sm-4 col-md-4 col-xs-12" style="padding-right:0">
-                    <img class="img-responsive" src="/images/IMDG.png" width="300px" style="float:right;"/>
-                </div>
+  
+                    
+                
+                  <p>&nbsp;</p>  
+             <h2  >Ignite Native Persistence</h2>
+             <img class="img-fluid diagram-right" src="/images/native_persistence_key_value.png"/>
+            <p>Ignite native persistence is a distributed ACID and SQL-compliant disk store that transparently integrates with Ignite in-memory layer. When the native persistence is enabled, Ignite stores both data and indexes on disk and eliminates the time-consuming cache warm-up step. Since the native persistence always keeps a full copy of data on disk, you are free to cache a subset of records in memory. If a required data record is missing in memory, then Ignite reads it from the disk automatically regardless of the API you use -- be it SQL, key-value, or scan queries.</p>
+      
+            
+                    
+            
+                    
+      <div class="jumbotron jumbotron-fluid">
+        <div class="container">
+          <div class="display-6 title">Learn More</div>
+          <hr class="my-4">
+          <div class="row">
+            <div class="col-6 col-xs-12">
+              <ul>
+                <li>
+                  <a href="/features/sql.html">
+                    	Distributed SQL <i class="fa fa-angle-double-right"></i>
+                	</a>
+                </li>
+                <li>
+                  <a href="/features/collocatedprocessing.html">
+                    	Co-located Processing <i class="fa fa-angle-double-right"></i>
+                	</a>
+                </li>
+				  <li><a href="/features/transactions.html">
+                    ACID Transactions <i class="fa fa-angle-double-right"></i>
+                </a></li>
+				  <li><a href="/features/machinelearning.html">
+                    Machine and Deep Learning <i class="fa fa-angle-double-right"></i>
+                </a></li>
+              </ul>
             </div>
-
-            <div class="col-sm-12 col-md-12 col-xs-12" style="padding:0 0 20px 0;">
-                <div class="col-sm-8 col-md-8 col-xs-12" style="padding-left:0; padding-right:0">
-                    <div class="page-heading">Ignite Native Persistence</div>
-                    <p>
-                        Ignite native persistence is a distributed ACID and SQL-compliant disk store that transparently
-                        integrates with Ignite in-memory layer. When the native persistence is enabled, Ignite stores both
-                        data and indexes on disk and eliminates the time-consuming cache warm-up step. Since the
-                        native persistence always keeps a full copy of data on disk, you are free to cache a subset of
-                        records in memory. If a required data record is missing in memory, then Ignite reads it from the
-                        disk automatically regardless of the API you use -- be it SQL, key-value, or scan queries.
-                    </p>
-                </div>
-
-                <div class="col-sm-4 col-md-4 col-xs-12" style="padding-right:0">
-                    <img class="img-responsive" src="/images/native_persistence_key_value.png" width="300px"
-                         style="float:right;"/>
-                </div>
+            <div class="col-6 col-xs-12">
+              <ul>
+                <li>
+                  <a href="/arch/persistence.html">
+                    Native Persistence <i class="fa fa-angle-double-right"></i>
+                </a>
+                </li>
+				  <li><a href="/use-cases/in-memory-database.html">
+                    Ignite as an In-Memory Database <i class="fa fa-angle-double-right"></i>
+                </a></li>
+				  <li><a href="/use-cases/dih.html">
+                    Ignite as a Digital Integration Hub <i class="fa fa-angle-double-right"></i>
+                </a></li>
+              </ul>
             </div>
-
-            <div class="page-heading">Learn More</div>
-            <p>
-                <a href="/features/sql.html">
-                    <b>Distributed SQL <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/collocatedprocessing.html">
-                    <b>Co-located Processing <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/transactions.html">
-                    <b>ACID Transactions <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/machinelearning.html">
-                    <b>Machine and Deep Learning <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/arch/persistence.html">
-                    <b>Native Persistence <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/use-cases/in-memory-database.html">
-                    <b>Ignite as an In-Memory Database <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="TODO">
-                    <b>Ignite as a Digital Integration Hub <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-
-        </section>
-    </main>
-
+          </div>
+        </div>
+      </div>
+    
+      
+</div>			
+</article>
     <!--#include virtual="/includes/footer.html" -->
-</div>
 <!--#include virtual="/includes/scripts.html" -->
 </body>
 </html>

Modified: ignite/site/branches/ignite-redisign/use-cases/dih.html
URL: http://svn.apache.org/viewvc/ignite/site/branches/ignite-redisign/use-cases/dih.html?rev=1875105&r1=1875104&r2=1875105&view=diff
==============================================================================
--- ignite/site/branches/ignite-redisign/use-cases/dih.html (original)
+++ ignite/site/branches/ignite-redisign/use-cases/dih.html Wed Mar 11 22:11:46 2020
@@ -48,14 +48,11 @@ under the License.
     <!--#include virtual="/includes/sh.html" -->
 </head>
 <body>
-<div id="wrapper">
     <!--#include virtual="/includes/header.html" -->
-
-    <main id="main" role="main" class="container">
-        <section id="shared-memory-layer" class="page-section">
-            <h1 class="first">Building Digital Integration Hub With Apache Ignite</h1>
-            <div class="col-sm-12 col-md-12 col-xs-12" style="padding:0 0 10px 0;">
-                <div class="col-sm-6 col-md-6 col-xs-12" style="padding-left:0; padding-right:0">
+  <article>
+    <div class="container">
+					 <h1>Building Digital Integration Hub <stron>With Apache Ignite</stron></h1>
+            <img class="diagram-right img-fluid" src="/images/digital-hub.png"/>
                     <p>
                         A digital integration hub (DIH) is an advanced platform architecture that aggregates multiple
                         back-end systems and databases into a low-latency and shared data store. Apache Ignite can
@@ -68,24 +65,17 @@ under the License.
                         growth by requesting data from only this distributed store, which keeps all the records in
                         memory and offloads the back-end systems.
                     </p>
-                </div>
-
-                <div class="col-sm-6 col-md-6 col-xs-12" style="padding-right:0">
-                    <img class="img-responsive" src="/images/digital-hub.png" width="440px"
-                         style="float:right;"/>
-                </div>
-            </div>
-
-            <p>
-                The primary purpose of Ignite as a DIH component is:
-            </p>
-            <ul class="page-list">
+                
+					<p>
+              The primary purpose of Ignite as a DIH component is:
+          </p>
+            <ul>
                 <li>to enable implementations of large-scale and high-throughput architectures that prevent the back-end
                     systems from getting overwhelmed with excessive workloads</li>
                 <li>to avoid complex integrations between the back-end databases and the front-end API services</li>
             </ul>
-
-            <div class="page-heading">Synchronization of Apache Ignite and Back-End Systems</div>
+				
+            <h2>Synchronization of Apache Ignite and Back-End Systems</h2>
             <p>
                 Ignite, as the high-performance data store, needs to be synchronized with the back-end databases via
                 streaming, event-based, change data capture (CDC), or other techniques.
@@ -102,53 +92,69 @@ under the License.
             <p>
                 For bi-directional synchronization, you can consider various streaming, CDC, and event-based technologies.
                 For instance, Kafka, Spark, and Debezium are widely used to keep Ignite in sync with other databases.
-            </p>
-
-            <div class="page-heading">Real-Time Analytics</div>
-
-            <p>
-                Although real-time analytics is not a defining characteristic of digital integration hub architectures,
-                in some situations, you can end up consolidating operational and analytical data silos in Apache Ignite.
-                If this happens, you can tap into Ignite SQL, compute, and machine learning capabilities for real-time
-                analytics needs.
-            </p>
-
-            <div class="page-heading">Learn More</div>
-            <p>
-                <a href="https://apacheignite-mix.readme.io/docs/overview" target="docs">
-                    <b>Ignite and Streaming Technologies <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="https://apacheignite-fs.readme.io/docs/overview" target="docs">
-                    <b>Ignite and Spark Integration <i class="fa fa-angle-double-right"></i></b>
+            </p>					
+        
+            <h2>Real-Time Analytics</h2>
+            		<p>
+                		Although real-time analytics is not a defining characteristic of digital integration hub architectures, in some situations, you can end up consolidating operational and analytical data silos in Apache Ignite. If this happens, you can tap into Ignite SQL, compute, and machine learning capabilities for real-time analytics needs.
+            		</p>
+        
+                
+      <div class="jumbotron jumbotron-fluid">
+        <div class="container">
+          <div class="title display-6">Learn More</div>
+          <hr class="my-4">
+          <div class="row">
+            <div class="col-6 col-xs-12">
+              <ul>
+                <li>
+                  <a href="https://apacheignite-mix.readme.io/docs/overview" target="docs">
+                    Ignite and Streaming Technologies <i class="fa fa-angle-double-right"></i>
+                </a>
+                </li>
+                <li>
+                  <a href="https://apacheignite-fs.readme.io/docs/overview" target="docs">
+                    Ignite and Spark Integration <i class="fa fa-angle-double-right"></i>
+                </a>
+                </li>
+				  <li>
+				   <a href="/features/sql.html">
+                    Distributed SQL <i class="fa fa-angle-double-right"></i>
                 </a>
-            </p>
-            <p>
-                <a href="/features/sql.html">
-                    <b>Distributed SQL <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="http://localhost/features/collocatedprocessing.html">
-                    <b>Co-located Processing <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/machinelearning.html">
-                    <b>Machine and Deep Learning <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/arch/multi-tier-storage.html">
-                    <b>Multi-Tier Storage <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-        </section>
-    </main>
-
-    <!--#include virtual="/includes/footer.html" -->
-</div>
+				  </li>
+              </ul>
+            </div>
+            <div class="col-6 col-xs-12">
+              <ul>
+                <li>
+                  <a href="http://localhost/features/collocatedprocessing.html">
+                    Co-located Processing <i class="fa fa-angle-double-right"></i>
+                </a>
+                </li>
+                <li>
+                  
+					<a href="/features/machinelearning.html">
+                    Machine and Deep Learning <i class="fa fa-angle-double-right"></i>
+                </a>
+					
+                </li>
+				  <li>
+				  	
+					  <a href="/arch/multi-tier-storage.html">
+                    Multi-Tier Storage <i class="fa fa-angle-double-right"></i>
+                </a>
+					  
+				  </li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    
+      
+  </div>
+</article>  
+<!--#include virtual="/includes/footer.html" -->
 <!--#include virtual="/includes/scripts.html" -->
 </body>
 </html>

Modified: ignite/site/branches/ignite-redisign/use-cases/hadoop-acceleration.html
URL: http://svn.apache.org/viewvc/ignite/site/branches/ignite-redisign/use-cases/hadoop-acceleration.html?rev=1875105&r1=1875104&r2=1875105&view=diff
==============================================================================
--- ignite/site/branches/ignite-redisign/use-cases/hadoop-acceleration.html (original)
+++ ignite/site/branches/ignite-redisign/use-cases/hadoop-acceleration.html Wed Mar 11 22:11:46 2020
@@ -49,35 +49,27 @@ under the License.
     <!--#include virtual="/includes/sh.html" -->
 </head>
 <body>
-<div id="wrapper">
-    <!--#include virtual="/includes/header.html" -->
-
-    <main id="main" role="main" class="container">
-        <section id="shared-memory-layer" class="page-section">
-            <h1 class="first">Apache Hadoop Performance Acceleration With Apache Ignite</h1>
-            <div class="col-sm-12 col-md-12 col-xs-12" style="padding:0 0 10px 0;">
-                <div class="col-sm-6 col-md-6 col-xs-12" style="padding-left:0; padding-right:0">
-                    <p>
-                        Apache Ignite enables real-time analytics across operational and historical silos for
-                        existing Apache Hadoop deployments by serving as an in-memory computing platform designated for
-                        low-latency and high-throughput operations while Hadoop continues to be used for long-running
-                        OLAP workloads.
-                    </p>
-
-                    <p>
-                        As the architecture diagram on the right suggests, you can achieve the performance acceleration
-                        of Hadoop-based systems by deploying Ignite as a separate distributed storage that keeps data
-                        sets needed for your low-latency operations or real-time reports.
-                    </p>
-
-                </div>
-
-                <div class="col-sm-6 col-md-6 col-xs-12" style="padding-right:0">
-                    <img class="img-responsive" src="/images/hadoop-acceleration.png" width="440px"
-                         style="float:right;"/>
-                </div>
-            </div>
+<!--#include virtual="/includes/header.html" -->	
+<article>
+    <div class="container">
+      
+      <h1>Apache Hadoop Performance <br />Acceleration <strong>With Apache Ignite</strong></h1>					
+        
+      <img class="diagram-right img-fluid" src="/images/hadoop-acceleration.png"/>
+      <p>
+          Apache Ignite enables real-time analytics across operational and historical silos for
+          existing Apache Hadoop deployments by serving as an in-memory computing platform designated for
+          low-latency and high-throughput operations while Hadoop continues to be used for long-running
+          OLAP workloads.
+      </p>
+      
+      <p>
+          As the architecture diagram on the right suggests, you can achieve the performance acceleration
+          of Hadoop-based systems by deploying Ignite as a separate distributed storage that keeps data
+          sets needed for your low-latency operations or real-time reports.
+      </p>
 
+      
             <p>
                 First, depending on the data volume and available memory capacity, you can enable Ignite native persistence to
                 store historical data sets on disk while dedicating a memory space for operational records. You can
@@ -96,13 +88,14 @@ under the License.
                 cross-database across Ignite and Hadoop clusters. Ignite is integrated with Spark, which natively
                 supports Hive/Hadoop. Cross-database queries should be considered only for a limited number of
                 scenarios when neither Ignite nor Hadoop contains the entire data set.
-            </p>
-
-            <div class="page-heading">How to split data and operations between Ignite and Hadoop?</div>
+            </p>					
+      
+            
+					<h2>How to split data and operations between Ignite and Hadoop?</h2>
             <p>
                 Consider using this approach:
             </p>
-            <ul class="page-list">
+            <ul >
                 <li>
                     Use Apache Ignite for tasks that require low-latency response time (microseconds,
                     milliseconds, seconds), high throughput operations (thousands and millions of
@@ -113,12 +106,13 @@ under the License.
                     batch processing.
                 </li>
             </ul>
-
-            <div class="page-heading">Getting Started Checklist</div>
+        
+            
+            <h2>Getting Started Checklist</h2>
             <p>
                 Follow the steps below to implement the discussed architecture in practice:
             </p>
-            <ul class="page-list">
+            <ul >
                 <li>
                     Download and install Apache Ignite in your system.
                 </li>
@@ -136,53 +130,64 @@ under the License.
                     for federated queries.
                 </li>
             </ul>
-
-            <div class="page-heading">Learn More</div>
-            <p>
-                <a href="/arch/multi-tier-storage.html">
-                    <b>Multi-Tier Storage <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/arch/persistence.html">
-                    <b>Native Persistence <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/collocatedprocessing.html">
-                    <b>Co-located Processing <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/sql.html">
-                    <b>Distributed SQL <i class="fa fa-angle-double-right"></i></b>
+        
+            
+		
+		
+
+      <div class="jumbotron jumbotron-fluid">
+        <div class="container">
+          <div class="title display-6">Learn More</div>
+          <hr class="my-4">
+          <div class="row">
+            <div class="col-6 col-xs-12">
+              <ul>
+                <li>
+                   <a href="/features/sql.html">
+                    Distributed SQL <i class="fa fa-angle-double-right"></i>
                 </a>
-            </p>
-            <p>
-                <a href="/features/machinelearning.html">
-                    <b>Machine and Deep Learning <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="https://apacheignite-fs.readme.io/docs/installation-deployment" target="docs">
-                    <b>Ignite and Spark Installation and Deployment <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="https://apacheignite-fs.readme.io/docs/ignite-data-frame" target="docs">
-                    <b>Ignite DataFrames in Details <i class="fa fa-angle-double-right"></i></b>
+                </li>
+                <li>
+                  <a href="/features/collocatedprocessing.html">
+                    Co-located Processing <i class="fa fa-angle-double-right"></i>
+                </a>
+                </li>
+				  <li><a href="/features/transactions.html">
+                    ACID Transactions <i class="fa fa-angle-double-right"></i>
+                </a></li>
+				  <li><a href="/arch/persistence.html">
+                    Native Persistence <i class="fa fa-angle-double-right"></i>
+                </a></li>
+              </ul>
+            </div>
+            <div class="col-6 col-xs-12">
+              <ul>
+                <li>
+                  <a href="/features/machinelearning.html">
+                    Machine and Deep Learning <i class="fa fa-angle-double-right"></i>
                 </a>
-            </p>
-            <p>
-                <a href="/use-cases/dih.html">
-                    <b>Ignite as a Digital Integration Hub <i class="fa fa-angle-double-right"></i></b>
+                </li>
+                <li>
+                  <a href="/features/datagrid.html">
+                    Ignite as an In-Memory Data Grid <i class="fa fa-angle-double-right"></i>
                 </a>
-            </p>
-        </section>
-    </main>
+                </li>
+				  <li><a href="/use-cases/in-memory-database.html">
+                    Ignite as an In-Memory Database <i class="fa fa-angle-double-right"></i>
+                </a></li>
+				  <li><a href="/use-cases/dih.html">
+                    Ignite as a Digital Integration Hub <i class="fa fa-angle-double-right"></i>
+                </a></li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    
+  </div>		
+</article>
 
-    <!--#include virtual="/includes/footer.html" -->
-</div>
+<!--#include virtual="/includes/footer.html" -->
 <!--#include virtual="/includes/scripts.html" -->
 </body>
 </html>

Modified: ignite/site/branches/ignite-redisign/use-cases/hpc.html
URL: http://svn.apache.org/viewvc/ignite/site/branches/ignite-redisign/use-cases/hpc.html?rev=1875105&r1=1875104&r2=1875105&view=diff
==============================================================================
--- ignite/site/branches/ignite-redisign/use-cases/hpc.html (original)
+++ ignite/site/branches/ignite-redisign/use-cases/hpc.html Wed Mar 11 22:11:46 2020
@@ -48,39 +48,31 @@ under the License.
     <!--#include virtual="/includes/sh.html" -->
 </head>
 <body>
-<div id="wrapper">
     <!--#include virtual="/includes/header.html" -->
-
-    <main id="main" role="main" class="container">
-        <section id="shared-memory-layer" class="page-section">
-            <h1 class="first">High-Performance Computing With Apache Ignite</h1>
-            <div class="col-sm-12 col-md-12 col-xs-12" style="padding:0 0 10px 0;">
-                <div class="col-sm-6 col-md-6 col-xs-12" style="padding-left:0; padding-right:0">
-                    <p>
-                        High-performance computing (HPC) is the ability to process data and perform complex
-                        calculations at high speeds. Apache Ignite enables HPC by providing APIs for compute- and
-                        data-intensive calculations. The APIs implement the MapReduce paradigm and let you run
-                        arbitrary tasks across the cluster of Ignite nodes.
-                    </p>
-                    <p>
-                        Having Ignite as a high-performance compute cluster, you can turn a group of commodity
-                        machines or a cloud environment into a distributed supercomputer of interconnected Ignite
-                        nodes.
-                    </p>
-                    <p>
-                        Ignite enables speed and scale for HPC scenarios by processing records in memory and reducing
-                        data shuffling and network utilization.
-                    </p>
-                </div>
-
-                <div class="col-sm-6 col-md-6 col-xs-12" style="padding-right:0">
-                    <img class="img-responsive" src="/images/collocated_processing.png" width="440px"
-                         style="float:right;"/>
-                </div>
-
-            </div>
-
-            <div class="page-heading">Co-located Processing</div>
+    <article>
+    <div class="container">
+					<h1>High-Performance Computing <strong>With Apache Ignite</strong></h1>
+			
+          <p>
+              High-performance computing (HPC) is the ability to process data and perform complex
+              calculations at high speeds. Apache Ignite enables HPC by providing APIs for compute- and
+              data-intensive calculations. The APIs implement the MapReduce paradigm and let you run
+              arbitrary tasks across the cluster of Ignite nodes.
+          </p>
+          <img class="diagram-right img-fluid" src="/images/collocated_processing.png"/>
+          <p>
+              Having Ignite as a high-performance compute cluster, you can turn a group of commodity
+              machines or a cloud environment into a distributed supercomputer of interconnected Ignite
+              nodes.
+          </p>
+          <p>
+              Ignite enables speed and scale for HPC scenarios by processing records in memory and reducing
+              data shuffling and network utilization.
+          </p>
+          
+                    
+                
+            <h2>Co-located Processing</h2>
             <p>
                 Ignite uses the notion of co-located processing to guide HPC workloads implementations in distributed
                 in-memory environments. Co-located processing increases the performance of your complex calculations by
@@ -102,42 +94,57 @@ under the License.
                 over the network. This method of executing a task on the node where the data resides provides
                 exceptionally high performance.The effect is even more significant when the system needs to process
                 millions of transactions per second, verifying billions of previously completed payments.
-            </p>
-
-            <div class="page-heading">Compute APIs</div>
+            </p>					
+				
+            <h2>Compute APIs</h2>
 
             <p>
                 Ignite provides compute APIs (also known as compute grid) for creating and scheduling custom
                 tasks of arbitrary complexity. The APIs implement MapReduce paradigm and are presently available for Java,
                 C#, and C++.
             </p>
-
-            <div class="page-heading">Learn More</div>
-            <p>
-                <a href="http://localhost/features/collocatedprocessing.html">
-                    <b>Co-located processing <i class="fa fa-angle-double-right"></i></b>
+				
+      <div class="jumbotron jumbotron-fluid">
+        <div class="container">
+          <div class="title display-6">Learn More</div>
+          <hr class="my-4">
+          <div class="row">
+            <div class="col-6 col-xs-12">
+              <ul>
+                <li>
+                   <a href="http://localhost/features/collocatedprocessing.html">
+                    Co-located processing <i class="fa fa-angle-double-right"></i>
                 </a>
-            </p>
-            <p>
-                <a href="https://apacheignite.readme.io/docs/compute-grid" target="docs">
-                    <b>Compute APIs <i class="fa fa-angle-double-right"></i></b>
+                </li>
+                <li>
+                  <a href="https://apacheignite.readme.io/docs/compute-grid" target="docs">
+                    Compute APIs <i class="fa fa-angle-double-right"></i>
                 </a>
-            </p>
-            <p>
-                <a href="/features/machinelearning.html">
-                    <b>Machine and Deep Learning <i class="fa fa-angle-double-right"></i></b>
+                </li>
+              </ul>
+            </div>
+            <div class="col-6 col-xs-12">
+              <ul>
+                <li>
+                  <a href="/features/machinelearning.html">
+                    Machine and Deep Learning <i class="fa fa-angle-double-right"></i>
                 </a>
-            </p>
-            <p>
-                <a href="/arch/multi-tier-storage.html">
-                    <b>Multi-Tier Storage <i class="fa fa-angle-double-right"></i></b>
+                </li>
+                <li>
+                   <a href="/arch/multi-tier-storage.html">
+                    Multi-Tier Storage <i class="fa fa-angle-double-right"></i>
                 </a>
-            </p>
-        </section>
-    </main>
-
-    <!--#include virtual="/includes/footer.html" -->
+                </li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    
+      
 </div>
+</article>
+<!--#include virtual="/includes/footer.html" -->
 <!--#include virtual="/includes/scripts.html" -->
 </body>
 </html>

Modified: ignite/site/branches/ignite-redisign/use-cases/in-memory-cache.html
URL: http://svn.apache.org/viewvc/ignite/site/branches/ignite-redisign/use-cases/in-memory-cache.html?rev=1875105&r1=1875104&r2=1875105&view=diff
==============================================================================
--- ignite/site/branches/ignite-redisign/use-cases/in-memory-cache.html (original)
+++ ignite/site/branches/ignite-redisign/use-cases/in-memory-cache.html Wed Mar 11 22:11:46 2020
@@ -48,26 +48,20 @@ under the License.
     <!--#include virtual="/includes/sh.html" -->
 </head>
 <body>
-<div id="wrapper">
-    <!--#include virtual="/includes/header.html" -->
-
-    <main id="main" role="main" class="container">
-        <section id="database-caching" class="page-section">
-            <h1 class="first">In-Memory Cache With SQL, ACID Transactions and Compute APIs</h1>
-            <div class="col-sm-12 col-md-12 col-xs-12" style="padding:0 0 20px 0;">
-                <div class="col-sm-6 col-md-6 col-xs-12" style="padding-left:0;">
-                    <p>
-                        One of the usages of Apache Ignite is as a distributed in-memory cache that supports ANSI SQL,
-                        ACID transactions, and co-located computations. From APIs and sessions caching to databases and
-                        microservices acceleration, Ignite provides all essential components required to speed up
-                        applications.
-                    </p>
-                </div>
-                <div class="col-sm-6 col-md-5 col-xs-12" style="padding-right:0">
-                    <img class="img-responsive" src="/images/in_memory_data.png" width="400px" style="float:right;"/>
-                </div>
-            </div>
-
+<!--#include virtual="/includes/header.html" -->
+<article>
+    <div class="container">
+					<h1 >In-Memory Cache <strong>With SQL, <br />ACID Transactions and Compute APIs</strong></h1>
+        
+          <p>
+                  One of the usages of Apache Ignite is as a distributed in-memory cache that supports ANSI SQL,
+                  ACID transactions, and co-located computations. From APIs and sessions caching to databases and
+                  microservices acceleration, Ignite provides all essential components required to speed up
+                  applications.
+              </p>
+        
+                    <img class="img-fluid diagram-right" src="/images/in_memory_data.png"/>
+                
             <p>
                 As with classic distributed caches, you can span an Ignite cluster across several interconnected
                 physical or virtual machines letting it utilize all the available memory and CPU resources. But the
@@ -83,9 +77,10 @@ under the License.
             <p>
                 There are two primary deployment strategies for Ignite as an in-memory cache -- the cache-aside
                 deployment and read-through/write-through caching. Let's review both of them.
-            </p>
-
-            <div class="page-heading">Cache-Aside Deployment</div>
+            </p>				
+      
+            
+					 <h2>Cache-Aside Deployment</h2>
             <p>
                 With the cache-aside deployment strategy, a cache is deployed separately from the primary data store
                 and might not even know that the latter exists. An application or change-data-capture process (CDC)
@@ -105,8 +100,8 @@ under the License.
                 then Ignite reads it from the disk automatically regardless of the API you use -- be it SQL, key-value,
                 or scan queries.
             </p>
-
-            <div class="page-heading">Read-Through/Write-Through Caching</div>
+        
+            <h2>Read-Through/Write-Through Caching</h2>
             <p>
                 The read-through/write-through caching strategy can also be classified as an in-memory data grid type
                 of deployment. When Apache Ignite is deployed as a data grid, the application layer starts treating
@@ -127,52 +122,62 @@ under the License.
                 SQL, you have to preload the entire data set in memory first (Ignite SQL can query data on
                 disk only if it is located in its native persistence).
             </p>
-            <div class="page-heading">Learn More</div>
-            <p>
-                <a href="/features/sql.html">
-                    <b>Distributed SQL <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/collocatedprocessing.html">
-                    <b>Co-located Processing <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/transactions.html">
-                    <b>ACID Transactions <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/arch/persistence.html">
-                    <b>Native Persistence <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/machinelearning.html">
-                    <b>Machine and Deep Learning <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/datagrid.html">
-                    <b>Ignite as an In-Memory Data Grid <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/use-cases/in-memory-database.html">
-                    <b>Ignite as an In-Memory Database <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/use-cases/dih.html">
-                    <b>Ignite as a Digital Integration Hub <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-        </section>
-    </main>
+        
+            
+      <div class="jumbotron jumbotron-fluid">
+        <div class="container">
+          <div class="display-6 title">Learn More</div>
+          <hr class="my-4">
+          <div class="row">
+            <div class="col-6 col-xs-12">
+              <ul>
+                <li>
+                  <p> <a href="/features/sql.html">
+                    Distributed SQL <i class="fa fa-angle-double-right"></i>
+                </a></p>
+                </li>
+                <li>
+                  <p><a href="/features/collocatedprocessing.html">
+                    Co-located Processing <i class="fa fa-angle-double-right"></i>
+                </a></p>
+                </li>
+				  <li><p><a href="/features/transactions.html">
+                    ACID Transactions <i class="fa fa-angle-double-right"></i>
+                </a></p></li>
+				  <li><p><a href="/arch/persistence.html">
+                    Native Persistence <i class="fa fa-angle-double-right"></i>
+                </a></p></li>
+              </ul>
+            </div>
+            <div class="col-6 col-xs-12">
+              <ul>
+                <li>
+                  <p><a href="/features/machinelearning.html">
+                    Machine and Deep Learning <i class="fa fa-angle-double-right"></i>
+                </a></p>
+                </li>
+                <li>
+                  <p><a href="/features/datagrid.html">
+                    Ignite as an In-Memory Data Grid <i class="fa fa-angle-double-right"></i>
+                </a></p>
+                </li>
+				  <li><p><a href="/use-cases/in-memory-database.html">
+                    Ignite as an In-Memory Database <i class="fa fa-angle-double-right"></i>
+                </a></p></li>
+				  <li><p><a href="/use-cases/dih.html">
+                    Ignite as a Digital Integration Hub <i class="fa fa-angle-double-right"></i>
+                </a></p></li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    
+      
+  </div>	
+</article>
+<!--#include virtual="/includes/footer.html" -->
 
-    <!--#include virtual="/includes/footer.html" -->
-</div>
 <!--#include virtual="/includes/scripts.html" -->
 </body>
 </html>

Modified: ignite/site/branches/ignite-redisign/use-cases/in-memory-database.html
URL: http://svn.apache.org/viewvc/ignite/site/branches/ignite-redisign/use-cases/in-memory-database.html?rev=1875105&r1=1875104&r2=1875105&view=diff
==============================================================================
--- ignite/site/branches/ignite-redisign/use-cases/in-memory-database.html (original)
+++ ignite/site/branches/ignite-redisign/use-cases/in-memory-database.html Wed Mar 11 22:11:46 2020
@@ -49,31 +49,26 @@ under the License.
     <!--#include virtual="/includes/sh.html" -->
 </head>
 <body>
-<div id="wrapper">
-    <!--#include virtual="/includes/header.html" -->
 
-    <main id="main" role="main" class="container">
-        <section id="key-value-store" class="page-section">
-            <h1 class="first">In-Memory Database With Multi-Tier Storage</h1>
-            <div class="col-sm-12 col-md-12 col-xs-12" style="padding:0 0 10px 0;">
-                <div class="col-sm-6 col-md-6 col-xs-12" style="padding-left:0; padding-right:0">
-                    <p>
-                        Apache Ignite, as an in-memory database, is a high-performant system-of-records that is capable
-                        of storing and querying large data sets from memory as well as disk without requiring to warm up
-                        the memory tier on cluster restarts.
-                    </p>
-                    <p>
-                        Ignite serves as a distributed database that scales horizontally across memory and disk tiers
-                        and supports ACID transactions, ANSI SQL, key-value, compute, machine learning, and other data
-                        processing APIs.
-                    </p>
-                </div>
-                <div class="col-sm-6 col-md-5 col-xs-12" style="padding-right:0">
-                    <img class="img-responsive" src="/images/sql_database.png" width="400px" style="float:right;"/>
-                </div>
-            </div>
+    <!--#include virtual="/includes/header.html" -->
+<article>
+    <div class="container">
+        <h1 >In-Memory Database <strong>With Multi-Tier Storage</strong></h1>
+        <img class="diagram-right img-responsive" src="/images/sql_database.png" width="400px" style="float:right;"/>
+        <p>
+            Apache Ignite, as an in-memory database, is a high-performant system-of-records that is capable
+            of storing and querying large data sets from memory as well as disk without requiring to warm up
+            the memory tier on cluster restarts.
+        </p>
+        <p>
+            Ignite serves as a distributed database that scales horizontally across memory and disk tiers
+            and supports ACID transactions, ANSI SQL, key-value, compute, machine learning, and other data
+            processing APIs.
+        </p>
+            
+                    
 
-            <div class="page-heading">Multi-Tier Storage</div>
+            <h2>Multi-Tier Storage</h2>
             <p>
                 Apache Ignite is designed to work with memory, disk, and Intel® Optane™ as active storage tiers.
                 Such architecture lets you combine the advantages of in-memory computing with disk durability and
@@ -91,94 +86,72 @@ under the License.
             <p>
                 The following are the primary advantages of Ignite memory management architecture:
             </p>
-            <ul class="page-list" style="margin-bottom: 20px;">
-                <li>
-                    Multi-tiered storage - Ignite treats disk as an active storage layer allowing to
-                    cache a subset of the data in memory and query both in-memory and disk-only records with SQL and
-                    all other available APIs.
-                </li>
-                <li>
-                    Instantaneous cluster restarts - Ignite becomes fully operational from disk upon a cluster
-                    startup or restarts without requiring to preload or warm up the memory tier.
-                </li>
-            </ul>
-
-            <div class="page-heading">Better High-Availability With Instantaneous Cluster Restarts</div>
-
-            <p>
-                Ignite native persistence takes away the trouble of time-consuming memory warm-ups on cluster restarts.
-                Ignite persistence always keeps a superset of data on disk and treats it as one of the storage layers.
-                Hence, Ignite starts reading data from the persistence layer as soon as the cluster becomes active. As
-                you begin to run the queries, the memory tier is warmed up in the background with the data Ignite
-                accesses from the disk.
-            </p>
-
-            <div class="page-heading">Avoiding Network Impact on Performance With Co-located Processing</div>
-
-            <p>
-                Disk-centric systems, like RDBMS or NoSQL, generally use the classic client-server approach when
-                transferring data from the server to the client-side where it gets processed and then discarded. This
-                approach does not scale very well because moving data over the network is the most expensive operation
-                in a distributed system.
-            </p>
-            <p>
-                Many distributed databases, including Apache Ignite, support a more scalable approach called co-located
-                processing, which eliminates or significantly reduces network traffic by running application logic right
-                on the cluster nodes. This approach executes data or compute-intensive queries, including distributed
-                SQL with JOINs, exactly where the data resides.
-            </p>
-
-            <div class="page-heading">Learn More</div>
-            <p>
-                <a href="/arch/multi-tier-storage.html">
-                    <b>Multi-Tier Storage <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/arch/persistence.html">
-                    <b>Native Persistence <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/collocatedprocessing.html">
-                    <b>Co-located Processing <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/sql.html">
-                    <b>Distributed SQL <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/transactions.html">
-                    <b>ACID Transactions <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/machinelearning.html">
-                    <b>Machine and Deep Learning <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/datagrid.html">
-                    <b>Ignite as an In-Memory Data Grid <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/use-cases/in-memory-cache.html">
-                    <b>Ignite as an In-Memory Cache <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/use-cases/dih.html">
-                    <b>Ignite as a Digital Integration Hub <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-        </section>
-    </main>
-
+        <ul class="page-list" >
+            <li>
+                Multi-tiered storage - Ignite treats disk as an active storage layer allowing to
+                cache a subset of the data in memory and query both in-memory and disk-only records with SQL and
+                all other available APIs.
+            </li>
+            <li>
+                Instantaneous cluster restarts - Ignite becomes fully operational from disk upon a cluster
+                startup or restarts without requiring to preload or warm up the memory tier.
+            </li>
+        </ul>
+
+        <h2>Better High-Availability With Instantaneous Cluster Restarts</h2>
+
+        <p>
+            Ignite native persistence takes away the trouble of time-consuming memory warm-ups on cluster restarts.
+            Ignite persistence always keeps a superset of data on disk and treats it as one of the storage layers.
+            Hence, Ignite starts reading data from the persistence layer as soon as the cluster becomes active. As
+            you begin to run the queries, the memory tier is warmed up in the background with the data Ignite
+            accesses from the disk.
+        </p>
+
+        <h2>Avoiding Network Impact on Performance With Co-located Processing</h2>
+
+        <p>
+            Disk-centric systems, like RDBMS or NoSQL, generally use the classic client-server approach when
+            transferring data from the server to the client-side where it gets processed and then discarded. This
+            approach does not scale very well because moving data over the network is the most expensive operation
+            in a distributed system.
+        </p>
+        <p>
+            Many distributed databases, including Apache Ignite, support a more scalable approach called co-located
+            processing, which eliminates or significantly reduces network traffic by running application logic right
+            on the cluster nodes. This approach executes data or compute-intensive queries, including distributed
+            SQL with JOINs, exactly where the data resides.
+        </p>
+
+        <div class="jumbotron jumbotron-fluid">
+            <div class="container">
+              <div class="title display-6">Learn More</div>
+              <hr class="my-4">
+              <div class="row">
+                <div class="col-6 col-xs-12">
+                    <ul>
+                        <li><a href="/arch/multi-tier-storage.html"><b>Multi-Tier Storage <i class="fa fa-angle-double-right"></i></b></a></li>
+                        <li><a href="/arch/persistence.html"><b>Native Persistence <i class="fa fa-angle-double-right"></i></b></a></li>
+                        <li><a href="/features/collocatedprocessing.html"><b>Co-located Processing <i class="fa fa-angle-double-right"></i></b></a></li>
+                        <li><a href="/features/sql.html"><b>Distributed SQL <i class="fa fa-angle-double-right"></i></b></a></li>
+                        <li><a href="/features/transactions.html"><b>ACID Transactions <i class="fa fa-angle-double-right"></i></b></a></li>
+                    </ul>
+                </div>
+                <div class="col-6 col-xs-12">
+                    <ul>
+                        <li><a href="/features/machinelearning.html"><b>Machine and Deep Learning <i class="fa fa-angle-double-right"></i></b></a></li>
+                        <li><a href="/features/datagrid.html"><b>Ignite as an In-Memory Data Grid <i class="fa fa-angle-double-right"></i></b></a></li>
+                        <li><a href="/use-cases/in-memory-cache.html"><b>Ignite as an In-Memory Cache <i class="fa fa-angle-double-right"></i></b></a></li>
+                        <li><a href="/use-cases/dih.html"><b>Ignite as a Digital Integration Hub <i class="fa fa-angle-double-right"></i></b></a></li>
+                    </ul>
+                </div>
+            </div>
+            </div>
+        </div>
+        </div>
+        </article>
     <!--#include virtual="/includes/footer.html" -->
-</div>
+
 <!--#include virtual="/includes/scripts.html" -->
 </body>
 </html>

Modified: ignite/site/branches/ignite-redisign/use-cases/key-value-store.html
URL: http://svn.apache.org/viewvc/ignite/site/branches/ignite-redisign/use-cases/key-value-store.html?rev=1875105&r1=1875104&r2=1875105&view=diff
==============================================================================
--- ignite/site/branches/ignite-redisign/use-cases/key-value-store.html (original)
+++ ignite/site/branches/ignite-redisign/use-cases/key-value-store.html Wed Mar 11 22:11:46 2020
@@ -48,29 +48,23 @@ under the License.
     <!--#include virtual="/includes/sh.html" -->
 </head>
 <body>
-<div id="wrapper">
-    <!--#include virtual="/includes/header.html" -->
-
-    <main id="main" role="main" class="container">
-        <section id="key-value-store" class="page-section">
-            <h1 class="first">Distributed Key-Value Store</h1>
-            <div class="col-sm-12 col-md-12 col-xs-12" style="padding:0 0 10px 0;">
-                <div class="col-sm-6 col-md-6 col-xs-12" style="padding-left:0; padding-right:0">
-                    <p>
-                        Apache Ignite can operate as a distributed key-value store that stores data both in memory
-                        and on disk. In this deployment mode, Ignite functions as a distributed partitioned
-                        hash map with every cluster node owning a portion of the overall data set. As with
-                        standard key-value stores, you can access the cluster with key-value requests or take
-                        advantage of APIs available exclusively in Ignite - distributed ACID transactions, SQL,
-                        co-located computations, and machine learning.
-                    </p>
-                </div>
-                <div class="col-sm-6 col-md- col-xs-12" style="padding-right:0">
-                    <img class="img-responsive" src="/images/data_grid.png" width="500px" style="float:right;"/>
-                </div>
-            </div>
 
-            <div class="page-heading">JCache and Extended Key-Value APIs</div>
+    <!--#include virtual="/includes/header.html" -->
+<article>
+    <div class="container">
+        <h1>Distributed <strong>Key-Value Store</strong></h1>
+            
+            <img class="img-responsive diagram-right" src="/images/data_grid.png"  />
+            <p>
+                Apache Ignite can operate as a distributed key-value store that stores data both in memory
+                and on disk. In this deployment mode, Ignite functions as a distributed partitioned
+                hash map with every cluster node owning a portion of the overall data set. As with
+                standard key-value stores, you can access the cluster with key-value requests or take
+                advantage of APIs available exclusively in Ignite - distributed ACID transactions, SQL,
+                co-located computations, and machine learning.
+            </p>
+                
+            <h2>JCache and Extended Key-Value APIs</h2>
             <p>
                 Ignite key-value APIs comply with JCache (JSR 107) specification supporting the following:
             </p>
@@ -90,7 +84,7 @@ under the License.
                 different caches/tables consistently.
             </p>
 
-            <div class="page-heading">Near Cache</div>
+            <h2>Near Cache</h2>
 
             <p>
                 Near cache is a local client-side cache that stores the most frequently used data on the application end.
@@ -101,7 +95,7 @@ under the License.
                 applications that keep the record's copy in their near caches.
             </p>
 
-            <div class="page-heading">Read-through and Write-Through/Behind</div>
+            <h2>Read-through and Write-Through/Behind</h2>
 
             <p>
                 If Ignite is deployed as a key-value store on top of an external database, then it can automatically
@@ -115,7 +109,7 @@ under the License.
                 missing in memory. This feature is fully supported for both JCache and extended key-value APIs.
             </p>
 
-            <div class="page-heading">Ignite Native Persistence</div>
+            <h2>Ignite Native Persistence</h2>
 
             <p>
                 If you want Ignite to function as a key-value store that caches data in memory and persists it to
@@ -126,42 +120,32 @@ under the License.
                 then Ignite reads it from the disk automatically regardless of the API you use.
             </p>
 
-            <div class="page-heading">Learn More</div>
-            <p>
-                <a href="/arch/multi-tier-storage.html">
-                    <b>Multi-Tier Storage <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/arch/persistence.html">
-                    <b>Native Persistence <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/transactions.html">
-                    <b>ACID Transactions <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/collocatedprocessing.html">
-                    <b>Co-located Processing <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/sql.html">
-                    <b>Distributed SQL <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-            <p>
-                <a href="/features/machinelearning.html">
-                    <b>Machine and Deep Learning <i class="fa fa-angle-double-right"></i></b>
-                </a>
-            </p>
-        </section>
-    </main>
-
+            <div class="jumbotron jumbotron-fluid">
+                <div class="container">
+                  <div class="title display-6">Learn More</div>
+                  <hr class="my-4">
+                  <div class="row">
+                    <div class="col-6 col-xs-12">
+                        <ul>
+                            <li><a href="/arch/multi-tier-storage.html"><b>Multi-Tier Storage <i class="fa fa-angle-double-right"></i></b></a></li>
+                            <li><a href="/arch/persistence.html"><b>Native Persistence <i class="fa fa-angle-double-right"></i></b></a></li>
+                            <li><a href="/features/transactions.html"><b>ACID Transactions <i class="fa fa-angle-double-right"></i></b></a></li>
+                        </ul>
+                    </div>
+                    <div class="col-6 col-xs-12">
+                        <ul>
+                            <li><a href="/features/collocatedprocessing.html"><b>Co-located Processing <i class="fa fa-angle-double-right"></i></b></a></li>
+                            <li><a href="/features/sql.html"><b>Distributed SQL <i class="fa fa-angle-double-right"></i></b></a></li>
+                            <li><a href="/features/machinelearning.html"><b>Machine and Deep Learning <i class="fa fa-angle-double-right"></i></b></a></li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</article>         
     <!--#include virtual="/includes/footer.html" -->
-</div>
+
 <!--#include virtual="/includes/scripts.html" -->
 </body>
 </html>