You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@activemq.apache.org by ma...@apache.org on 2018/11/06 11:55:13 UTC
[activemq-website] 24/45: Fix Reponsive Layout
This is an automated email from the ASF dual-hosted git repository.
martyntaylor pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/activemq-website.git
commit c145ffe8449877409b0933e9df7bc2f2385c6a3b
Author: Martyn Taylor <mt...@redhat.com>
AuthorDate: Tue Sep 25 12:32:04 2018 +0100
Fix Reponsive Layout
---
_config.yml | 3 ++-
_includes/splash.html | 38 ++++++++++++++++++++++++++++++++++++--
_includes/users.html | 48 ++++++++++++++++++++++++------------------------
css/main.scss | 16 ++++++++++++++--
index.html | 15 +++++++--------
projects/cms/index.html | 2 +-
projects/nms/index.html | 2 +-
7 files changed, 85 insertions(+), 39 deletions(-)
diff --git a/_config.yml b/_config.yml
index fe13264..e6deb57 100644
--- a/_config.yml
+++ b/_config.yml
@@ -23,4 +23,5 @@ permalink: /news/:year/:month/:day/:title/
excerpt_separator: ""
destination: target
exclude: [BUILD.md, Gemfile*]
-keep_files: [.git]
\ No newline at end of file
+keep_files: [.git]
+exclude: [vendor
diff --git a/_includes/splash.html b/_includes/splash.html
index 7b959fc..440b132 100644
--- a/_includes/splash.html
+++ b/_includes/splash.html
@@ -1,4 +1,4 @@
-<div class="row">
+<!-- <div class="row">
<div class="col-12 slider slider-{{ page.project_class }} slider-lg parent d-none d-lg-block">
<div class="row child" style="width: 100%">
<div class="col-2 align-middle"></div>
@@ -18,7 +18,7 @@
<div class="row narative">
<div class="col-12">
<div class="container">
- <!-- Narative 2 -->
+
<div class="row">
<div class="col-sm-12 narative">
<div class="card">
@@ -28,4 +28,38 @@
</div>
</div>
</div>
+</div> -->
+
+<div class="row">
+ <div class="col-12 slider slider-{{ page.project_class }} slider-lg parent d-none d-lg-block">
+ <div class="row child" style="width: 100%">
+ <div class="col-2 align-middle"></div>
+ <div class="col-6 slider-text align-middle">
+ <p style="font-size: 60px">{{ page.project_name }}</p>
+ <p style="font-size: 23px">{{ page.project_info }}</p>
+ <button style="margin-top: 20px" href="#" class="btn btn-primary btn-lg btn-outline-light">DOWNLOAD v{{ page.latest_version }}<i class="fa-download fa btn-icon"></i></button>
+ <button style="margin-top: 20px" href="#" class="btn btn-primary btn-lg btn-outline-light">GET STARTED<i class="fa-info-circle fa btn-icon"></i></button>
+ </div>
+ <div class="col-4 align-middle" >
+ <img src="/assets/img/activemq_logo_white_vertical.png" style="height: 250px"/>
+ </div>
+ </div>
+ </div>
+ <div class="col-12 slider slider-{{ page.project_class }} d-md-none d-lg-none d-xl-none d-inline-block">
+ <div class="row" style="padding: 50px 10px 20px 10px">
+ <div class="col-7 slider-text align-middle">
+ <p style="font-size: 30px">{{ page.project_name }}</p>
+ </div>
+ <div class="col-4 align-middle" >
+ <img src="/assets/img/activemq_logo_white_vertical.png" style="height: 130px"/>
+ </div>
+ </div>
+ <div class="row" style="padding: 0px 10px 50px 10px; color: white; font-size: 20px; text-align: center">
+ <div class="col-12 align-center">
+ <p style="font-size: 20px; font-weight: bold">{{ page.project_info }}</p>
+ <button style="margin: 20px 10px 0 0" href="#" class="btn btn-primary btn btn-outline-light">Download v{{ page.latest_version }}<i class="fa-download fa btn-icon"></i></button>
+ <button style="margin-top: 20px" href="#" class="btn btn-primary btn btn-outline-light">Get Started<i class="fa-info-circle fa btn-icon"></i></button>
+ </div>
+ </div>
+ </div>
</div>
diff --git a/_includes/users.html b/_includes/users.html
index 3919721..92d7b30 100644
--- a/_includes/users.html
+++ b/_includes/users.html
@@ -6,41 +6,41 @@
<h2 style="margin-bottom: 20px; color: white">USED BY</h2>
</div>
<div class="row">
- <div class="user-logo col-sm-4 col-md-2">
- <img src="/assets/img/customers/redhatlogo.png" />
+ <div class="user-logo col-6 col-md-3">
+ <img src="/assets/img/customers/company-logo.png" />
</div>
- <div class="user-logo col-sm-4 col-md-2">
- <img src="/assets/img/customers/igindex.png" />
+ <div class="user-logo col-6 col-md-3">
+ <img src="/assets/img/customers/company-logo.png" />
</div>
- <div class="user-logo col-sm-4 col-md-2">
- <img src="/assets/img/customers/logo-aws-white.png" />
+ <div class="user-logo col-6 col-md-3">
+ <img src="/assets/img/customers/company-logo.png" />
</div>
- <div class="user-logo col-sm-4 col-md-2">
- <img src="/assets/img/customers/dominoes.png" />
+ <div class="user-logo col-6 col-md-3">
+ <img src="/assets/img/customers/company-logo.png" />
</div>
- <div class="user-logo col-sm-4 col-md-2">
- <img src="/assets/img/customers/wildfly_white.png" />
+ <div class="user-logo col-6 col-md-3">
+ <img src="/assets/img/customers/company-logo.png" />
</div>
- <div class="user-logo col-sm-4 col-md-2">
- <img src="/assets/img/customers/ge.png" />
+ <div class="user-logo col-6 col-md-3">
+ <img src="/assets/img/customers/company-logo.png" />
</div>
- <div class="user-logo col-sm-4 col-md-2">
- <img src="/assets/img/customers/ThomsonReuters_Logo.png" />
+ <div class="user-logo col-6 col-md-3">
+ <img src="/assets/img/customers/company-logo.png" />
</div>
- <div class="user-logo col-sm-4 col-md-2">
- <img src="/assets/img/customers/cmcmarkets.png" />
+ <div class="user-logo col-6 col-md-3">
+ <img src="/assets/img/customers/company-logo.png" />
</div>
- <div class="user-logo col-sm-4 col-md-2">
- <img src="/assets/img/customers/bosch-938-logo-png-transparent.png" />
+ <div class="user-logo col-6 col-md-3">
+ <img src="/assets/img/customers/company-logo.png" />
</div>
- <div class="user-logo col-sm-4 col-md-2">
- <img src="/assets/img/customers/savoir.png" />
+ <div class="user-logo col-6 col-md-3">
+ <img src="/assets/img/customers/company-logo.png" />
</div>
- <div class="user-logo col-sm-4 col-md-2">
- <img src="/assets/img/customers/creditsuisse.png" />
+ <div class="user-logo col-6 col-md-3">
+ <img src="/assets/img/customers/company-logo.png" />
</div>
- <div class="user-logo col-sm-4 col-md-2">
- <img src="/assets/img/customers/UBS-LOGO-WHITE.png" />
+ <div class="user-logo col-6 col-md-3">
+ <img src="/assets/img/customers/company-logo.png" />
</div>
</div>
</div>
diff --git a/css/main.scss b/css/main.scss
index 86b6fd2..b681a85 100644
--- a/css/main.scss
+++ b/css/main.scss
@@ -13,7 +13,7 @@ ul.navbar-nav {
.content {
margin-top: 78px;
- width: 100%;
+ //width: 100%;
}
.container {
@@ -21,7 +21,8 @@ ul.navbar-nav {
}
body {
- width: 100%;
+ width: 100%;
+ margin: 0%;
}
.slider {
@@ -86,6 +87,17 @@ a.get-started:hover {
font-weight: bold;
color: white;
text-align: center;
+ padding-bottom: 20px;
+ padding-top: 20px;
+}
+
+.slider-text-small {
+ font-size: 20px;
+ font-weight: bold;
+ color: white;
+ text-align: center;
+ padding-bottom: 20px;
+ padding-top: 20px;
}
table.slider {
diff --git a/index.html b/index.html
index f355983..cc83603 100644
--- a/index.html
+++ b/index.html
@@ -11,20 +11,19 @@ layout: default
</div>
</div>
<div class="col-4 align-middle" >
- <img src="/assets/img/activemq_logo_white_vertical.png" style="height: 250px"/>
+ <img src="/assets/img/main-logo.png" style="height: 250px"/>
</div>
</div>
</div>
- <div class="col-12 parent slider d-md-none d-lg-none d-xl-none d-inline-block">
- <div class="row child" style="width: 100%">
- <div class="col-2 align-middle"></div>
- <div class="col-6 slider-text align-middle">
+ <div class="col-12 slider d-md-none d-lg-none d-xl-none d-inline-block">
+ <div class="row" style="padding: 80px 10px 80px 10px";>
+ <div class="col-8 slider-text-small align-middle">
<div class="child">
A SUITE OF OPEN SOURCE PROJECTS FOR HIGH PERFORMANCE MESSAGING
</div>
</div>
- <div class="col-4 align-middle" >
- <img src="/assets/img/activemq_logo_white_vertical.png" style="height: 250px"/>
+ <div class="col-4 align-middle">
+ <img src="/assets/img/main-logo.png" style="height: 120px; float: right"/>
</div>
</div>
</div>
@@ -32,7 +31,7 @@ layout: default
<div class="container">
<!-- Narative -->
- <div class="row">
+ <div class="row d-none d-lg-block">
<div class="col-sm-12 narative">
<div class="card">
<div class="card-body narative">
diff --git a/projects/cms/index.html b/projects/cms/index.html
index aa92548..f64e871 100644
--- a/projects/cms/index.html
+++ b/projects/cms/index.html
@@ -1,6 +1,6 @@
---
layout: project_default
-project_name: CMS
+project_name: CMS CLIENT
project_info: C++ CLIENT IN THE STYLE OF JMS
project_top_narative: CMS (stands for C++ Messaging Service) is a JMS-like API for C++ for interfacing with Message Brokers such as Apache ActiveMQ. CMS helps to make your C++ client code much neater and easier to follow. To get a better feel for CMS try the API Reference. ActiveMQ-CPP is a client only library, a message broker such as Apache ActiveMQ is still needed for your clients to communicate.
project_class: cms
diff --git a/projects/nms/index.html b/projects/nms/index.html
index f1c5937..d975dc6 100644
--- a/projects/nms/index.html
+++ b/projects/nms/index.html
@@ -1,6 +1,6 @@
---
layout: project_default
-project_name: NMS
+project_name: NMS CLIENTS
project_info: A SUITE OF .NET CLIENTS FOR MESSAGING WITH ACTIVEMQ
project_top_narative: The NMS API This allows you to build .NET applications in C#, VB, or any other .NET language, using a single API to connect to multiple different providers using a JMS style API.
project_class: nms