Modified: ignite/site/branches/ignite-redisign/includes/header.html URL: http://svn.apache.org/viewvc/ignite/site/branches/ignite-redisign/includes/header.html?rev=1872472&r1=1872471&r2=1872472&view=diff ============================================================================== --- ignite/site/branches/ignite-redisign/includes/header.html (original) +++ ignite/site/branches/ignite-redisign/includes/header.html Tue Jan 7 21:50:13 2020 @@ -5,14 +5,14 @@ <div class="news-announcement"> <p>Influence Apache Ignite® evolution. <a href="https://docs.google.com/forms/d/e/1FAIpQLSdUveEVXer3lpkyiqfFw4175TvZzGHUOS4snPfnkO0NDku0eQ/viewform"; - target="_blank" rel="noopener">Cast a vote!</a></p> + target="_blank" rel="noopener">Cast a vote!</a></p> </div> </div> </div> <div class="container"> <div class="row"> <div class="col-md-2 col-sm-2 col-xs-6"> - <div class="logo" style="width:150px;"><a href="/index.html"><img src="/images/ignite_logo_inv.svg" alt="Apache Ignite Logo"></a></div> + <div class="logo" style="width:150px;"><a href="/index.html" aria-label="Ignite Homepage"><img src="/images/ignite_logo_inv.svg" alt="Apache Ignite Logo"></a></div> </div> <div class="col-md-10 col-sm-10 col-xs-6"> @@ -35,54 +35,54 @@ </li> <!--to here...--> <li class="dropdown" style="cursor: pointer;"> - <a class="dropdown-toggle" data-toggle="dropdown">Features<span class="caret"></span></a> + <a class="dropdown-toggle" data-toggle="dropdown" aria-label="Features">Features<span class="caret"></span></a> <ul class="dropdown-menu" role="menu"> - <li role="presentation" class="submenu-header">Overview</li> - <li><a href="/whatisignite.html" + <li role="presentation" class="submenu-header" >Overview</li> + <li><a href="/whatisignite.html" aria-label="Overview" onclick="ga('send', 'event', 'whatisignite', 'menu_click', 'whatisignite_page');"> What is Apache Ignite®?</a> </li> <li class="divider"> - <!-- Ignite main features. --> + <!-- Ignite main features. --> <li role="presentation" class="submenu-header">Features</li> - <li><a href="/arch/memorycentric.html" + <li><a href="/arch/memorycentric.html" aria-label="Memory Centric Storage" onclick="ga('send', 'event', 'apache_ignite_features', 'menu_click', 'memory_centric');"> Memory-Centric Storage</a> </li> - <li><a href="/features/sql.html" + <li><a href="/features/sql.html" aria-label="Features" onclick="ga('send', 'event', 'apache_ignite_features', 'menu_click', 'distributed_sql');"> Distributed SQL</a> </li> - <li><a href="/features/datagrid.html" + <li><a href="/features/datagrid.html" aria-label="DataGrid" onclick="ga('send', 'event', 'apache_ignite_features', 'menu_click', 'distributed_key_value');"> Distributed Key-Value</a> </li> <!--<li><a href="/arch/persistence.html"--> - <!--onclick="ga('send', 'event', 'apache_ignite_features', 'menu_click', 'persistence');">--> - <!--Distributed Persistence</a>--> + <!--onclick="ga('send', 'event', 'apache_ignite_features', 'menu_click', 'persistence');">--> + <!--Distributed Persistence</a>--> <!--</li>--> - <li><a href="/features/transactions.html" + <li><a href="/features/transactions.html" aria-label="Transactions" onclick="ga('send', 'event', 'apache_ignite_features', 'menu_click', 'acid_transactions');"> ACID Transactions</a> </li> - <li><a href="/features/collocatedprocessing.html" + <li><a href="/features/collocatedprocessing.html" aria-label="Collocated Processing" onclick="ga('send', 'event', 'apache_ignite_features', 'menu_click', 'collocated_processing');"> Collocated Processing</a> </li> - <li><a href="/features/machinelearning.html" + <li><a href="/features/machinelearning.html" aria-label="Machine Learning" onclick="ga('send', 'event', 'apache_ignite_features', 'menu_click', 'machine_learning');"> Machine Learning</a> </li> - <li><a href="/features/tensorflow.html" + <li><a href="/features/tensorflow.html" aria-label="Tensor Flow" onclick="ga('send', 'event', 'apache_ignite_features', 'menu_click', 'tensorflow');"> TensorFlow Integration</a> </li> - <li><a href="/features/multilanguage.html" + <li><a href="/features/multilanguage.html" aria-label="Multilanguage" onclick="ga('send', 'event', 'apache_ignite_features', 'menu_click', 'multi_language');"> Multi-Language</a> </li> - <li><a href="/arch/clustering.html" + <li><a href="/arch/clustering.html" aria-label="Clustering" onclick="ga('send', 'event', 'apache_ignite_features', 'menu_click', 'clustering');"> Deploy Anywhere</a> </li> @@ -90,37 +90,44 @@ <li class="divider"> - <!-- Ignite tooling. --> + <!-- Ignite tooling. --> <li role="presentation" class="submenu-header">Tooling</li> - <li><a href="/addons.html#web-console">Management & Monitoring</a></li> - </ul> + <li><a href="/features/datavisualization.html#apache-ignite-web-console" aria-label="Ignite Web Console" + onclick="ga('send', 'event', 'apache_ignite_features', 'menu_click', 'ignite_web_console');"> + Ignite Web Console</a> + </li> + <li><a href="/features/datavisualization.html" aria-label="Data Visualization and Analysis" + onclick="ga('send', 'event', 'apache_ignite_features', 'menu_click', 'data_visualization');"> + Data Visualization and Analysis</a> + </li> + </ul> </li> <li class="dropdown" style="cursor: pointer;"> - <a class="dropdown-toggle" data-toggle="dropdown">Use Cases<span class="caret"></span></a> + <a class="dropdown-toggle" data-toggle="dropdown" aria-label="Use Cases">Use Cases<span class="caret"></span></a> <ul class="dropdown-menu" role="menu"> <li role="presentation" class="submenu-header">Proven by</li> - <li><a href="/provenusecases.html" + <li><a href="/provenusecases.html" aria-label="Proven Use Cases" onclick="ga('send', 'event', 'apache_ignite_usecases', 'menu_click', 'proven_usecases');"> Ignite in Production</a> </li> <li class="divider"> - <!--Database--> + <!--Database--> <li role="presentation" class="submenu-header">Data Store</li> - <li><a href="/use-cases/database/distributed-database.html" + <li><a href="/use-cases/database/distributed-database.html" aria-label="Data Store" onclick="ga('send', 'event', 'apache_ignite_usecases', 'menu_click', 'distributed-database');"> Distributed Database</a> </li> - <li><a href="/use-cases/database/in-memory-database.html" + <li><a href="/use-cases/database/in-memory-database.html" aria-label="In-Memory Database" onclick="ga('send', 'event', 'apache_ignite_usecases', 'menu_click', 'distributed-database');"> In-Memory Database</a> </li> - <li><a href="/features/datagrid.html" + <li><a href="/features/datagrid.html" aria-label="In-Memory Data Grid" onclick="ga('send', 'event', 'apache_ignite_usecases', 'menu_click', 'data_grid');"> In-Memory Data Grid</a> </li> - <li><a href="/use-cases/database/key-value-store.html" + <li><a href="/use-cases/database/key-value-store.html" aria-label="Key-Value Store" onclick="ga('send', 'event', 'apache_ignite_usecases', 'menu_click', 'key_value_store');"> Key-Value Store</a> </li> @@ -128,50 +135,52 @@ <!--In-Memory Caching--> <li role="presentation" class="submenu-header">In-Memory Cache</li> - <li><a href="/use-cases/caching/database-caching.html" + <li><a href="/use-cases/caching/database-caching.html" aria-label="Database Caching" onclick="ga('send', 'event', 'apache_ignite_usecases', 'menu_click', 'database-caching');"> Database Caching</a> </li> - <li><a href="/use-cases/caching/jcache-provider.html" + <li><a href="/use-cases/caching/jcache-provider.html" aria-label="JCache Provider" onclick="ga('send', 'event', 'apache_ignite_usecases', 'menu_click', 'jcache-provider');"> JCache Provider</a> </li> - <li><a href="/use-cases/caching/hibernate-l2-cache.html" + <li><a href="/use-cases/caching/hibernate-l2-cache.html" aria-label="Hibernate L2 Cache" onclick="ga('send', 'event', 'apache_ignite_usecases', 'menu_click', 'hibernate-l2-cache');"> Hibernate L2 Cache</a> </li> - <li><a href="/use-cases/caching/web-session-clustering.html" + <li><a href="/use-cases/caching/web-session-clustering.html" aria-label="Web Session Clustering" onclick="ga('send', 'event', 'apache_ignite_usecases', 'menu_click', 'web-session-clustering');"> Web Session Clustering</a> </li> <li class="divider"> - <!-- Comparison --> + <!-- Comparison --> <li role="presentation" class="submenu-header">Comparison</li> - <li><a href="/use-cases/comparison/ignite-for-nosql.html" + <li><a href="/use-cases/comparison/ignite-for-nosql.html" aria-label="Ignite for NoSQL Users" onclick="ga('send', 'event', 'apache_ignite_usecases', 'menu_click', 'ignite-for-nosql');"> Ignite for NoSQL Users</a> </li> - <li><a href="/use-cases/comparison/ignite-for-rdbms.html" + <li><a href="/use-cases/comparison/ignite-for-rdbms.html" aria-label="Ignite for RDBMS Users" onclick="ga('send', 'event', 'apache_ignite_usecases', 'menu_click', 'ignite-for-rdbms');"> Ignite for RDBMS Users</a> </li> <li class="divider"> - <!--Ignite with Spark--> + <!--Ignite with Spark--> <li role="presentation" class="submenu-header">Ignite with Spark</li> - <li><a href="/use-cases/spark/shared-memory-layer.html" + <li><a href="/use-cases/spark/shared-memory-layer.html" aria-label="In-Memory Store for Spark" onclick="ga('send', 'event', 'apache_ignite_usecases', 'menu_click', 'shared-memory-layer');"> In-Memory Store for Spark</a> </li> - <li><a href="/use-cases/spark/sql-queries.html" + <li><a href="/use-cases/spark/sql-queries.html" aria-label="Faster SQL for Spark" onclick="ga('send', 'event', 'apache_ignite_usecases', 'menu_click', 'sql-queries');"> Faster Sql for Spark</a> </li> </ul> </li> <li class="dropdown" style="cursor: pointer;"> - <a class="dropdown-toggle" data-toggle="dropdown">Resources<span class="caret"></span></a> + <a class="dropdown-toggle" data-toggle="dropdown" aria-label="Resources">Resources + <span + class="caret"></span></a> <ul class="dropdown-menu" role="menu"> <li role="presentation" class="submenu-header">Docs & APIs</li> <li><a href="#">APIs</a></li> @@ -220,12 +229,12 @@ <li class="divider"></li> <li role="presentation" class="submenu-header">Meetups & Events</li> - <li><a href="/events.html">Ignite Meetups</a></li> + <li><a href="/meetup-groups.html">Ignite Meetups</a></li> <li><a href="/events.html">Upcoming Events</a></li> </ul> </li> <li> - <a class="download-button-dropdown" href="/download.cgi">Download</a> + <a class="download-button-dropdown" href="/download.cgi">Download</a> </li> </ul> </div>
Modified: ignite/site/branches/ignite-redisign/includes/styles.html URL: http://svn.apache.org/viewvc/ignite/site/branches/ignite-redisign/includes/styles.html?rev=1872472&r1=1872471&r2=1872472&view=diff ============================================================================== --- ignite/site/branches/ignite-redisign/includes/styles.html (original) +++ ignite/site/branches/ignite-redisign/includes/styles.html Tue Jan 7 21:50:13 2020 @@ -1,5 +1,5 @@ <!-- REMEMBER TO COPY ALL CHANGES TO download.html --> -<link media="screen" rel="stylesheet" href="/css/all.css?v=201912101618"> +<link media="screen" rel="stylesheet" href="/css/all.css?v=201912101620"> <link href="https://netdna.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css"; rel="stylesheet" media="screen"> <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic' rel='stylesheet' type='text/css' media="screen"> <link media="screen" rel="stylesheet" href="/css/syntaxhighlighter.css"> \ No newline at end of file Modified: ignite/site/branches/ignite-redisign/scss/all.scss URL: http://svn.apache.org/viewvc/ignite/site/branches/ignite-redisign/scss/all.scss?rev=1872472&r1=1872471&r2=1872472&view=diff ============================================================================== --- ignite/site/branches/ignite-redisign/scss/all.scss (original) +++ ignite/site/branches/ignite-redisign/scss/all.scss Tue Jan 7 21:50:13 2020 @@ -1,861 +1,862 @@ -@import "compass"; -@import "bootstrap"; -@import "markup-mixins"; -@font-face { @include fontface(atillanormal, atilla_normal-webfont) } -@font-face { @include fontface(harabara, harabara-webfont) } -@font-face { @include fontface(icomoon, icomoon) } -html{ - background: $gray-light; -} -body { - margin: 0; - min-width: $base-min-width; - line-height: $base-line-height; -} -a:hover, a:focus { - text-decoration: none; - outline: none; -} -@viewport { width: device-width;} -@-o-viewport { width: device-width;} -@-ms-viewport { width: device-width;} -@-moz-viewport { width: device-width;} -@-webkit-viewport { width: device-width;} -[class^="icon-"], -[class*=" icon-"] { - font-family: 'icomoon'; - speak: none; - font-style: normal; - font-weight: normal; - font-variant: normal; - text-transform: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} -.icon-rss:before { content: "\e600"; } -.icon-linkedin:before { content: "\e601"; } -.icon-twitter:before { content: "\e602"; } -.icon-facebook:before { content: "\e603"; } -.icon-google-plus:before { content: "\e604"; } -.icon-youtube:before { content: "\e605"; } -h1, .h1{ - line-height: 30px; - margin: 0; -} -h2, .h2{ - line-height: 25px; - margin: 0; -} -h3, .h3{ - line-height: 22px; - margin: 0; -} -h4, .h4 { - line-height: 20px; - margin: 0; -} -h5, .h5, -h6, .h6 { - line-height: 17px; - margin: 0; -} -p { - margin: 0 0 $base-line-height; -} -.btn{ - min-width: 160px; - height: 40px; - border-radius: 4px; - text-align: center; - text-transform: capitalize; - font-size: 20px; - line-height: 28px; - padding: 5px; - - @media (max-width: $mobile) { - min-width: 130px; - height: 36px; - font-size: 17px; - line-height: 24px; - } -} -.btn-default:hover { - background: $white; - color: $gray; -} -.btn-danger { - border: none; - line-height: 30px; - @include background-image(linear-gradient(top, #ff0000 0%,#eb0101 21%,#940206 77%,#7a0308 100%)); - $experimental-support-for-svg: true; - - @media (max-width: $mobile) { - line-height: 26px; - } - &:hover { - @include background-image(linear-gradient(top, #7b0308 0%,#840308 10%,#9b0206 28%,#eb0101 79%,#ff0000 100%)); - } -} -#wrapper{ - overflow: hidden; -} -#header { - left: 0; - right: 0; - top: 37px; - z-index: 9999; - padding: 5px 0; - - &.affix-top { - position: absolute; - - @media (max-width: $tablet) { - top: 0; - } - } - &.affix { - top: 0; - background: rgba(54,54,54,0.95); - - @media (max-width: $tablet) { - position: absolute; - /*background: none;*/ - } - } - .container { - position: relative; - } - .logo { - width: 140px; - margin: 0 0 0 1px; - - img{ - @extend %img-full-width; - } - } - div[class*="col-"] { - position: static; - } -} -#nav { - text-align: right; - font-size: 16px; - line-height: 20px; - padding: 21px 0 0; - letter-spacing: 0.1px; - position: static; - - @media (max-width: $mobile) { - padding: 10px 10px 0; - text-align: center; - - .navbar-collapse { - overflow: hidden; - position: absolute; - top: 100%; - left: 0; - right: 0; - z-index: 99; - margin: 10px 0 0; - background: rgba(54,54,54,0.95); - } - } - .container-fluid { - padding: 0; - } - .navbar-toggle { - margin: 0; - } - .navbar-nav { - float: none; - letter-spacing: -4px; - - @media (max-width: $mobile) { - padding: 10px 0; - } - > li { - @extend %align-top; - letter-spacing: normal; - float: none; - margin: 0 0 0 20px; - - @media (max-width: $mobile) { - display: block; - margin: 0; - padding: 5px 10px; - } - >a { - padding: 0; - @extend %align-top; - } - } - } -} -.carousel { - min-height: 597px; - padding: 114px 0 50px; - font-size: 18px; - line-height: 24px; - color: $white; - text-align: center; - position: relative; - z-index: 9; - background: url(../images/bg-carousel.jpg) no-repeat center/cover; - @include transition(all, 0.2s, linear); - - @media (max-width: $tablet) { - min-height: 470px; - padding: 100px 0 50px; - } - @media (max-width: $mobile) { - min-height: 300px; - font-size: 14px; - line-height: 17px; - padding: 100px 0 20px; - } - &:after { - height: 106px; - @include after(auto,0,0,0); - @include background-image(linear-gradient(top, rgba(47,47,47,0) 0%,rgba(47,47,47,0.05) 8%,rgba(47,47,47,0.18) 23%,rgba(47,47,47,0.82) 77%,rgba(47,47,47,0.95) 92%,rgba(47,47,47,1) 100%)); - $experimental-support-for-svg: true; - pointer-events: none; - - @media (max-width: $tablet) { - height: 60px; - } - @media (max-width: $mobile) { - height: 30px; - } - } - .item { - padding: 82px 0 0; - - @media (max-width: $tablet) { - padding: 20px 0 0; - } - } - header { - font-size: 28px; - line-height: 36px; - text-transform: capitalize; - letter-spacing: 0.8px; - - @media (max-width: $tablet) { - font-size: 25px; - line-height: 30px; - } - @media (max-width: $mobile) { - font-size: 20px; - } - p{ - margin: 0 0 18px; - - @media (max-width: $mobile) { - margin: 0 0 10px; - } - } - } - h2 { - font: 100px/100px $alt-font-harabara; - letter-spacing: 2.3px; - margin: 0 0 15px; - - @media (max-width: $tablet) { - font-size: 70px; - line-height: 70px; - } - @media (max-width: $mobile) { - font-size: 42px; - line-height: 42px; - margin: 0 0 5px; - } - } - .buttons { - margin: 0 0 12px; - letter-spacing: -4px; - - @media (max-width: $mobile) { - margin: 0; - } - li{ - @extend %align-top; - letter-spacing: normal; - margin: 0 10px 10px; - } - } - .text { - max-width: 820px; - margin: 0 auto; - } - p{ - margin: 0; - } - .item.cloud{ - padding: 0; - text-align: right; - - @media (max-width: $mobile) { - text-align: center; - } - h1 { - font-size: 53px; - line-height: 53px; - letter-spacing: 1.3px; - margin: 0 0 6px; - - @media (max-width: $tablet) { - font-size: 42px; - line-height: 45px; - } - } - header { - font-size: 15px; - line-height: 20px; - letter-spacing: 0.4px; - margin: 104px -2px 0 0; - - @media (max-width: $tablet) { - font-size: 15px; - line-height: 18px; - margin: 50px 0 0; - } - @media (max-width: $mobile) { - margin: 0; - } - p{ - margin: 0 0 7px; - } - } - .buttons li { - margin: 0 0 10px 13px; - } - .btn{ - height: 26px; - min-width: 104px; - font-size: 13px; - line-height: 18px; - padding: 4px; - } - } - .img-holder { - overflow: hidden; - margin: 0 0 0 -9px; - - @media (max-width: $mobile) { - margin: 0; - } - img{ - @extend %img-full-width; - } - } -} -#main { - margin-bottom: 50px; - - @media (max-width: $mobile) { - margin-bottom: 0; - } - table{ - width: 100%; - border: 2px solid $gray-light; - - th, - td { - height: 40px; - border-width: 0 0 2px 2px; - border-color: $gray-light; - border-style: solid; - padding: 5px 20px; - position: relative; - - &:first-child { - border-left-width: 0; - } - } - th{ - font-size: 18px; - line-height: 20px; - height: 50px; - @media (max-width: $tablet) { - font-size: 15px; - } - &:first-child{ - padding: 5px 38px; - } - } - td:first-child{ - padding-left: 38px; - } - .btn-video { - color: $black; - - &:hover { - color: $red; - } - } - @media screen { - @media (max-width: $mobile) { - border: none; - display: block; - overflow:hidden; - border-top:1px solid $black; - - tbody { - border-left:120px solid $gray; - float:left; - width:100%; - padding:0 1px 0 1px; - } - tr { - float:left; - width:100%; - clear:both; - - &:nth-child(odd) td { - background-color: rgba(0,0,0,0.1); - } - } - td { - width: 100% !important; - height: auto; - padding:0 0 0 120px !important; - margin:0 -1px 0 -121px; - display: block; - float:left; - clear:both; - width:100%; - white-space:nowrap; - border-width: 0 1px 1px 1px !important; - border-color: $black; - @include box-sizing(content-box); - - &:before { - content:attr(title); - padding: 10px; - display:inline-block; - color:$white !important; - font-weight:bold; - width:120px; - vertical-align:middle; - margin:0 0 0 -120px; - position:relative; - white-space:normal; - } - ul, - span { - white-space:normal; - display:inline-block; - vertical-align:middle; - padding:5px; - } - } - thead, - th {display:none;} - } - } - } -} -.overview { - margin: -8px 0 0; - padding: 80px 0 0; - position: relative; - z-index: 4; - - @media (max-width: $tablet) { - margin: 0; - padding: 30px 0 0; - } - h2{ - position: relative; - padding: 3px 0 12px 40px; - - &:after { - @include size(21px,25px); - @include after(0,auto,auto,0); - background: url(../images/sprite.png) no-repeat; - } - } -} -.askquestion { - margin: -18px 0 0; - padding: 80px 0 0; - position: relative; - - @media (max-width: $tablet) { - margin: 0; - padding: 30px 0 0; - } - table { - @media (min-width: $min-mobile) { - - th, - td { - width: 60%; - padding: 5px 20px !important; - - &:first-child, - &:nth-child(2) { - width: 20%; - } - } - } - } - h2{ - position: relative; - padding: 4px 0 13px 40px; - - &:after { - @include size(21px,25px); - @include after(0,auto,auto,3px); - background: url(../images/sprite.png) no-repeat -52px 0; - } - } -} -.community { - margin: -18px 0 0; - padding: 80px 0 0; - position: relative; - z-index: 2; - - @media (max-width: $tablet) { - margin: 0; - padding: 30px 0 0; - } - table { - @media (min-width: $min-mobile) { - - th, - td { - width: 60%; - padding: 5px 20px !important; - - &:first-child, - &:nth-child(2) { - width: 20%; - } - } - } - } - h2{ - position: relative; - padding: 4px 0 13px 40px; - - &:after { - @include size(21px,25px); - @include after(0,auto,auto,3px); - background: url(../images/sprite.png) no-repeat -52px 0; - } - } -} -.download { - margin: -54px 0 0; - padding: 80px 0 94px; - - @media (max-width: $tablet) { - padding: 30px 0; - margin: 0; - } - h2{ - position: relative; - padding: 3px 0 8px 40px; - - &:after { - @include size(21px,25px); - @include after(0,auto,auto,3px); - background: url(../images/sprite.png) no-repeat -78px 0; - } - } - th{ - &:first-child { - width: 476px; - } - &.version { - width: 240px; - } - &.release { - width: 220px; - } - } -} -.info-blocks { - padding: 101px 0 24px; - border-top: 2px solid $gray-light; - - @media (max-width: $tablet) { - padding: 30px 0 20px; - } - h3{ - margin: 0 0 10px; - - @media (max-width: $mobile) { - margin: 0; - } - } - p{ - margin: 0 0 7px; - } - .list { - line-height: 18px; - } - li { - padding: 0 0 0 20px; - position: relative; - @include arrow-lazy(right, 5px, $gray-dark, 4px); - - &:before{ - left: 0; - margin: 0; - } - } - a { - color: $black; - - &:hover { - color: $red; - } - } -} -#footer { - padding: 50px 0 30px; - background: $gray-light; - - @media (max-width: $mobile) { - text-align: center; - padding: 30px 0 10px; - } - a { - color: $black; - - &:hover { - color: $red; - } - } - .logo { - width: 230px; - @extend %align-top; - margin: 0 0 20px; - - @media (max-width: $mobile) { - width: 150px; - margin: 0 0 10px; - } - img{ - @extend %img-full-width; - } - } - p{ - margin: 0 0 22px; - - @media (max-width: $mobile) { - margin: 0 0 10px; - } - } - .security { - letter-spacing: -4px; - margin: 0 -69px 0 0; - - @media (max-width: $mobile){ - margin: 0; - } - li{ - @extend %align-top; - letter-spacing: normal; - margin: 0 69px 20px 0; - - @media (max-width: $mobile) { - margin: 0 20px 10px; - } - } - a:hover { - @include opacity(0.8); - } - img { - display: block; - } - } -} -.footer-nav { - line-height: 18px; - - ul { - margin: 0; - } - li{ - margin: 0 0 12px; - - @media (max-width: $mobile) { - margin: 0 0 5px; - } - } -} -.social-networks{ - font-size: 30px; - letter-spacing: -4px; - margin: 0 0 16px; - - li{ - @extend %align-top; - letter-spacing: normal; - margin: 0 3px 10px 0; - - @media (max-width: $mobile) { - margin: 0 3px 10px; - } - } - a{ - color: $gray !important; - - &:hover { - color: $red !important; - } - } -} -.subnav { - padding: 55px 0 10px; - text-align: center; - - @media (max-width: $mobile) { - padding: 0 0 10px; - } - ul{ - margin: 0; - letter-spacing: -4px; - } - li{ - @extend %align-top; - letter-spacing: normal; - margin: 0 34px; - - @media (max-width: $mobile) { - display: block; - margin: 0 0 5px; - } - } -} - -@import "ignite"; - -.btn-transparent { - @include button-variant($btn-transparent-color, $btn-transparent-bg, $btn-transparent-border); -} - -.btn-transparent:hover { - background: $white; - color: $gray; -} - -.btn-group-export { - position: absolute; - margin: 5px; - top: 0; - right: 0; - z-index: 4; -} - -.btn-export { - min-width: 0; -} - -@media screen and (max-width: $screen-xs-max) { - .btn-group-export { - display: none; - } -} - -/* - * Reset media print style. - */ -@media print { - #header { - position: absolute !important; - } - - a[href]:after { - content: ""; - } - - /* - * Hide social icons. - */ - .social-networks { - display: none; - } - - /* - * Hide navigation menu. - */ - footer nav { - display: none; - } - - /* - * Hide button to download export for table. - */ - .btn-group-export { - display: none; - } - - body { - -webkit-print-color-adjust: exact; - } - - footer { - page-break-inside: avoid; - } - - section.page-section { - page-break-inside: avoid; - } - - section.page-section table { - page-break-inside: avoid; - } - - section.page-section:first-child { - margin-top: 50px; - } - - section.page-section { - padding-top: 0; - margin-top: 0; - margin-bottom: 50px; - - border-bottom: none; - } - - section.page-section p.line-chart { - display: none; - } - - /* - * Small grid - * - * Columns, offsets, pushes, and pulls for the small device range, from phones - * to tablets. - */ - - /* @media (min-width: $mobile) { - @include make-grid(print); - }*/ - - @media (min-width: $landscape) { - @include make-grid(print); - - #main table td { - padding-left: 0; - } - - #main table th { - padding-left: 0; - } - - #main table td:first-child { - padding-left: 20px; - } - - #main table th:first-child { - padding-left: 20px; - } - } +@import "compass"; +@import "bootstrap"; +@import "markup-mixins"; +@font-face { @include fontface(atillanormal, atilla_normal-webfont) } +@font-face { @include fontface(harabara, harabara-webfont) } +@font-face { @include fontface(icomoon, icomoon) } +html{ + background: $gray-light; +} +body { + margin: 0; + min-width: $base-min-width; + line-height: $base-line-height; +} +a:hover, a:focus { + text-decoration: none; + outline: none; +} +@viewport { width: device-width;} +@-o-viewport { width: device-width;} +@-ms-viewport { width: device-width;} +@-moz-viewport { width: device-width;} +@-webkit-viewport { width: device-width;} +[class^="icon-"], +[class*=" icon-"] { + font-family: 'icomoon'; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} +.icon-rss:before { content: "\e600"; } +.icon-linkedin:before { content: "\e601"; } +.icon-twitter:before { content: "\e602"; } +.icon-facebook:before { content: "\e603"; } +.icon-google-plus:before { content: "\e604"; } +.icon-youtube:before { content: "\e605"; } +h1, .h1{ + line-height: 30px; + margin: 0; +} +h2, .h2{ + line-height: 25px; + margin: 0; +} +h3, .h3{ + line-height: 22px; + margin: 0; +} +h4, .h4 { + line-height: 20px; + margin: 0; +} +h5, .h5, +h6, .h6 { + line-height: 17px; + margin: 0; +} +p { + margin: 0 0 $base-line-height; +} +.btn{ + min-width: 160px; + height: 40px; + border-radius: 4px; + text-align: center; + text-transform: capitalize; + font-size: 20px; + line-height: 28px; + padding: 5px; + + @media (max-width: $mobile) { + min-width: 130px; + height: 36px; + font-size: 17px; + line-height: 24px; + } +} +.btn-default:hover { + background: $white; + color: $gray; +} +.btn-danger { + border: none; + line-height: 30px; + @include background-image(linear-gradient(top, #ff0000 0%,#eb0101 21%,#940206 77%,#7a0308 100%)); + $experimental-support-for-svg: true; + + @media (max-width: $mobile) { + line-height: 26px; + } + &:hover { + @include background-image(linear-gradient(top, #7b0308 0%,#840308 10%,#9b0206 28%,#eb0101 79%,#ff0000 100%)); + } +} +#wrapper{ + overflow: hidden; +} +#header { + left: 0; + right: 0; + top: 37px; + z-index: 9999; + padding: 5px 0; + + &.affix-top { + position: absolute; + + @media (max-width: $tablet) { + top: 0; + } + } + &.affix { + top: 0; + background: rgba(54,54,54,0.95); + + @media (max-width: $tablet) { + position: absolute; + /*background: none;*/ + } + } + .container { + position: relative; + } + .logo { + width: 140px; + margin: 0 0 0 1px; + + img{ + @extend %img-full-width; + } + } + div[class*="col-"] { + position: static; + } +} +#nav { + text-align: right; + font-size: 16px; + line-height: 20px; + padding: 21px 0 0; + letter-spacing: 0.1px; + position: static; + + @media (max-width: $mobile) { + padding: 10px 10px 0; + text-align: center; + + .navbar-collapse { + overflow: hidden; + position: absolute; + top: 100%; + left: 0; + right: 0; + z-index: 99; + margin: 10px 0 0; + background: rgba(54,54,54,0.95); + } + } + .container-fluid { + padding: 0; + } + .navbar-toggle { + margin: 0; + } + .navbar-nav { + float: none; + letter-spacing: -4px; + + @media (max-width: $mobile) { + padding: 10px 0; + } + > li { + @extend %align-top; + letter-spacing: normal; + float: none; + margin: 0 0 0 20px; + + @media (max-width: $mobile) { + display: block; + margin: 0; + padding: 5px 10px; + } + >a { + padding: 0; + @extend %align-top; + } + } + } +} +.carousel { + min-height: 597px; + padding: 114px 0 50px; + font-size: 18px; + line-height: 24px; + color: $white; + text-align: center; + position: relative; + z-index: 9; + background: url(../images/bg-carousel.jpg) no-repeat center/cover; + @include transition(all, 0.2s, linear); + + @media (max-width: $tablet) { + min-height: 470px; + padding: 100px 0 50px; + } + @media (max-width: $mobile) { + min-height: 300px; + font-size: 14px; + line-height: 17px; + padding: 100px 0 20px; + } + &:after { + height: 106px; + @include after(auto,0,0,0); + @include background-image(linear-gradient(top, rgba(47,47,47,0) 0%,rgba(47,47,47,0.05) 8%,rgba(47,47,47,0.18) 23%,rgba(47,47,47,0.82) 77%,rgba(47,47,47,0.95) 92%,rgba(47,47,47,1) 100%)); + $experimental-support-for-svg: true; + pointer-events: none; + + @media (max-width: $tablet) { + height: 60px; + } + @media (max-width: $mobile) { + height: 30px; + } + } + .item { + padding: 82px 0 0; + + @media (max-width: $tablet) { + padding: 20px 0 0; + } + } + header { + font-size: 28px; + line-height: 36px; + text-transform: capitalize; + letter-spacing: 0.8px; + + @media (max-width: $tablet) { + font-size: 25px; + line-height: 30px; + } + @media (max-width: $mobile) { + font-size: 20px; + } + p{ + margin: 0 0 18px; + + @media (max-width: $mobile) { + margin: 0 0 10px; + } + } + } + h2 { + font: 100px/100px $alt-font-harabara; + letter-spacing: 2.3px; + margin: 0 0 15px; + + @media (max-width: $tablet) { + font-size: 70px; + line-height: 70px; + } + @media (max-width: $mobile) { + font-size: 42px; + line-height: 42px; + margin: 0 0 5px; + } + } + .buttons { + margin: 0 0 12px; + letter-spacing: -4px; + + @media (max-width: $mobile) { + margin: 0; + } + li{ + @extend %align-top; + letter-spacing: normal; + margin: 0 10px 10px; + } + } + .text { + max-width: 820px; + margin: 0 auto; + } + p{ + margin: 0; + } + .item.cloud{ + padding: 0; + text-align: right; + + @media (max-width: $mobile) { + text-align: center; + } + h1 { + font-size: 53px; + line-height: 53px; + letter-spacing: 1.3px; + margin: 0 0 6px; + + @media (max-width: $tablet) { + font-size: 42px; + line-height: 45px; + } + } + header { + font-size: 15px; + line-height: 20px; + letter-spacing: 0.4px; + margin: 104px -2px 0 0; + + @media (max-width: $tablet) { + font-size: 15px; + line-height: 18px; + margin: 50px 0 0; + } + @media (max-width: $mobile) { + margin: 0; + } + p{ + margin: 0 0 7px; + } + } + .buttons li { + margin: 0 0 10px 13px; + } + .btn{ + height: 26px; + min-width: 104px; + font-size: 13px; + line-height: 18px; + padding: 4px; + } + } + .img-holder { + overflow: hidden; + margin: 0 0 0 -9px; + + @media (max-width: $mobile) { + margin: 0; + } + img{ + @extend %img-full-width; + } + } +} +#main { + margin-bottom: 50px; + + @media (max-width: $mobile) { + margin-bottom: 0; + } + + table{ + width: 100%; + border: 2px solid $gray-light; + + th, + td { + height: 40px; + border-width: 0 0 2px 2px; + border-color: $gray-light; + border-style: solid; + padding: 5px 20px; + position: relative; + + &:first-child { + border-left-width: 0; + } + } + th{ + font-size: 18px; + line-height: 20px; + height: 50px; + @media (max-width: $tablet) { + font-size: 15px; + } + &:first-child{ + padding: 5px 38px; + } + } + td:first-child{ + padding-left: 38px; + } + .btn-video { + color: $black; + + &:hover { + color: $red; + } + } + @media screen { + @media (max-width: $mobile) { + border: none; + display: block; + overflow:hidden; + border-top:1px solid $black; + + tbody { + border-left:120px solid $gray; + float:left; + width:100%; + padding:0 1px 0 1px; + } + tr { + float:left; + width:100%; + clear:both; + + &:nth-child(odd) td { + background-color: rgba(0,0,0,0.1); + } + } + td { + width: 100% !important; + height: auto; + padding:0 0 0 120px !important; + margin:0 -1px 0 -121px; + display: block; + float:left; + clear:both; + width:100%; + white-space:nowrap; + border-width: 0 1px 1px 1px !important; + border-color: $black; + @include box-sizing(content-box); + + &:before { + content:attr(title); + padding: 10px; + display:inline-block; + color:$white !important; + font-weight:bold; + width:120px; + vertical-align:middle; + margin:0 0 0 -120px; + position:relative; + white-space:normal; + } + ul, + span { + white-space:normal; + display:inline-block; + vertical-align:middle; + padding:5px; + } + } + thead, + th {display:none;} + } + } + } +} +.overview { + margin: -8px 0 0; + padding: 80px 0 0; + position: relative; + z-index: 4; + + @media (max-width: $tablet) { + margin: 0; + padding: 30px 0 0; + } + h2{ + position: relative; + padding: 3px 0 12px 40px; + + &:after { + @include size(21px,25px); + @include after(0,auto,auto,0); + background: url(../images/sprite.png) no-repeat; + } + } +} +.askquestion { + margin: -18px 0 0; + padding: 80px 0 0; + position: relative; + + @media (max-width: $tablet) { + margin: 0; + padding: 30px 0 0; + } + table { + @media (min-width: $min-mobile) { + + th, + td { + width: 60%; + padding: 5px 20px !important; + + &:first-child, + &:nth-child(2) { + width: 20%; + } + } + } + } + h2{ + position: relative; + padding: 4px 0 13px 40px; + + &:after { + @include size(21px,25px); + @include after(0,auto,auto,3px); + background: url(../images/sprite.png) no-repeat -52px 0; + } + } +} +.community { + margin: -18px 0 0; + padding: 80px 0 0; + position: relative; + z-index: 2; + + @media (max-width: $tablet) { + margin: 0; + padding: 30px 0 0; + } + table { + @media (min-width: $min-mobile) { + + th, + td { + width: 60%; + padding: 5px 20px !important; + + &:first-child, + &:nth-child(2) { + width: 20%; + } + } + } + } + h2{ + position: relative; + padding: 4px 0 13px 40px; + + &:after { + @include size(21px,25px); + @include after(0,auto,auto,3px); + background: url(../images/sprite.png) no-repeat -52px 0; + } + } +} +.download { + margin: -54px 0 0; + padding: 80px 0 94px; + + @media (max-width: $tablet) { + padding: 30px 0; + margin: 0; + } + h2{ + position: relative; + padding: 3px 0 8px 40px; + + &:after { + @include size(21px,25px); + @include after(0,auto,auto,3px); + background: url(../images/sprite.png) no-repeat -78px 0; + } + } + th{ + &:first-child { + width: 476px; + } + &.version { + width: 240px; + } + &.release { + width: 220px; + } + } +} +.info-blocks { + padding: 101px 0 24px; + border-top: 2px solid $gray-light; + + @media (max-width: $tablet) { + padding: 30px 0 20px; + } + h3{ + margin: 0 0 10px; + + @media (max-width: $mobile) { + margin: 0; + } + } + p{ + margin: 0 0 7px; + } + .list { + line-height: 18px; + } + li { + padding: 0 0 0 20px; + position: relative; + @include arrow-lazy(right, 5px, $gray-dark, 4px); + + &:before{ + left: 0; + margin: 0; + } + } + a { + color: $black; + + &:hover { + color: $red; + } + } +} +#footer { + padding: 50px 0 30px; + background: $gray-light; + + @media (max-width: $mobile) { + text-align: center; + padding: 30px 0 10px; + } + a { + color: $black; + + &:hover { + color: $red; + } + } + .logo { + width: 230px; + @extend %align-top; + margin: 0 0 20px; + + @media (max-width: $mobile) { + width: 150px; + margin: 0 0 10px; + } + img{ + @extend %img-full-width; + } + } + p{ + margin: 0 0 22px; + + @media (max-width: $mobile) { + margin: 0 0 10px; + } + } + .security { + letter-spacing: -4px; + margin: 0 -69px 0 0; + + @media (max-width: $mobile){ + margin: 0; + } + li{ + @extend %align-top; + letter-spacing: normal; + margin: 0 69px 20px 0; + + @media (max-width: $mobile) { + margin: 0 20px 10px; + } + } + a:hover { + @include opacity(0.8); + } + img { + display: block; + } + } +} +.footer-nav { + line-height: 18px; + + ul { + margin: 0; + } + li{ + margin: 0 0 12px; + + @media (max-width: $mobile) { + margin: 0 0 5px; + } + } +} +.social-networks{ + font-size: 30px; + letter-spacing: -4px; + margin: 0 0 16px; + + li{ + @extend %align-top; + letter-spacing: normal; + margin: 0 3px 10px 0; + + @media (max-width: $mobile) { + margin: 0 3px 10px; + } + } + a{ + color: $gray !important; + + &:hover { + color: $red !important; + } + } +} +.subnav { + padding: 55px 0 10px; + text-align: center; + + @media (max-width: $mobile) { + padding: 0 0 10px; + } + ul{ + margin: 0; + letter-spacing: -4px; + } + li{ + @extend %align-top; + letter-spacing: normal; + margin: 0 34px; + + @media (max-width: $mobile) { + display: block; + margin: 0 0 5px; + } + } +} + +@import "ignite"; + +.btn-transparent { + @include button-variant($btn-transparent-color, $btn-transparent-bg, $btn-transparent-border); +} + +.btn-transparent:hover { + background: $white; + color: $gray; +} + +.btn-group-export { + position: absolute; + margin: 5px; + top: 0; + right: 0; + z-index: 4; +} + +.btn-export { + min-width: 0; +} + +@media screen and (max-width: $screen-xs-max) { + .btn-group-export { + display: none; + } +} + +/* + * Reset media print style. + */ +@media print { + #header { + position: absolute !important; + } + + a[href]:after { + content: ""; + } + + /* + * Hide social icons. + */ + .social-networks { + display: none; + } + + /* + * Hide navigation menu. + */ + footer nav { + display: none; + } + + /* + * Hide button to download export for table. + */ + .btn-group-export { + display: none; + } + + body { + -webkit-print-color-adjust: exact; + } + + footer { + page-break-inside: avoid; + } + + section.page-section { + page-break-inside: avoid; + } + + section.page-section table { + page-break-inside: avoid; + } + + section.page-section:first-child { + margin-top: 50px; + } + + section.page-section { + padding-top: 0; + margin-top: 0; + margin-bottom: 50px; + + border-bottom: none; + } + + section.page-section p.line-chart { + display: none; + } + + /* + * Small grid + * + * Columns, offsets, pushes, and pulls for the small device range, from phones + * to tablets. + */ + + /* @media (min-width: $mobile) { + @include make-grid(print); + }*/ + + @media (min-width: $landscape) { + @include make-grid(print); + + #main table td { + padding-left: 0; + } + + #main table th { + padding-left: 0; + } + + #main table td:first-child { + padding-left: 20px; + } + + #main table th:first-child { + padding-left: 20px; + } + } } \ No newline at end of file Modified: ignite/site/branches/ignite-redisign/scss/ignite.scss URL: http://svn.apache.org/viewvc/ignite/site/branches/ignite-redisign/scss/ignite.scss?rev=1872472&r1=1872471&r2=1872472&view=diff ============================================================================== --- ignite/site/branches/ignite-redisign/scss/ignite.scss (original) +++ ignite/site/branches/ignite-redisign/scss/ignite.scss Tue Jan 7 21:50:13 2020 @@ -58,6 +58,145 @@ $color-silver: #BDC3C7; $color-concrete: #95A5A6; $color-asbestos: #7F8C8D; + +////////*****EVENTS PAGE CSS 2020 UPDATE*****//////// + + +.round-icon-block-tab { + border-radius: 10px; + background:#eeeeee; + padding:5px; + display: block; + float: left; + margin-right:8px; + + img { + margin:0px auto; + max-width:20px; + width:20px; + display: block; + } +} + +.continent { + display: block; + float: left; +} + + +.meet-groups { + padding:30px; + + ul { + margin-left:0px; + padding-left:0px; + margin-top:5px; + + li { + list-style:none; + margin-bottom:10px; + + a { + font-size:16px; + color:#555555; + } + + a:hover { + color:red; + } + } + } +} + +#meetup-groups { + + li { + a {clear:both; overflow:hidden;} + } + .active { + a {clear:both; overflow:hidden;} + .continent {font-weight:bold; padding-top:1px;} + } + +} + +.sub-head-events { + font-size:24px; + margin-top:20px; + margin-bottom:30px; +} + +.margin-headline { + margin-top:60px !important; +} + +.new-event { + margin-top:20px; + margin-bottom:60px; + padding-bottom:20px; + border-bottom:2px #e1e1e1 dotted; + + .news-date { + font-size: 15px; + color: #888; + } + .news-date:before { + content: "â¢"; + font-size: 14px; + color:#ed1c24; + display:inline-block; + margin-right:5px; + } + + p {margin-top:15px;} + +} +.round-icon-block { + border-radius: 10px; + background:#eeeeee; + padding:15px; + display: block; + img { + margin:0px auto; + max-width:100px; + width:100px; + display: block; + } + p{ text-align: center; margin-top: 10px;} + + } + + +@media (max-width: $mobile) { + + .col-md-4 {margin-top:10px; margin-bottom:40px;} + + .margin-headline {margin-top:15px;} + + .meet-groups {padding-top:0px; padding-bottom:0px; + } + + .continent { + font-size:16px !important; + } + + + } + +@media (max-width: $tablet) { + + .col-md-4 {margin-top:10px; margin-bottom:40px;} + + .margin-headline {margin-top:15px;} + + .meet-groups {padding-top:0px; padding-bottom:0px;} + + } + +///////***/////////****//// + + + .syntaxhighlighter { padding: 10px 5px; border-radius: 6px; @@ -814,10 +953,7 @@ iframe { color: #888; } -.news-date { - font-size: 15px; - color: #888; -} + section.news-section { a > i {
