This commit is contained in:
JT 2014-04-05 02:03:01 -07:00
parent 08d29f120f
commit a6e681dbe6
78 changed files with 3517 additions and 957 deletions

4
.gitignore vendored
View File

@ -23,3 +23,7 @@ _testmain.go
*.test
bin/
.vagrant/
website/npm-debug.log

View File

@ -3,17 +3,24 @@ module.exports = function(grunt) {
// Configuration goes here
grunt.initConfig({
less: {
development:{
files: {
"stylesheets/main.css": "stylesheets/main.less"
}
}
},
concat: {
options: {
separator: ';'
},
site: {
src: [
'javascripts/app/app.js',
'javascripts/app/util.js',
'javascripts/app/home.js',
'javascripts/app/nodes.js'
'javascripts/app/homepage.js'
],
dest: 'javascripts/app/deploy/site.js'
@ -29,6 +36,10 @@ module.exports = function(grunt) {
},
watch: {
less: {
files: 'stylesheets/*.less',
tasks: ['less']
},
js: {
files: 'javascripts/app/*.js',
tasks: ['concat', 'uglify']
@ -37,8 +48,8 @@ module.exports = function(grunt) {
});
// Load plugins here
grunt.loadNpmTasks('grunt-contrib-less');
grunt.loadNpmTasks('grunt-contrib-clean');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-connect');
@ -53,4 +64,6 @@ module.exports = function(grunt) {
// Full distribution task.
grunt.registerTask('dist', ['dist-js']);
grunt.registerTask('default', ['watch']);
};

BIN
website/source/images/consul-footer-logo.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/consul-footer-logo@2x.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/consul-header-logo.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/consul-header-logo@2x.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/consul-hero-logo.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/consul-hero-logo@2x.png (Stored with Git LFS) Normal file

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

BIN
website/source/images/feature-config.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/feature-config@2x.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/feature-discovery.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/feature-discovery@2x.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/feature-health.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/feature-health@2x.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/feature-multi.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/feature-multi@2x.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/footer-hashicorp-logo.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/footer-hashicorp-logo@2x.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/footer-pattern.jpg (Stored with Git LFS)

Binary file not shown.

Binary file not shown.

Binary file not shown.

BIN
website/source/images/hashi-logo-s.png (Stored with Git LFS)

Binary file not shown.

BIN
website/source/images/hero-dots-below.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/hero-dots-below@2x.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/hero-dots.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/hero-dots@2x.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/icon-download-purple.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/icon-download-purple@2x.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/icon-download.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/icon-download@2x.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/icon-github-purple.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/icon-github-purple@2x.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/icon-github.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/icon-github@2x.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/logo-circle-logo.png (Stored with Git LFS)

Binary file not shown.

Binary file not shown.

BIN
website/source/images/logo-type-medium.png (Stored with Git LFS)

Binary file not shown.

Binary file not shown.

BIN
website/source/images/logo-type-small.png (Stored with Git LFS)

Binary file not shown.

Binary file not shown.

BIN
website/source/images/nav-dotpipes.png (Stored with Git LFS) Normal file

Binary file not shown.

BIN
website/source/images/nav-dotpipes@2x.png (Stored with Git LFS) Normal file

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -1,43 +1,71 @@
<!-- Main jumbotron for a primary marketing message or call to action -->
<div id="jumbotron-mask">
<div id="jumbotron">
<div class="container">
<div class="jumbo-logo hidden-xs hidden-sm"></div>
<div class="col-lg-5 col-md-5">
<h2 class="rls-l">Consul is a decentralized solution for service discovery and orchestration that is lightweight, highly available, and fault tolerant.</h2>
<div class="col-lg-6 col-md-6">
<h2 class="rls-l">Create and configure lightweight, reproducible, and portable development environments.</h2>
</div>
<div class="jumbo-logo-wrap col-lg-offset-1 col-lg-5 col-md-6 hidden-xs hidden-sm">
<div class="jumbo-logo"></div>
</div>
<!-- <p><a class="btn btn-primary btn-lg">Learn more &raquo;</a></p> -->
</div>
<div class="jumbotron-dots"></div>
</div>
</div>
<div id="features">
<div class="container">
<!-- Example row of columns -->
<div class="row double-row">
<div class="col-lg-6 col-md-6">
<div class="row">
<div class="col-lg-5 col-md-5">
<span class="icn icn1"></span>
<span class="icn discovery"></span>
</div>
<div class="col-lg-7 col-md-7">
<h2>Gossip-based Membership</h2>
<p>Consul relies on an efficient and lightweight gossip protocol to communicate with nodes. The Serf agents periodically exchange messages with each other in much the same way that a zombie apocalypse would occur: it starts with one zombie but soon infects everyone. In practice, the gossip is <a href="/docs/internals/simulator.html">very fast and extremely efficient.</a></p>
<h2>Service Discovery</h2>
<p>Consul makes it simple for services to register themselves, and to discover other service</p>
</div>
</div>
</div>
<div class="col-lg-6 col-md-6">
<div class="row">
<div class="col-lg-5 col-md-5">
<span class="icn health"></span>
</div>
<div class="col-lg-7 col-md-7">
<h2>Failure Detection</h2>
<p>Consul is able to quickly detect failed members and notify the rest of the cluster. This failure detection is built into the heart of the gossip protocol used by Serf. Like humans in a zombie apocalypse, everybody checks their peers for infection and quickly alerts the other living humans. Serf relies on a random probing technique which is proven to efficiently scale to clusters of any size.</p>
</div>
<div class="col-lg-5 col-md-5">
<span class="icn icn2"></span>
<p>Pairing service discovery with health checking prevents routing requests to unhealthy hosts, and enables services to easily provide circuit breakers.</p>
</div>
</div>
</div>
</div>
<div class="row double-row">
<div class="col-lg-6 col-md-6">
<div class="row">
<div class="col-lg-5 col-md-5">
<span class="icn icn3"></span>
<span class="icn multi"></span>
</div>
<div class="col-lg-7 col-md-5">
<h2>Custom Events</h2>
<p>In addition to managing membership, Consul can broadcast custom events. These can be used to trigger deploys, restart processes, spread tales of human heroism, and anything else you may want. The event system is flexible and lightweight, making it easy for application developers and sysadmins alike to leverage.</p>
<div class="col-lg-7 col-md-7">
<h2>Multi Datacenter</h2>
<p>Consul scales to multiple datacenters out of the box, with no complicated configuration.</p>
</div>
</div>
</div>
<div class="col-lg-6 col-md-6">
<div class="row">
<div class="col-lg-5 col-md-5">
<span class="icn config"></span>
</div>
<div class="col-lg-7 col-md-7">
<h2>Shared Configuration</h2>
<p>Store hierarchical key/value configuration data for services.</p>
</div>
</div>
</div>
</div>
</div> <!-- /container -->
</div> <!-- /features -->

View File

@ -1,20 +1,15 @@
//
// home.js
// app.js
//
var Serf = (function() {
var APP = (function() {
function initialize (){
Serf.Util.runIfClassNamePresent('page-home', initHome);
APP.Utils.runIfClassNamePresent('page-home', initHome);
}
function initHome() {
if(!Serf.Util.isMobile){
Serf.Nodes.init();
}else{
Serf.Home.mobileHero();
}
APP.Homepage.init();
}
//api

View File

@ -1,20 +1,15 @@
//
// home.js
// app.js
//
var Serf = (function() {
var APP = (function() {
function initialize (){
Serf.Util.runIfClassNamePresent('page-home', initHome);
APP.Utils.runIfClassNamePresent('page-home', initHome);
}
function initHome() {
if(!Serf.Util.isMobile){
Serf.Nodes.init();
}else{
Serf.Home.mobileHero();
}
APP.Homepage.init();
}
//api
@ -22,15 +17,16 @@ var Serf = (function() {
initialize: initialize
}
})();//
})();
;//
// util.js
//
var Serf = Serf || {};
(function () {
var APP = APP || {};
APP.Utils = (function () {
return {
//check for mobile user agents
var isMobile = (function(){
isMobile : (function(){
if( navigator.userAgent.match(/Android/i)
|| navigator.userAgent.match(/webOS/i)
|| navigator.userAgent.match(/iPhone/i)
@ -44,196 +40,58 @@ var Serf = Serf || {};
else {
return false;
}
})()
})(),
// calls the given function if the given classname is found
function runIfClassNamePresent(selector, initFunction) {
runIfClassNamePresent: function(selector, initFunction) {
var elms = document.getElementsByClassName(selector);
if (elms.length > 0) {
initFunction();
}
}
}
Serf.Util = {};
Serf.Util.isMobile = isMobile;
Serf.Util.runIfClassNamePresent = runIfClassNamePresent;
}());;//homepage.js
})();//
// home.js
//
var Serf = Serf || {};
var APP = APP || {};
(function () {
APP.Homepage = (function () {
return {
// calls the given function if the given classname is found
function mobileHero() {
var jumbo = document.getElementById('jumbotron');
jumbo.className = jumbo.className + ' mobile-hero';
ui : null,
init: function () {
var _this = this;
//cache elements
this.ui = {
$doc: $(window),
$hero: $('#jumbotron'),
$pagination: null
}
Serf.Home = {};
Serf.Home.mobileHero = mobileHero;
this.addEventListeners();
})();//
// node.js
// animation on the home page
//
},
var Serf = Serf || {};
addEventListeners: function(){
var _this = this;
(function () {
if(APP.Utils.isMobile)
return;
var width = 1400,
height = 490,
border = 50,
numberNodes = 128,
linkGroup = 0;
//nodeLinks = [];
_this.ui.$doc.scroll(function() {
var top = _this.ui.$doc.scrollTop(),
speedAdj = (top*0.8),
speedAdjOffset = speedAdj - top;
var nodes = [];
for (i=0; i<numberNodes; i++) {
nodes.push({
x: Math.random() * (width - border) + (border / 2),
y: Math.random() * (height - border) + (border / 2),
});
}
var fill = d3.scale.category20();
var force = d3.layout.force()
.size([width, height])
.nodes(nodes)
.linkDistance(60)
.charge(-1)
.gravity(0.0004)
.on("tick", tick);
var svg = d3.select("#jumbotron").append("svg")
.attr('id', 'node-canvas')
.attr("width", width)
.attr("height", height)
//set left value after adding to dom
resize();
svg.append("rect")
.attr("width", width)
.attr("height", height);
var nodes = force.nodes(),
links = force.links(),
node = svg.selectAll(".node"),
link = svg.selectAll(".link");
var cursor = svg.append("circle")
.attr("r", 30)
.attr("transform", "translate(-100,-100)")
.attr("class", "cursor");
function createLink(index) {
var node = nodes[index];
var nodeSelected = svg.select("#id_" + node.index).classed("active linkgroup_"+ linkGroup, true);
var distMap = {};
var distances = [];
for (var i=0; i<nodes.length; i++) {
if (i == index) {
continue
}
var target = nodes[i];
var selected = svg.select("#id_" + i);
var dx = selected.attr('cx') - nodeSelected.attr('cx');
var dy = selected.attr('cy') - nodeSelected.attr('cy');
var dist = Math.sqrt(dx * dx + dy * dy)
if (dist in distMap) {
distMap[dist].push(target)
} else {
distMap[dist] = [target]
}
distances.push(dist)
}
distances.sort(d3.ascending);
for (i = 0; i < 3; i++) {
var dist = distances[i]
var target = distMap[dist].pop()
var link = {
source: node,
target: target
}
links.push(link);
}
restart();
}
function tick() {
link.attr("x1", function(d) { return d.source.x; })
.attr("y1", function(d) { return d.source.y; })
.attr("x2", function(d) { return d.target.x; })
.attr("y2", function(d) { return d.target.y; });
node.attr("cx", function(d) { return d.x; })
.attr("cy", function(d) { return d.y; });
}
function restart() {
node = node.data(nodes);
node.enter().insert("circle", ".cursor")
.attr("class", "node")
.attr("r", 12)
.attr("id", function (d, i) {
return ("id_" + i)
_this.ui.$hero.css('webkitTransform', 'translate(0, '+ speedAdj +'px)');
_this.ui.$hero.find('.container').css('webkitTransform', 'translate(0, '+ speedAdjOffset +'px)');
//_this.ui.$pagination.css('webkitTransform', 'translate(0, '+ speedAdjOffset +'px)');
})
.call(force.drag);
link = link.data(links);
link.enter().insert("line", ".node")
.attr("class", "link active linkgroup_"+ linkGroup);
force.start();
resetLink(linkGroup);
linkGroup++;
}
function resetLink(num){
setTimeout(resetColors, 700, num)
}
function resetColors(num){
svg.selectAll(".linkgroup_"+ num).classed('active', false)
}
window.onresize = function(){
resize();
}
function resize() {
var nodeC = document.getElementById('node-canvas');
wW = window.innerWidth;
nodeC.style.left = ((wW - width) / 2 ) + 'px';
}
//kick things off
function init() {
restart();
for (i=0;i<numberNodes;i++) {
setTimeout(createLink, 700*i+1000, i);
}
}
}());
Serf.Nodes = {};
Serf.Nodes.init = init;
}(jQuery, this));
})();

View File

@ -0,0 +1 @@
var APP=function(){function a(){APP.Utils.runIfClassNamePresent("page-home",b)}function b(){APP.Homepage.init()}return{initialize:a}}(),APP=APP||{};APP.Utils=function(){return{isMobile:function(){return navigator.userAgent.match(/Android/i)||navigator.userAgent.match(/webOS/i)||navigator.userAgent.match(/iPhone/i)||navigator.userAgent.match(/iPod/i)||navigator.userAgent.match(/BlackBerry/i)||navigator.userAgent.match(/Windows Phone/i)?!0:!1}(),runIfClassNamePresent:function(a,b){var c=document.getElementsByClassName(a);c.length>0&&b()}}}();var APP=APP||{};!function(){APP.Homepage=function(){return{ui:null,init:function(){this.ui={$doc:$(window),$hero:$("#jumbotron"),$pagination:null},this.addEventListeners()},addEventListeners:function(){var a=this;APP.Utils.isMobile||a.ui.$doc.scroll(function(){var b=a.ui.$doc.scrollTop(),c=.8*b,d=c-b;a.ui.$hero.css("webkitTransform","translate(0, "+c+"px)"),a.ui.$hero.find(".container").css("webkitTransform","translate(0, "+d+"px)")})}}}()}(jQuery,this);

View File

@ -1,17 +0,0 @@
//
// home.js
//
var Serf = Serf || {};
(function () {
// calls the given function if the given classname is found
function mobileHero() {
var jumbo = document.getElementById('jumbotron');
jumbo.className = jumbo.className + ' mobile-hero';
}
Serf.Home = {};
Serf.Home.mobileHero = mobileHero;
})();

View File

@ -0,0 +1,45 @@
//homepage.js
var APP = APP || {};
(function () {
APP.Homepage = (function () {
return {
ui : null,
init: function () {
var _this = this;
//cache elements
this.ui = {
$doc: $(window),
$hero: $('#jumbotron'),
$pagination: null
}
this.addEventListeners();
},
addEventListeners: function(){
var _this = this;
if(APP.Utils.isMobile)
return;
_this.ui.$doc.scroll(function() {
var top = _this.ui.$doc.scrollTop(),
speedAdj = (top*0.8),
speedAdjOffset = speedAdj - top;
_this.ui.$hero.css('webkitTransform', 'translate(0, '+ speedAdj +'px)');
_this.ui.$hero.find('.container').css('webkitTransform', 'translate(0, '+ speedAdjOffset +'px)');
//_this.ui.$pagination.css('webkitTransform', 'translate(0, '+ speedAdjOffset +'px)');
})
}
}
}());
}(jQuery, this));

View File

@ -1,163 +0,0 @@
//
// node.js
// animation on the home page
//
var Serf = Serf || {};
(function () {
var width = 1400,
height = 490,
border = 50,
numberNodes = 128,
linkGroup = 0;
//nodeLinks = [];
var nodes = [];
for (i=0; i<numberNodes; i++) {
nodes.push({
x: Math.random() * (width - border) + (border / 2),
y: Math.random() * (height - border) + (border / 2),
});
}
var fill = d3.scale.category20();
var force = d3.layout.force()
.size([width, height])
.nodes(nodes)
.linkDistance(60)
.charge(-1)
.gravity(0.0004)
.on("tick", tick);
var svg = d3.select("#jumbotron").append("svg")
.attr('id', 'node-canvas')
.attr("width", width)
.attr("height", height)
//set left value after adding to dom
resize();
svg.append("rect")
.attr("width", width)
.attr("height", height);
var nodes = force.nodes(),
links = force.links(),
node = svg.selectAll(".node"),
link = svg.selectAll(".link");
var cursor = svg.append("circle")
.attr("r", 30)
.attr("transform", "translate(-100,-100)")
.attr("class", "cursor");
function createLink(index) {
var node = nodes[index];
var nodeSelected = svg.select("#id_" + node.index).classed("active linkgroup_"+ linkGroup, true);
var distMap = {};
var distances = [];
for (var i=0; i<nodes.length; i++) {
if (i == index) {
continue
}
var target = nodes[i];
var selected = svg.select("#id_" + i);
var dx = selected.attr('cx') - nodeSelected.attr('cx');
var dy = selected.attr('cy') - nodeSelected.attr('cy');
var dist = Math.sqrt(dx * dx + dy * dy)
if (dist in distMap) {
distMap[dist].push(target)
} else {
distMap[dist] = [target]
}
distances.push(dist)
}
distances.sort(d3.ascending);
for (i = 0; i < 3; i++) {
var dist = distances[i]
var target = distMap[dist].pop()
var link = {
source: node,
target: target
}
links.push(link);
}
restart();
}
function tick() {
link.attr("x1", function(d) { return d.source.x; })
.attr("y1", function(d) { return d.source.y; })
.attr("x2", function(d) { return d.target.x; })
.attr("y2", function(d) { return d.target.y; });
node.attr("cx", function(d) { return d.x; })
.attr("cy", function(d) { return d.y; });
}
function restart() {
node = node.data(nodes);
node.enter().insert("circle", ".cursor")
.attr("class", "node")
.attr("r", 12)
.attr("id", function (d, i) {
return ("id_" + i)
})
.call(force.drag);
link = link.data(links);
link.enter().insert("line", ".node")
.attr("class", "link active linkgroup_"+ linkGroup);
force.start();
resetLink(linkGroup);
linkGroup++;
}
function resetLink(num){
setTimeout(resetColors, 700, num)
}
function resetColors(num){
svg.selectAll(".linkgroup_"+ num).classed('active', false)
}
window.onresize = function(){
resize();
}
function resize() {
var nodeC = document.getElementById('node-canvas');
wW = window.innerWidth;
nodeC.style.left = ((wW - width) / 2 ) + 'px';
}
//kick things off
function init() {
restart();
for (i=0;i<numberNodes;i++) {
setTimeout(createLink, 700*i+1000, i);
}
}
Serf.Nodes = {};
Serf.Nodes.init = init;
})();

View File

@ -1,12 +1,12 @@
//
// util.js
//
var Serf = Serf || {};
(function () {
var APP = APP || {};
APP.Utils = (function () {
return {
//check for mobile user agents
var isMobile = (function(){
isMobile : (function(){
if( navigator.userAgent.match(/Android/i)
|| navigator.userAgent.match(/webOS/i)
|| navigator.userAgent.match(/iPhone/i)
@ -20,18 +20,14 @@ var Serf = Serf || {};
else {
return false;
}
})()
})(),
// calls the given function if the given classname is found
function runIfClassNamePresent(selector, initFunction) {
runIfClassNamePresent: function(selector, initFunction) {
var elms = document.getElementsByClassName(selector);
if (elms.length > 0) {
initFunction();
}
}
}
Serf.Util = {};
Serf.Util.isMobile = isMobile;
Serf.Util.runIfClassNamePresent = runIfClassNamePresent;
})();
}());

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,197 +0,0 @@
function graph_settings() {
return {
chart: {
type: 'spline'
},
title: {
text: null
},
xAxis: {
title: {
text: "Time (sec)",
}
},
yAxis: {
title: {
text: 'Convergence %'
},
min: 0.0,
max: 100.0
},
tooltip: {
formatter: function() {
return '<b>'+ (Math.round(this.y*1000.0)/1000.0) +'%</b><br/>'
}
},
legend: {
enabled: false
},
series: [{
name: 'Convergence Rate',
data: []
}]
}
}
function create_graph() {
$('#graph').highcharts(graph_settings())
return $('#graph').highcharts()
}
var Simulator = Class.$extend({
__init__ : function(graph, bytes, maxConverge) {
this.graph = graph
this.bytes = bytes
this.maxConverge = maxConverge
this.interval = 0.2
this.fanout = 3
this.nodes = 30
this.packetLoss = 0
this.nodeFail = 0
},
convergenceAtRound: function(x) {
var contact = (this.fanout / this.nodes) * (1 - this.packetLoss) * (1 - this.nodeFail) * 0.5
var numInf = this.nodes / (1 + (this.nodes+1) * Math.pow(Math.E, -1*contact*this.nodes*x))
return numInf / this.nodes
},
roundLength: function() {
return this.interval
},
seriesData: function() {
var data = []
var lastVal = 0
var round = 0
var roundLength = this.roundLength()
while (lastVal < this.maxConverge && round < 100) {
lastVal = this.convergenceAtRound(round)
data.push([round * roundLength, lastVal*100.0])
round++
}
return data
},
bytesUsed: function() {
var roundLength = this.roundLength()
var roundsPerSec = 1 / roundLength
var packetSize = 1400
var send = packetSize * this.fanout * roundsPerSec
return send * 2
},
draw: function() {
var data = this.seriesData()
this.graph.series[0].setData(data, false)
this.graph.redraw()
var kilobits = this.bytesUsed() * 8
var used = Math.round((kilobits / 1024) * 10) / 10
this.bytes.html(""+used)
}
})
function update_interval(elem, simulator) {
var val = elem.value
var interval = Number(val)
if (isNaN(interval)) {
alert("Gossip interval must be a number!")
return
}
if (interval <= 0) {
alert("Gossip interval must be a positive value!")
return
}
simulator.interval = interval
simulator.draw()
console.log("Redraw with interval set to: " + interval)
}
function update_fanout(elem, simulator) {
var val = elem.value
var fanout = Number(val)
if (isNaN(fanout)) {
alert("Gossip fanout must be a number!")
return
}
if (fanout <= 0) {
alert("Gossip fanout must be a positive value!")
return
}
simulator.fanout = fanout
simulator.draw()
console.log("Redraw with fanout set to: " + fanout)
}
function update_nodes(elem, simulator) {
var val = elem.value
var nodes = Number(val)
if (isNaN(nodes)) {
alert("Node count must be a number!")
return
}
if (nodes <= 1) {
alert("Must have at least one node")
return
}
simulator.nodes = nodes
simulator.draw()
console.log("Redraw with nodes set to: " + nodes)
}
function update_packetloss(elem, simulator) {
var val = elem.value
var pkt = Number(val)
if (isNaN(pkt)) {
alert("Packet loss must be a number!")
return
}
if (pkt < 0 || pkt >= 100) {
alert("Packet loss must be greater or equal to 0 and less than 100")
return
}
simulator.packetLoss = (pkt / 100.0)
simulator.draw()
console.log("Redraw with packet loss set to: " + pkt)
}
function update_failed(elem, simulator) {
var val = elem.value
var failed = Number(val)
if (isNaN(failed)) {
alert("Failure rate must be a number!")
return
}
if (failed < 0 || failed >= 100) {
alert("Failure rate must be greater or equal to 0 and less than 100")
return
}
simulator.nodeFail = (failed / 100.0)
simulator.draw()
console.log("Redraw with failure rate set to: " + failed)
}
// wait for dom ready
$(function(){
var bytes = $("#bytes")
var graph = create_graph()
var simulator = new Simulator(graph, bytes, 0.9999)
simulator.draw()
var interval = $("#interval")
interval.change(function() { update_interval(interval[0], simulator) })
var fanout = $("#fanout")
fanout.change(function() { update_fanout(fanout[0], simulator) })
var nodes = $("#nodes")
nodes.change(function() { update_nodes(nodes[0], simulator) })
var loss = $("#packetloss")
loss.change(function() { update_packetloss(loss[0], simulator) })
var failed = $("#failed")
failed.change(function() { update_failed(failed[0], simulator) })
})

View File

@ -8,8 +8,8 @@
</ul>
<ul class="buttons nav navbar-nav rls-sb">
<li class="first"><a href="/downloads.html">Download</a></li>
<li><a href="https://github.com/hashicorp/serf">Github</a></li>
<li class="first download outline-btn purple"><a href="/downloads.html">Download</a></li>
<li class="github outline-btn purple"><a href="https://github.com/hashicorp/serf">Github</a></li>
</ul>
</div>
<div class="footer-logo">
@ -17,16 +17,17 @@
</div>
<div class="footer-hashi os">
<span>© 2013. A <a href="http://www.hashicorp.com">HashiCorp</a> Project.</span>
<a href="http://www.hashicorp.com"><img src="/images/hashi-logo-s.png"></a>
<a href="http://www.hashicorp.com"><img src="/images/footer-hashicorp-logo.png"></a>
</div>
</div>
</div>
<script src="javascripts/lib/d3.v3.min.js"></script>
<script src="javascripts/lib/jquery-2.0.3.min.js"></script>
<script src="javascripts/lib/bootstrap.min.js"></script>
<script src="javascripts/app/deploy/site.js"></script>
<script>
Serf.initialize();
APP.initialize();
</script>
</body>

View File

@ -7,15 +7,20 @@
<meta name="author" content="">
<!-- <link rel="shortcut icon" href="../../assets/ico/favicon.png"> -->
<title><%= current_page.data.page_title ? "#{current_page.data.page_title} - " : "" %>Serf</title>
<title><%= current_page.data.page_title ? "#{current_page.data.page_title} - " : "" %>Consul</title>
<!-- Bootstrap core CSS -->
<%= stylesheet_link_tag "bootstrap.min" %>
<%= stylesheet_link_tag "main" %>
<!-- google fonts -->
<!-- <link href='http://fonts.googleapis.com/css?family=Raleway:200,400,600,800|Source+Sans+Pro:400,700' rel='stylesheet' type='text/css'>
<!-- <link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700' rel='stylesheet' type='text/css'>
-->
<!-- typekit -->
<script type="text/javascript" src="//use.typekit.net/kgv0shi.js"></script>
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<%= javascript_include_tag "html5shiv", "respond.min" %>
@ -35,23 +40,32 @@
</script>
</head>
<body class="page-<%= current_page.data.page_title ? "#{current_page.data.page_title}" : "home" %>">
<div id="header">
<div id="header" class="<%= current_page.data.page_title == "home" ? "" : "navbar-static-top" %>">
<div class="container">
<div class="navbar-header">
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand logo" href="/">
<span></span>
</a>
<a class="navbar-brand text rls-l" href="/">SERF</a>
</div>
<nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">
<ul class="buttons nav navbar-nav navbar-right rls-sb">
<li class="first"><a href="/downloads.html">Download</a></li>
<li><a href="https://github.com/hashicorp/serf">Github</a></li>
<li class="first download outline-btn"><a href="/downloads.html">Download</a></li>
<li class="github outline-btn"><a href="https://github.com/hashicorp/consul">Github</a></li>
</ul>
<ul class="main-links nav navbar-nav navbar-right rls-sb">
<li><a href="/intro/index.html">Intro</a></li>
<li class="first"><a href="/intro/index.html">Intro</a></li>
<li><a href="/docs/index.html">Docs</a></li>
<li><a href="/community.html">Community</a></li>
</ul>
</nav>
</div>
</div>

View File

@ -1,9 +1,10 @@
{
"name": "serf"
"name": "consul"
, "description": ""
, "version": "1.0.0"
, "devDependencies": {
"grunt": "~0.4.1"
, "grunt-contrib-less": "~0.11.0"
, "grunt-contrib-clean": "~0.5.0"
, "grunt-contrib-connect": "~0.3.0"
, "grunt-contrib-concat": "~0.3.0"

View File

@ -0,0 +1,27 @@
//
// Button Styles
// --------------------------------------------------
.outline-btn{
background-color: transparent;
color: @white;
border: 2px solid @white;
border-radius: @btn-border-radius;
text-decoration: none !important;
.transition(background-color .3s ease-in-out);
&.purple{
color: @purple;
border: 2px solid @purple;
}
&:hover{
color: @white;
background-color: rgba(255, 255, 255, .2);
.transition(background-color .3s ease-in-out);
&.purple{
background-color: rgba(255, 255, 255, .5);
}
}
}

View File

@ -55,7 +55,7 @@
left: -10px;
}
> a{
font-weight: @font-weight-rales-xb;
font-weight: @font-weight-museo-xb;
-webkit-font-smoothing: antialiased;
}
@ -75,8 +75,8 @@
> a {
text-transform: uppercase;
font-family: @font-family-rales;
font-weight: @font-weight-rales-sb;
font-family: @font-family-museo;
font-weight: @font-weight-museo-sb;
-webkit-font-smoothing: antialiased;
}
}

View File

@ -4,20 +4,20 @@
//light
.rls-l{
font-family: @font-family-rales;
font-weight: @font-weight-rales-xl;
font-family: @font-family-museo;
font-weight: @font-weight-museo-xl;
}
//semibold
.rls-sb{
font-family: @font-family-rales;
font-weight: @font-weight-rales-sb;
font-family: @font-family-museo;
font-weight: @font-weight-museo-sb;
}
//extrabold
.rls-xb{
font-family: @font-family-rales;
font-weight: @font-weight-rales-xb;
font-family: @font-family-museo;
font-weight: @font-weight-museo-xb;
}
.os{

View File

@ -14,16 +14,16 @@ body {
h1{
font-size: 42px;
line-height: 42px;
font-family: @font-family-rales;
font-weight: @font-weight-rales-sb;
font-family: @font-family-museo;
font-weight: @font-weight-museo-sb;
margin-bottom: 24px;
}
h3{
font-size: 28px;
line-height: 28px;
font-family: @font-family-rales;
font-weight: @font-weight-rales-sb;
font-family: @font-family-museo;
font-weight: @font-weight-museo-sb;
}
//an alternative color for buttons in the doc body

View File

@ -4,14 +4,32 @@
#footer,
#header {
.anti-alias();
position: relative;
color: @white;
background-color: @black;
text-rendering: optimizeLegibility;
margin-bottom: 0;
.navbar-collapse{
box-shadow: none;
}
&.navbar-static-top{
z-index: 1000;
}
a{
color: @white;
}
.navbar-toggle{
margin-top: 14px;
border: 2px solid @white;
.icon-bar{
border: 1px solid @white;
}
}
.navbar-brand {
&.logo{
padding: 13px 15px;
@ -19,27 +37,31 @@
span{
display: inline-block;
width: 52px;
height: 62px;
background: url(../images/logo-type-medium.png) 0 0 no-repeat;
.img-retina("../images/logo-type-medium.png", "../images/logo-type-medium@2x.png", 52px, 64px);
width: 179px;
height: 59px;
background: url(../images/consul-header-logo.png) 0 0 no-repeat;
.img-retina("../images/consul-header-logo.png", "../images/consul-header-logo@2x.png", 179px, 59px);
}
}
&.text{
font-size: 36px;
line-height: 62px;
letter-spacing: 14px;
text-shadow: @text-shadow;
}
}
.navbar-nav{
-webkit-font-smoothing: antialiased;
li > a {
font-size: 14px;
li{
position: relative;
> a {
font-size: 12px;
text-transform: uppercase;
letter-spacing: 3px;
padding-left: 22px;
}
&.first{
>a{
padding-left: 15px;
}
}
}
}
@ -49,47 +71,208 @@
.main-links.navbar-nav{
li + li a::before {
content: " | ";
content: "";
position: absolute;
left: 0;
top: 35px;
width: 4px;
height: 23px;
background: url(../images/nav-dotpipes.png) 0 0 no-repeat;
.img-retina("../images/nav-dotpipes.png", "../images/nav-dotpipes@2x.png", 4px, 23px);
padding-right: 15px;
}
li > a {
line-height: 62px;
text-shadow: @text-shadow;
}
}
.buttons.navbar-nav{
margin-top: 30px;
margin-top: 26px;
margin-left: 30px;
background-color: @red-dark;
border-radius: @btn-border-radius;
.box-shadow( @shadow );
li.first{
border-right: 2px solid @red-darker;
li{
&.first{
margin-right: 12px;
}
&.download{
a{
background: url(../images/icon-download.png) 8px 6px no-repeat;
.img-retina("../images/icon-download.png", "../images/icon-download@2x.png", 20px, 20px);
}
}
&.github{
a{
background: url(../images/icon-github.png) 8px 6px no-repeat;
.img-retina("../images/icon-github.png", "../images/icon-github@2x.png", 20px, 20px);
}
}
}
li > a {
padding-top: 6px;
padding-bottom: 6px;
padding-left: 40px;
}
}
}
#footer{
height: 700px;
text-align: center;
color: @purple;
.main-links.navbar-nav{
float: none;
display: inline-block;
padding-top: 155px;
}
.footer-hashi{
padding-top: 110px;
}
a{
color: @purple;
}
.buttons.navbar-nav{
float: none;
display: inline-block;
margin-bottom: 30px;
margin-top: 0px;
li{
&.first{
margin-right: 12px;
}
&.download{
a{
background: url(../images/icon-download-purple.png) 8px 6px no-repeat;
.img-retina("../images/icon-download-purple.png", "../images/icon-download-purple@2x.png", 20px, 20px);
}
}
&.github{
a{
background: url(../images/icon-github-purple.png) 8px 6px no-repeat;
.img-retina("../images/icon-github-purple.png", "../images/icon-github-purple@2x.png", 20px, 20px);
}
}
}
li > a {
padding-top: 6px;
padding-bottom: 6px;
padding-left: 40px;
}
}
}
@media (max-width: 992px) {
#header {
.navbar-brand {
&.logo{
span{
width: 120px;
height: 39px;
margin-top: 12px;
background-size: 120px 39px;
}
}
}
.buttons.navbar-nav{
li{
a{
background: none !important;
padding-left: 15px;
}
}
}
}
}
@media (max-width: 768px) {
#header{
background: #694a9c; /* Old browsers */
background: -moz-linear-gradient(left, #694a9c 0%, #cd2028 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#694a9c), color-stop(100%,#cd2028)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left, #694a9c 0%,#cd2028 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left, #694a9c 0%,#cd2028 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left, #694a9c 0%,#cd2028 100%); /* IE10+ */
background: linear-gradient(to right, #694a9c 0%,#cd2028 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#694a9c', endColorstr='#cd2028',GradientType=1 ); /* IE6-9 */
.navbar-right{
float: none !important;
}
.main-links.navbar-nav{
padding-bottom: 15px;
li{
margin-top: 15px;
}
li + li a::before {
display: none;
}
li > a {
padding: 0;
padding-left: 0;
line-height: 22px;
}
}
.navbar-brand {
&.logo{
span{
margin-top: 0;
}
}
}
.navbar-nav > li{
float: none;
}
.buttons.navbar-nav{
margin-top: 15px;
margin-left: 0px;
li{
a{
padding-left: 40px;
}
&.first{
margin-right: 0;
margin-bottom: 10px;
}
&.download{
a{
background: url(../images/icon-download.png) 8px 6px no-repeat !important;;
.img-retina("../images/icon-download.png", "../images/icon-download@2x.png", 20px, 20px);
}
}
&.github{
a{
background: url(../images/icon-github.png) 8px 6px no-repeat !important;;
.img-retina("../images/icon-github.png", "../images/icon-github@2x.png", 20px, 20px);
}
}
}
}
}
}
@media (max-width: 480px) {
}

View File

@ -4,47 +4,54 @@
#features{
.anti-alias();
padding: 90px 0 0 0;
padding: 130px 0 0 0;
background: #f8f8f8 url(../images/hero-dots-below@2x.png) center top no-repeat;
background-size: 1280px 49px;
.row{
padding: 0 0 90px 0;
.double-row{
padding: 0 0 60px 0;
}
h2{
font-size: 32px;
font-size: 24px;
letter-spacing: 2px;
color: @gray;
text-transform: uppercase;
font-family: @font-family-rales;
font-weight: @font-weight-rales-sb;
color: @purple;
font-family: @font-family-museo;
font-weight: @font-weight-museo-xb;
}
p{
font-size: 18px;
font-size: 16px;
letter-spacing: 1px;
line-height: 1.5em;
color: @gray-darker;
font-family: @font-family-open-sans;
font-weight: @font-weight-open;
color: @consul-gray;
font-family: @font-family-museo;
font-weight: @font-weight-museo-sb;
}
.icn{
display: block;
width: 286px;
height: 286px;
width: 186px;
height: 272px;
margin: 0 auto;
background-size: 286px 286px;
background-position: 0 0;
background-position: center 0;
background-repeat: no-repeat;
}
.icn1{
background-image: url( ../images/gossip-proto-icon@2x.png);
.discovery{
background-image: url( ../images/feature-discovery@2x.png);
background-size: 181px 181px;
}
.icn2{
background-image: url( ../images/failure-detect-icon@2x.png);
.health{
background-image: url( ../images/feature-health@2x.png);
background-size: 125px 179px;
}
.icn3{
background-image: url( ../images/custom-event-icon@2x.png);
.multi{
background-image: url( ../images/feature-multi@2x.png);
background-size: 182px 184px;
}
.config{
background-image: url( ../images/feature-config@2x.png);
background-size: 157px 179px;
}
}
@ -119,28 +126,22 @@
#footer{
padding: 50px 0;
background: @black url(../images/footer-pattern.jpg);
background-color: @consul-footer-gray;
background: @consul-footer-gray url(../images/consul-footer-logo.png) center center no-repeat;
.img-retina("../images/consul-footer-logo.png", "../images/consul-footer-logo@2x.png", 446px, 443px);
.footer-links{
margin-bottom: 20px;
}
.footer-logo{
span{
display: inline-block;
width: 206px;
height: 206px;
margin-bottom: 30px;
border-radius: 103px;
background: @black url(../images/logo-type-medium.png) center center no-repeat;
.img-retina("../images/logo-type-medium.png", "../images/logo-type-medium@2x.png", 72px, 94px);
.box-shadow( 0px 0px 5px rgba(0, 0, 0, 0.04) );
}
}
.footer-hashi{
letter-spacing: 2px;
margin-bottom: 30px;
a{
font-weight: @font-weight-museo-xb;
}
span{
margin-right: 20px;
}
@ -153,3 +154,21 @@
}
@media (max-width: 992px) {
#features{
.double-row{
padding: 0 0 0 0;
.row{
padding-bottom: 90px;
}
}
.icn{
height: 200px;
}
}
}
@media (max-width: 768px) {
}

View File

@ -2,15 +2,27 @@
// Jumbotron
// --------------------------------------------------
#jumbotron-mask{
overflow: hidden;
height: @jumbotron-total-height;
margin-top: -92px;
}
#jumbotron {
position: relative;
height: @jumbotron-height;
color: @jumbotron-color;
background-color: @gray-light;
height: @jumbotron-total-height;
padding-top: 0;
padding-bottom: 0;
overflow: hidden;
margin-top: -92px;
color: @jumbotron-color;
background: #694a9c; /* Old browsers */
background: -moz-linear-gradient(left, #694a9c 0%, #cd2028 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#694a9c), color-stop(100%,#cd2028)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left, #694a9c 0%,#cd2028 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left, #694a9c 0%,#cd2028 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left, #694a9c 0%,#cd2028 100%); /* IE10+ */
background: linear-gradient(to right, #694a9c 0%,#cd2028 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#694a9c', endColorstr='#cd2028',GradientType=1 ); /* IE6-9 */
&.mobile-hero{
background: transparent url( ../images/node-hero-pattern.jpg ) center center;
@ -18,32 +30,41 @@
background: -webkit-image-set( url('../images/node-hero-pattern.jpg') 1x, url('../images/node-hero-pattern@2x.jpg') 2x );
}
.jumbotron-dots{
position: absolute;
top: 0;
left: 0;
height: 632px;
width: 100%;
margin-top: -92px;
background: transparent url('../images/hero-dots.png') center @header-height no-repeat;
}
.container{
position: relative;
height: 100%;
margin-top: @header-height;
.jumbo-logo-wrap{
margin-top: 135px;
.jumbo-logo{
position: absolute;
bottom: 0;
right: -150px;
width: 726px;
height: 454px;
background: transparent url( ../images/logo-circle-logo@2x.png ) 0 0 no-repeat;
background-size: 726px 454px;
width: 318px;
height: 316px;
background: transparent url( ../images/consul-hero-logo@2x.png ) 0 0 no-repeat;
background-size: 318px 316px;
z-index: 20;
pointer-events: none;
}
.col-lg-5{
z-index: 20;
pointer-events: none;
}
h2{
margin-top: 140px;
font-size: 28px;
line-height: 38px;
letter-spacing: 2px;
margin-top: 190px;
font-size: 40px;
line-height: 48px;
letter-spacing: 1px;
margin-left: 40px;
}
}
}

View File

@ -1,53 +0,0 @@
//
// Node animation
// --------------------------------------------------
#node-canvas{
position: absolute;
top: 0;
width: 1400px;
background-color: transparent;
rect {
fill: none;
pointer-events: all;
}
.node {
/*fill: #a7a7a7;*/
fill: #939393;
stroke: #bbb;
z-index: 100;
transition-property: stroke fill;
transition-duration: 1s;
}
.node.active {
/*fill: #bbb; */
stroke: #dd4e58;
transition-property: stroke fill;
transition-duration: 1s;
}
.cursor {
fill: none;
stroke: brown;
pointer-events: none;
}
.link {
stroke: #bbb;
stroke-width: 1.5;
z-index: 0;
transition-property: stroke fill;
transition-duration: 1s;
}
.link.active{
stroke: #dd4e58;
transition-property: stroke;
transition-duration: 1s;
}
}

File diff suppressed because one or more lines are too long

View File

@ -6,7 +6,9 @@
// Global values
// --------------------------------------------------
@jumbotron-height: 490px;
@jumbotron-height: 540px;
@header-height: 92px;
@jumbotron-total-height: 542px; //jumbo+header
@jumbotron-color: #fff;
@btn-border-radius: 4px;
@el-border-radius: 6px;
@ -23,6 +25,9 @@
@red-dark: #c5454e;
@red-darker: #b03c44;
@tan: #f0f0e5;
@consul-gray: #909090;
@consul-footer-gray: #d7d4d7;
@purple: #69499a;
@btn-color: #4592C5;
@ -39,16 +44,14 @@
// Typography
// -------------------------
@font-family-rales: 'Raleway', "Helvetica Neue", Helvetica, Arial, sans-serif;
@font-family-museo: 'museo-sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
@font-family-open-sans: 'Source Sans Pro', "Helvetica Neue", Helvetica, Arial, sans-serif;
@font-weight-rales-xl: 200;
@font-weight-rales-reg: 400;
@font-weight-rales-sb: 600;
@font-weight-rales-xb: 800;
@font-weight-open: @font-weight-rales-reg;
@font-weight-museo-xl: 100;
@font-weight-museo-reg: 500;
@font-weight-museo-sb: 500;
@font-weight-museo-xb: 700;
@font-weight-open: @font-weight-museo-reg;
@text-shadow: 1px 1px 1px #000;
@shadow: @text-shadow;

14
website/source/stylesheets/bootstrap.min.css vendored Normal file → Executable file

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,782 @@
.rls-l {
font-family: 'museo-sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 100;
}
.rls-sb {
font-family: 'museo-sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 500;
}
.rls-xb {
font-family: 'museo-sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 700;
}
.os {
font-family: 'Source Sans Pro', "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 500;
}
/*html{
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
}*/
body {
font-size: 15px;
}
h1 {
font-size: 42px;
line-height: 42px;
font-family: 'museo-sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 500;
margin-bottom: 24px;
}
h3 {
font-size: 28px;
line-height: 28px;
font-family: 'museo-sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 500;
}
.btn-serf {
color: #ffffff !important;
background-color: #4592c5;
border-radius: 4px;
}
.highlight {
margin-bottom: 18px;
}
pre {
background-color: #242424;
color: #ffffff;
font-size: 14px;
font-weight: normal;
font-family: "Courier New", Monaco, Menlo, Consolas, monospace;
border: none;
padding: 20px;
margin-bottom: 0;
}
@media (max-width: 992px) {
.container {
max-width: 970px;
}
}
.navbar-nav {
margin: 0;
}
.navbar-right {
float: right !important;
}
.navbar-nav > li {
float: left;
}
.navbar-nav > li > a {
padding-top: 15px;
padding-bottom: 15px;
}
#footer,
#header {
-webkit-font-smoothing: antialiased;
position: relative;
color: #ffffff;
text-rendering: optimizeLegibility;
margin-bottom: 0;
}
#footer .navbar-collapse,
#header .navbar-collapse {
box-shadow: none;
}
#footer.navbar-static-top,
#header.navbar-static-top {
z-index: 1000;
}
#footer a,
#header a {
color: #ffffff;
}
#footer .navbar-toggle,
#header .navbar-toggle {
margin-top: 14px;
border: 2px solid #ffffff;
}
#footer .navbar-toggle .icon-bar,
#header .navbar-toggle .icon-bar {
border: 1px solid #ffffff;
}
#footer .navbar-brand.logo,
#header .navbar-brand.logo {
padding: 13px 15px;
line-height: 0;
}
#footer .navbar-brand.logo span,
#header .navbar-brand.logo span {
display: inline-block;
width: 179px;
height: 59px;
background: url(../images/consul-header-logo.png) 0 0 no-repeat;
background-image: url("../images/consul-header-logo.png");
background-size: 179px 59px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
#footer .navbar-brand.logo span,
#header .navbar-brand.logo span {
background-image: url("../images/consul-header-logo@2x.png");
background-size: 179px 59px;
}
}
#footer .navbar-nav,
#header .navbar-nav {
-webkit-font-smoothing: antialiased;
}
#footer .navbar-nav li,
#header .navbar-nav li {
position: relative;
}
#footer .navbar-nav li > a,
#header .navbar-nav li > a {
font-size: 12px;
text-transform: uppercase;
letter-spacing: 3px;
padding-left: 22px;
}
#footer .navbar-nav li.first > a,
#header .navbar-nav li.first > a {
padding-left: 15px;
}
#footer .nav > li > a:hover,
#header .nav > li > a:hover,
#footer .nav > li > a:focus,
#header .nav > li > a:focus {
background-color: transparent;
}
#footer .main-links.navbar-nav li + li a::before,
#header .main-links.navbar-nav li + li a::before {
content: "";
position: absolute;
left: 0;
top: 35px;
width: 4px;
height: 23px;
background: url(../images/nav-dotpipes.png) 0 0 no-repeat;
background-image: url("../images/nav-dotpipes.png");
background-size: 4px 23px;
padding-right: 15px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
#footer .main-links.navbar-nav li + li a::before,
#header .main-links.navbar-nav li + li a::before {
background-image: url("../images/nav-dotpipes@2x.png");
background-size: 4px 23px;
}
}
#footer .main-links.navbar-nav li > a,
#header .main-links.navbar-nav li > a {
line-height: 62px;
}
#footer .buttons.navbar-nav,
#header .buttons.navbar-nav {
margin-top: 26px;
margin-left: 30px;
}
#footer .buttons.navbar-nav li.first,
#header .buttons.navbar-nav li.first {
margin-right: 12px;
}
#footer .buttons.navbar-nav li.download a,
#header .buttons.navbar-nav li.download a {
background: url(../images/icon-download.png) 8px 6px no-repeat;
background-image: url("../images/icon-download.png");
background-size: 20px 20px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
#footer .buttons.navbar-nav li.download a,
#header .buttons.navbar-nav li.download a {
background-image: url("../images/icon-download@2x.png");
background-size: 20px 20px;
}
}
#footer .buttons.navbar-nav li.github a,
#header .buttons.navbar-nav li.github a {
background: url(../images/icon-github.png) 8px 6px no-repeat;
background-image: url("../images/icon-github.png");
background-size: 20px 20px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
#footer .buttons.navbar-nav li.github a,
#header .buttons.navbar-nav li.github a {
background-image: url("../images/icon-github@2x.png");
background-size: 20px 20px;
}
}
#footer .buttons.navbar-nav li > a,
#header .buttons.navbar-nav li > a {
padding-top: 6px;
padding-bottom: 6px;
padding-left: 40px;
}
#footer {
height: 700px;
text-align: center;
color: #69499a;
}
#footer .main-links.navbar-nav {
float: none;
display: inline-block;
padding-top: 155px;
}
#footer .footer-hashi {
padding-top: 110px;
}
#footer a {
color: #69499a;
}
#footer .buttons.navbar-nav {
float: none;
display: inline-block;
margin-bottom: 30px;
margin-top: 0px;
}
#footer .buttons.navbar-nav li.first {
margin-right: 12px;
}
#footer .buttons.navbar-nav li.download a {
background: url(../images/icon-download-purple.png) 8px 6px no-repeat;
background-image: url("../images/icon-download-purple.png");
background-size: 20px 20px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
#footer .buttons.navbar-nav li.download a {
background-image: url("../images/icon-download-purple@2x.png");
background-size: 20px 20px;
}
}
#footer .buttons.navbar-nav li.github a {
background: url(../images/icon-github-purple.png) 8px 6px no-repeat;
background-image: url("../images/icon-github-purple.png");
background-size: 20px 20px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
#footer .buttons.navbar-nav li.github a {
background-image: url("../images/icon-github-purple@2x.png");
background-size: 20px 20px;
}
}
#footer .buttons.navbar-nav li > a {
padding-top: 6px;
padding-bottom: 6px;
padding-left: 40px;
}
@media (max-width: 992px) {
#header .navbar-brand.logo span {
width: 120px;
height: 39px;
margin-top: 12px;
background-size: 120px 39px;
}
#header .buttons.navbar-nav li a {
background: none !important;
padding-left: 15px;
}
}
@media (max-width: 768px) {
#header {
background: #694a9c;
/* Old browsers */
background: -moz-linear-gradient(left, #694a9c 0%, #cd2028 100%);
/* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%, #694a9c), color-stop(100%, #cd2028));
/* Chrome,Safari4+ */
background: -webkit-linear-gradient(left, #694a9c 0%, #cd2028 100%);
/* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left, #694a9c 0%, #cd2028 100%);
/* Opera 11.10+ */
background: -ms-linear-gradient(left, #694a9c 0%, #cd2028 100%);
/* IE10+ */
background: linear-gradient(to right, #694a9c 0%, #cd2028 100%);
/* W3C */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#694a9c', endColorstr='#cd2028', GradientType=1);
/* IE6-9 */
}
#header .navbar-right {
float: none !important;
}
#header .main-links.navbar-nav {
padding-bottom: 15px;
}
#header .main-links.navbar-nav li {
margin-top: 15px;
}
#header .main-links.navbar-nav li + li a::before {
display: none;
}
#header .main-links.navbar-nav li > a {
padding: 0;
padding-left: 0;
line-height: 22px;
}
#header .navbar-brand.logo span {
margin-top: 0;
}
#header .navbar-nav > li {
float: none;
}
#header .buttons.navbar-nav {
margin-top: 15px;
margin-left: 0px;
}
#header .buttons.navbar-nav li a {
padding-left: 40px;
}
#header .buttons.navbar-nav li.first {
margin-right: 0;
margin-bottom: 10px;
}
#header .buttons.navbar-nav li.download a {
background: url(../images/icon-download.png) 8px 6px no-repeat !important;
background-image: url("../images/icon-download.png");
background-size: 20px 20px;
}
#header .buttons.navbar-nav li.github a {
background: url(../images/icon-github.png) 8px 6px no-repeat !important;
background-image: url("../images/icon-github.png");
background-size: 20px 20px;
}
}
@media (max-width: 768px) and only screen and (-webkit-min-device-pixel-ratio: 2), (max-width: 768px) and only screen and (min--moz-device-pixel-ratio: 2), (max-width: 768px) and only screen and (-o-min-device-pixel-ratio: 2/1), (max-width: 768px) and only screen and (min-device-pixel-ratio: 2), (max-width: 768px) and only screen and (min-resolution: 192dpi), (max-width: 768px) and only screen and (min-resolution: 2dppx) {
#header .buttons.navbar-nav li.download a {
background-image: url("../images/icon-download@2x.png");
background-size: 20px 20px;
}
}
@media (max-width: 768px) and only screen and (-webkit-min-device-pixel-ratio: 2), (max-width: 768px) and only screen and (min--moz-device-pixel-ratio: 2), (max-width: 768px) and only screen and (-o-min-device-pixel-ratio: 2/1), (max-width: 768px) and only screen and (min-device-pixel-ratio: 2), (max-width: 768px) and only screen and (min-resolution: 192dpi), (max-width: 768px) and only screen and (min-resolution: 2dppx) {
#header .buttons.navbar-nav li.github a {
background-image: url("../images/icon-github@2x.png");
background-size: 20px 20px;
}
}
#jumbotron-mask {
overflow: hidden;
height: 542px;
margin-top: -92px;
}
#jumbotron {
position: relative;
height: 542px;
padding-top: 0;
padding-bottom: 0;
margin-top: -92px;
color: #ffffff;
background: #694a9c;
/* Old browsers */
background: -moz-linear-gradient(left, #694a9c 0%, #cd2028 100%);
/* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%, #694a9c), color-stop(100%, #cd2028));
/* Chrome,Safari4+ */
background: -webkit-linear-gradient(left, #694a9c 0%, #cd2028 100%);
/* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left, #694a9c 0%, #cd2028 100%);
/* Opera 11.10+ */
background: -ms-linear-gradient(left, #694a9c 0%, #cd2028 100%);
/* IE10+ */
background: linear-gradient(to right, #694a9c 0%, #cd2028 100%);
/* W3C */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#694a9c', endColorstr='#cd2028', GradientType=1);
/* IE6-9 */
}
#jumbotron.mobile-hero {
background: transparent url(../images/node-hero-pattern.jpg ) center center;
background-size: 320px 320px;
background: -webkit-image-set(url('../images/node-hero-pattern.jpg') 1x, url('../images/node-hero-pattern@2x.jpg') 2x);
}
#jumbotron .jumbotron-dots {
position: absolute;
top: 0;
left: 0;
height: 632px;
width: 100%;
margin-top: -92px;
background: transparent url('../images/hero-dots.png') center 92px no-repeat;
}
#jumbotron .container {
position: relative;
height: 100%;
margin-top: 92px;
}
#jumbotron .container .jumbo-logo-wrap {
margin-top: 135px;
}
#jumbotron .container .jumbo-logo-wrap .jumbo-logo {
width: 318px;
height: 316px;
background: transparent url(../images/consul-hero-logo@2x.png ) 0 0 no-repeat;
background-size: 318px 316px;
z-index: 20;
}
#jumbotron .container h2 {
margin-top: 190px;
font-size: 40px;
line-height: 48px;
letter-spacing: 1px;
margin-left: 40px;
}
@media (min-width: 992px) {
.jumbotron .container .jumbo-logo {
right: -150px;
}
}
@media (min-width: 1200px) {
.jumbotron .container .jumbo-logo {
right: -120px;
}
}
.outline-btn {
background-color: transparent;
color: #ffffff;
border: 2px solid #ffffff;
border-radius: 4px;
text-decoration: none !important;
-webkit-transition: background-color 0.3s ease-in-out;
transition: background-color 0.3s ease-in-out;
}
.outline-btn.purple {
color: #69499a;
border: 2px solid #69499a;
}
.outline-btn:hover {
color: #ffffff;
background-color: rgba(255, 255, 255, 0.2);
-webkit-transition: background-color 0.3s ease-in-out;
transition: background-color 0.3s ease-in-out;
}
.outline-btn:hover.purple {
background-color: rgba(255, 255, 255, 0.5);
}
#features {
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
padding: 130px 0 0 0;
background: #f8f8f8 url(../images/hero-dots-below@2x.png) center top no-repeat;
background-size: 1280px 49px;
}
#features .double-row {
padding: 0 0 60px 0;
}
#features h2 {
font-size: 24px;
letter-spacing: 2px;
color: #69499a;
font-family: 'museo-sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 700;
}
#features p {
font-size: 16px;
letter-spacing: 1px;
line-height: 1.5em;
color: #909090;
font-family: 'museo-sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 500;
}
#features .icn {
display: block;
width: 186px;
height: 272px;
margin: 0 auto;
background-position: center 0;
background-repeat: no-repeat;
}
#features .discovery {
background-image: url(../images/feature-discovery@2x.png);
background-size: 181px 181px;
}
#features .health {
background-image: url(../images/feature-health@2x.png);
background-size: 125px 179px;
}
#features .multi {
background-image: url(../images/feature-multi@2x.png);
background-size: 182px 184px;
}
#features .config {
background-image: url(../images/feature-config@2x.png);
background-size: 157px 179px;
}
#trusted {
background-color: #242424;
padding: 140px 0;
}
#trusted h3 {
margin-bottom: 60px;
color: #ffffff;
text-transform: uppercase;
font-size: 18px;
text-align: center;
}
#trusted .trusted-items {
width: 800px;
margin: 0 auto;
}
#trusted .trusted-items ul {
padding: 0;
}
#trusted .trusted-items ul > li {
display: inline-block;
float: left;
width: 25%;
height: 80px;
margin: 12px 0;
background: url(../images/trusted-sprite.png ) 0 0 no-repeat;
}
#trusted .trusted-items ul > li#i0 {
background-position: 0 0;
}
#trusted .trusted-items ul > li#i1 {
background-position: 0 -80px;
}
#trusted .trusted-items ul > li#i2 {
background-position: 0 -160px;
}
#trusted .trusted-items ul > li#i3 {
background-position: 0 -240px;
}
#trusted .trusted-items ul > li#i4 {
background-position: 0 -320px;
}
#trusted .trusted-items ul > li#i5 {
background-position: 0 -400px;
}
#trusted .trusted-items ul > li#i6 {
background-position: 0 -480px;
}
#trusted .trusted-items ul > li#i7 {
background-position: 0 -560px;
}
#trusted .trusted-items ul > li#i8 {
background-position: 0 -640px;
}
#trusted .trusted-items ul > li#i9 {
background-position: 0 -720px;
}
#trusted .trusted-items ul > li#i10 {
background-position: 0 -800px;
}
#trusted .trusted-items ul > li#i11 {
background-position: 0 -880px;
}
#footer {
padding: 50px 0;
background-color: #d7d4d7;
background: #d7d4d7 url(../images/consul-footer-logo.png) center center no-repeat;
background-image: url("../images/consul-footer-logo.png");
background-size: 446px 443px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
#footer {
background-image: url("../images/consul-footer-logo@2x.png");
background-size: 446px 443px;
}
}
#footer .footer-links {
margin-bottom: 20px;
}
#footer .footer-hashi {
letter-spacing: 2px;
margin-bottom: 30px;
}
#footer .footer-hashi a {
font-weight: 700;
}
#footer .footer-hashi span {
margin-right: 20px;
}
#footer .footer-hashi img {
display: inline-block;
width: 37px;
height: 40px;
}
@media (max-width: 992px) {
#features .double-row {
padding: 0 0 0 0;
}
#features .double-row .row {
padding-bottom: 90px;
}
#features .icn {
height: 200px;
}
}
.people {
margin-top: 30px;
}
.people .person {
margin-bottom: 40px;
}
.people .person h3 {
text-transform: none;
}
.people .person .bio {
padding-left: 150px;
}
.docs-sidebar {
margin-bottom: 30px;
margin-top: 50px;
margin-right: 4%;
background-color: #f0f0e5;
border-radius: 6px;
}
.docs-sidebar a {
color: #242424;
}
.docs-sidebar .docs-sidenav {
padding-top: 15px;
padding-bottom: 15px;
}
.docs-sidebar .docs-sidenav :last-child {
border-bottom: none;
}
.docs-sidebar .docs-sidenav li {
position: relative;
}
.docs-sidebar .docs-sidenav li > a {
-webkit-transition: color 0.5s ease;
transition: color 0.5s ease;
}
.docs-sidebar .docs-sidenav li > a:hover,
.docs-sidebar .docs-sidenav li > a:focus {
background-color: transparent !important;
color: #c5454e;
-webkit-transition: color 0.5s ease;
transition: color 0.5s ease;
}
.docs-sidebar .docs-sidenav > li {
padding: 10px 0;
margin: 0 30px;
border-bottom: 1px solid #fff;
}
.docs-sidebar .docs-sidenav > li.active:before {
content: '';
position: absolute;
width: 8px;
height: 8px;
background-color: #dd4e58;
border-radius: 4px;
top: 26px;
left: -10px;
}
.docs-sidebar .docs-sidenav > li.active > a {
font-weight: 700;
-webkit-font-smoothing: antialiased;
}
.docs-sidebar .docs-sidenav > li.active > a:hover,
.docs-sidebar .docs-sidenav > li.active > a:focus {
color: #242424;
}
.docs-sidebar .docs-sidenav > li.active .nav {
display: block;
}
.docs-sidebar .docs-sidenav > li.active .nav li.active a {
color: #dd4e58;
}
.docs-sidebar .docs-sidenav > li > a {
text-transform: uppercase;
font-family: 'museo-sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 500;
-webkit-font-smoothing: antialiased;
}
.docs-sidebar .docs-sidenav .nav {
display: none;
margin-bottom: 15px;
}
.docs-sidebar .docs-sidenav .nav > li {
margin-left: 20px;
}
.docs-sidebar .docs-sidenav .nav > li > a {
-webkit-font-smoothing: antialiased;
font-family: 'Source Sans Pro', "Helvetica Neue", Helvetica, Arial, sans-serif;
padding: 6px 15px;
}
.bs-docs-section {
padding-top: 10px;
padding-left: 3%;
padding-bottom: 80px;
}
.bs-docs-section .lead {
margin-bottom: 48px;
}
.bs-docs-section .doc-sectional {
margin-bottom: 48px;
}
.bs-docs-section p,
.bs-docs-section li,
.bs-docs-section .alert {
font-size: 20px;
font-family: 'Source Sans Pro', "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 500;
line-height: 1.5em;
margin: 0 0 18px;
-webkit-font-smoothing: antialiased;
}
.bs-docs-section pre {
margin: 0 0 18px;
}
.bs-docs-section a {
color: #b03c44;
}
.bs-docs-section a:hover {
text-decoration: underline;
}
.bs-docs-section h1 {
padding-bottom: 24px;
margin-top: 40px;
margin-bottom: 24px;
border-bottom: 1px solid #eeeeee;
}
.bs-docs-section h2,
.bs-docs-section h3,
.bs-docs-section h4 {
margin-bottom: 16px;
}
.bs-docs-section #graph {
margin-top: 30px;
}
.downloads {
margin-top: 20px;
}
.downloads .description {
margin-bottom: 20px;
}
.downloads .download {
border-bottom: 1px solid #b2b2b2;
padding-bottom: 15px;
margin-top: 10px;
margin-bottom: 10px;
}
.downloads .download .details {
padding-left: 95px;
}
.downloads .download .details h2 {
margin-top: 0px;
}
.downloads .download .details ul {
padding-left: 0px;
}
.downloads .download .details li {
display: inline-block;
}
.downloads .download .details li:after {
content: " | ";
}
.downloads .download .details li:last-child:after {
content: "";
}
.downloads .download .icon img {
width: 75px;
}
.downloads .download .os-name {
font-size: 40px;
margin-bottom: -3px;
}
.downloads .poweredby {
margin-top: 20px;
}
.downloads .poweredby img {
display: block;
margin: 0 auto;
width: 122px;
}
/*@import "modals.less";*/

View File

@ -14,7 +14,7 @@
// Components
@import "_header";
@import "_jumbotron";
@import "_nodes";
@import "_buttons";
// Pages
@import "_home";
@ -24,5 +24,3 @@
// Components w/ JavaScript
/*@import "modals.less";*/