website: initial import
2
website/.buildpacks
Normal file
@@ -0,0 +1,2 @@
|
||||
https://github.com/heroku/heroku-buildpack-ruby.git
|
||||
https://github.com/hashicorp/heroku-buildpack-middleman.git
|
||||
3
website/Gemfile
Normal file
@@ -0,0 +1,3 @@
|
||||
source 'https://rubygems.org'
|
||||
|
||||
gem 'middleman-hashicorp', git: 'https://github.com/hashicorp/middleman-hashicorp'
|
||||
177
website/Gemfile.lock
Normal file
@@ -0,0 +1,177 @@
|
||||
GIT
|
||||
remote: https://github.com/hashicorp/middleman-hashicorp
|
||||
revision: 783fe9517dd02badb85e5ddfeda4d8e35bbd05a8
|
||||
specs:
|
||||
middleman-hashicorp (0.1.0)
|
||||
bootstrap-sass (~> 3.3)
|
||||
builder (~> 3.2)
|
||||
less (~> 2.6)
|
||||
middleman (~> 3.3)
|
||||
middleman-livereload (~> 3.4)
|
||||
middleman-minify-html (~> 3.4)
|
||||
middleman-syntax (~> 2.0)
|
||||
rack-contrib (~> 1.2)
|
||||
rack-rewrite (~> 1.5)
|
||||
rack-ssl-enforcer (~> 0.2)
|
||||
redcarpet (~> 3.2)
|
||||
therubyracer (~> 0.12)
|
||||
thin (~> 1.6)
|
||||
|
||||
GEM
|
||||
remote: https://rubygems.org/
|
||||
specs:
|
||||
activesupport (4.1.9)
|
||||
i18n (~> 0.6, >= 0.6.9)
|
||||
json (~> 1.7, >= 1.7.7)
|
||||
minitest (~> 5.1)
|
||||
thread_safe (~> 0.1)
|
||||
tzinfo (~> 1.1)
|
||||
autoprefixer-rails (5.1.7)
|
||||
execjs
|
||||
json
|
||||
bootstrap-sass (3.3.3)
|
||||
autoprefixer-rails (>= 5.0.0.1)
|
||||
sass (>= 3.2.19)
|
||||
builder (3.2.2)
|
||||
celluloid (0.16.0)
|
||||
timers (~> 4.0.0)
|
||||
chunky_png (1.3.4)
|
||||
coffee-script (2.3.0)
|
||||
coffee-script-source
|
||||
execjs
|
||||
coffee-script-source (1.9.1)
|
||||
commonjs (0.2.7)
|
||||
compass (1.0.3)
|
||||
chunky_png (~> 1.2)
|
||||
compass-core (~> 1.0.2)
|
||||
compass-import-once (~> 1.0.5)
|
||||
rb-fsevent (>= 0.9.3)
|
||||
rb-inotify (>= 0.9)
|
||||
sass (>= 3.3.13, < 3.5)
|
||||
compass-core (1.0.3)
|
||||
multi_json (~> 1.0)
|
||||
sass (>= 3.3.0, < 3.5)
|
||||
compass-import-once (1.0.5)
|
||||
sass (>= 3.2, < 3.5)
|
||||
daemons (1.1.9)
|
||||
em-websocket (0.5.1)
|
||||
eventmachine (>= 0.12.9)
|
||||
http_parser.rb (~> 0.6.0)
|
||||
erubis (2.7.0)
|
||||
eventmachine (1.0.7)
|
||||
execjs (2.4.0)
|
||||
ffi (1.9.6)
|
||||
haml (4.0.6)
|
||||
tilt
|
||||
hike (1.2.3)
|
||||
hitimes (1.2.2)
|
||||
hooks (0.4.0)
|
||||
uber (~> 0.0.4)
|
||||
htmlcompressor (0.1.2)
|
||||
http_parser.rb (0.6.0)
|
||||
i18n (0.7.0)
|
||||
json (1.8.2)
|
||||
kramdown (1.6.0)
|
||||
less (2.6.0)
|
||||
commonjs (~> 0.2.7)
|
||||
libv8 (3.16.14.7)
|
||||
listen (2.8.5)
|
||||
celluloid (>= 0.15.2)
|
||||
rb-fsevent (>= 0.9.3)
|
||||
rb-inotify (>= 0.9)
|
||||
middleman (3.3.10)
|
||||
coffee-script (~> 2.2)
|
||||
compass (>= 1.0.0, < 2.0.0)
|
||||
compass-import-once (= 1.0.5)
|
||||
execjs (~> 2.0)
|
||||
haml (>= 4.0.5)
|
||||
kramdown (~> 1.2)
|
||||
middleman-core (= 3.3.10)
|
||||
middleman-sprockets (>= 3.1.2)
|
||||
sass (>= 3.4.0, < 4.0)
|
||||
uglifier (~> 2.5)
|
||||
middleman-core (3.3.10)
|
||||
activesupport (~> 4.1.0)
|
||||
bundler (~> 1.1)
|
||||
erubis
|
||||
hooks (~> 0.3)
|
||||
i18n (~> 0.7.0)
|
||||
listen (>= 2.7.9, < 3.0)
|
||||
padrino-helpers (~> 0.12.3)
|
||||
rack (>= 1.4.5, < 2.0)
|
||||
rack-test (~> 0.6.2)
|
||||
thor (>= 0.15.2, < 2.0)
|
||||
tilt (~> 1.4.1, < 2.0)
|
||||
middleman-livereload (3.4.2)
|
||||
em-websocket (~> 0.5.1)
|
||||
middleman-core (>= 3.3)
|
||||
rack-livereload (~> 0.3.15)
|
||||
middleman-minify-html (3.4.0)
|
||||
htmlcompressor (~> 0.1.0)
|
||||
middleman-core (>= 3.2)
|
||||
middleman-sprockets (3.4.2)
|
||||
middleman-core (>= 3.3)
|
||||
sprockets (~> 2.12.1)
|
||||
sprockets-helpers (~> 1.1.0)
|
||||
sprockets-sass (~> 1.3.0)
|
||||
middleman-syntax (2.0.0)
|
||||
middleman-core (~> 3.2)
|
||||
rouge (~> 1.0)
|
||||
minitest (5.5.1)
|
||||
multi_json (1.11.0)
|
||||
padrino-helpers (0.12.5)
|
||||
i18n (~> 0.6, >= 0.6.7)
|
||||
padrino-support (= 0.12.5)
|
||||
tilt (~> 1.4.1)
|
||||
padrino-support (0.12.5)
|
||||
activesupport (>= 3.1)
|
||||
rack (1.6.0)
|
||||
rack-contrib (1.2.0)
|
||||
rack (>= 0.9.1)
|
||||
rack-livereload (0.3.15)
|
||||
rack
|
||||
rack-rewrite (1.5.1)
|
||||
rack-ssl-enforcer (0.2.8)
|
||||
rack-test (0.6.3)
|
||||
rack (>= 1.0)
|
||||
rb-fsevent (0.9.4)
|
||||
rb-inotify (0.9.5)
|
||||
ffi (>= 0.5.0)
|
||||
redcarpet (3.2.2)
|
||||
ref (1.0.5)
|
||||
rouge (1.8.0)
|
||||
sass (3.4.13)
|
||||
sprockets (2.12.3)
|
||||
hike (~> 1.2)
|
||||
multi_json (~> 1.0)
|
||||
rack (~> 1.0)
|
||||
tilt (~> 1.1, != 1.3.0)
|
||||
sprockets-helpers (1.1.0)
|
||||
sprockets (~> 2.0)
|
||||
sprockets-sass (1.3.1)
|
||||
sprockets (~> 2.0)
|
||||
tilt (~> 1.1)
|
||||
therubyracer (0.12.1)
|
||||
libv8 (~> 3.16.14.0)
|
||||
ref
|
||||
thin (1.6.3)
|
||||
daemons (~> 1.0, >= 1.0.9)
|
||||
eventmachine (~> 1.0)
|
||||
rack (~> 1.0)
|
||||
thor (0.19.1)
|
||||
thread_safe (0.3.4)
|
||||
tilt (1.4.1)
|
||||
timers (4.0.1)
|
||||
hitimes
|
||||
tzinfo (1.2.2)
|
||||
thread_safe (~> 0.1)
|
||||
uber (0.0.13)
|
||||
uglifier (2.7.1)
|
||||
execjs (>= 0.3.0)
|
||||
json (>= 1.8.0)
|
||||
|
||||
PLATFORMS
|
||||
ruby
|
||||
|
||||
DEPENDENCIES
|
||||
middleman-hashicorp!
|
||||
10
website/LICENSE.md
Normal file
@@ -0,0 +1,10 @@
|
||||
# Proprietary License
|
||||
|
||||
This license is temporary while a more official one is drafted. However,
|
||||
this should make it clear:
|
||||
|
||||
* The text contents of this website are MPL 2.0 licensed.
|
||||
|
||||
* The design contents of this website are proprietary and may not be reproduced
|
||||
or reused in any way other than to run the Vault website locally. The license
|
||||
for the design is owned solely by HashiCorp, Inc.
|
||||
1
website/Procfile
Normal file
@@ -0,0 +1 @@
|
||||
web: bundle exec thin start -p $PORT
|
||||
24
website/README.md
Normal file
@@ -0,0 +1,24 @@
|
||||
# Vault Website
|
||||
|
||||
This subdirectory contains the entire source for the [Vault Website](http://www.vault.io).
|
||||
This is a [Middleman](http://middlemanapp.com) project, which builds a static
|
||||
site from these source files.
|
||||
|
||||
## Contributions Welcome!
|
||||
|
||||
If you find a typo or you feel like you can improve the HTML, CSS, or
|
||||
JavaScript, we welcome contributions. Feel free to open issues or pull
|
||||
requests like any normal GitHub project, and we'll merge it in.
|
||||
|
||||
## Running the Site Locally
|
||||
|
||||
Running the site locally is simple. Clone this repo and run the following
|
||||
commands:
|
||||
|
||||
```
|
||||
$ bundle
|
||||
$ bundle exec middleman server
|
||||
```
|
||||
|
||||
Then open up `http://localhost:4567`. Note that some URLs you may need to append
|
||||
".html" to make them work (in the navigation).
|
||||
38
website/Vagrantfile
vendored
Normal file
@@ -0,0 +1,38 @@
|
||||
# -*- mode: ruby -*-
|
||||
# vi: set ft=ruby :
|
||||
|
||||
# Vagrantfile API/syntax version. Don't touch unless you know what you're doing!
|
||||
VAGRANTFILE_API_VERSION = "2"
|
||||
|
||||
$script = <<SCRIPT
|
||||
sudo apt-get -y update
|
||||
|
||||
# RVM/Ruby
|
||||
sudo apt-get -y install curl
|
||||
curl -sSL https://get.rvm.io | bash -s stable
|
||||
. ~/.bashrc
|
||||
. ~/.bash_profile
|
||||
rvm install 2.0.0
|
||||
rvm --default use 2.0.0
|
||||
|
||||
# Middleman deps
|
||||
cd /vagrant
|
||||
bundle
|
||||
|
||||
# JS stuff
|
||||
sudo apt-get install -y python-software-properties
|
||||
sudo add-apt-repository -y ppa:chris-lea/node.js
|
||||
sudo apt-get update -y
|
||||
sudo apt-get install -y nodejs
|
||||
|
||||
# Get JS deps
|
||||
cd /vagrant/source
|
||||
npm install
|
||||
SCRIPT
|
||||
|
||||
Vagrant.configure(VAGRANTFILE_API_VERSION) do |config|
|
||||
config.vm.box = "chef/ubuntu-12.04"
|
||||
config.vm.network "private_network", ip: "33.33.30.10"
|
||||
config.vm.provision "shell", inline: $script, privileged: false
|
||||
config.vm.synced_folder ".", "/vagrant", type: "rsync"
|
||||
end
|
||||
12
website/config.rb
Normal file
@@ -0,0 +1,12 @@
|
||||
#-------------------------------------------------------------------------
|
||||
# Configure Middleman
|
||||
#-------------------------------------------------------------------------
|
||||
|
||||
set :base_url, "https://www.vault.io/"
|
||||
|
||||
activate :hashicorp do |h|
|
||||
h.version = ENV['VAULT_VERSION']
|
||||
h.bintray_repo = 'mitchellh/vault'
|
||||
h.bintray_user = 'mitchellh'
|
||||
h.bintray_key = ENV['BINTRAY_API_KEY']
|
||||
end
|
||||
27
website/config.ru
Normal file
@@ -0,0 +1,27 @@
|
||||
require "rack"
|
||||
require "rack/contrib/not_found"
|
||||
require "rack/contrib/response_headers"
|
||||
require "rack/contrib/static_cache"
|
||||
require "rack/contrib/try_static"
|
||||
|
||||
# Properly compress the output if the client can handle it.
|
||||
use Rack::Deflater
|
||||
|
||||
# Set the "forever expire" cache headers for these static assets. Since
|
||||
# we hash the contents of the assets to determine filenames, this is safe
|
||||
# to do.
|
||||
use Rack::StaticCache,
|
||||
:root => "build",
|
||||
:urls => ["/images", "/javascripts", "/stylesheets"],
|
||||
:duration => 2,
|
||||
:versioning => false
|
||||
|
||||
# Try to find a static file that matches our request, since Middleman
|
||||
# statically generates everything.
|
||||
use Rack::TryStatic,
|
||||
:root => "build",
|
||||
:urls => ["/"],
|
||||
:try => [".html", "index.html", "/index.html"]
|
||||
|
||||
# 404 if we reached this point. Sad times.
|
||||
run Rack::NotFound.new(File.expand_path("../build/404.html", __FILE__))
|
||||
12
website/helpers/sidebar_helpers.rb
Normal file
@@ -0,0 +1,12 @@
|
||||
module SidebarHelpers
|
||||
# This helps by setting the "active" class for sidebar nav elements
|
||||
# if the YAML frontmatter matches the expected value.
|
||||
def sidebar_current(expected)
|
||||
current = current_page.data.sidebar_current || ""
|
||||
if current.start_with?(expected)
|
||||
return " class=\"active\""
|
||||
else
|
||||
return ""
|
||||
end
|
||||
end
|
||||
end
|
||||
2
website/source/.gitignore
vendored
Normal file
@@ -0,0 +1,2 @@
|
||||
# Source folder
|
||||
node_modules/
|
||||
5
website/source/404.html.erb
Normal file
@@ -0,0 +1,5 @@
|
||||
---
|
||||
noindex: true
|
||||
---
|
||||
|
||||
<h2>Page Not Found</h2>
|
||||
BIN
website/source/assets/images/bg-icons.png
Normal file
|
After Width: | Height: | Size: 12 KiB |
BIN
website/source/assets/images/bg-icons@2x.png
Normal file
|
After Width: | Height: | Size: 34 KiB |
BIN
website/source/assets/images/graphic-audit.png
Normal file
|
After Width: | Height: | Size: 13 KiB |
BIN
website/source/assets/images/graphic-audit@2x.png
Normal file
|
After Width: | Height: | Size: 27 KiB |
BIN
website/source/assets/images/graphic-crud.png
Normal file
|
After Width: | Height: | Size: 6.7 KiB |
BIN
website/source/assets/images/graphic-crud@2x.png
Normal file
|
After Width: | Height: | Size: 14 KiB |
BIN
website/source/assets/images/graphic-key.png
Normal file
|
After Width: | Height: | Size: 10 KiB |
BIN
website/source/assets/images/graphic-key@2x.png
Normal file
|
After Width: | Height: | Size: 24 KiB |
BIN
website/source/assets/images/hero.png
Normal file
|
After Width: | Height: | Size: 21 KiB |
BIN
website/source/assets/images/hero@2x.png
Normal file
|
After Width: | Height: | Size: 55 KiB |
BIN
website/source/assets/images/icon-hashicorp-logo.png
Normal file
|
After Width: | Height: | Size: 384 B |
BIN
website/source/assets/images/icon-hashicorp-logo@2x.png
Normal file
|
After Width: | Height: | Size: 684 B |
BIN
website/source/assets/images/icon-terminal.png
Normal file
|
After Width: | Height: | Size: 382 B |
BIN
website/source/assets/images/icon-terminal@2x.png
Normal file
|
After Width: | Height: | Size: 724 B |
BIN
website/source/assets/images/logo-icon-large.png
Normal file
|
After Width: | Height: | Size: 1.8 KiB |
BIN
website/source/assets/images/logo-icon-large@2x.png
Normal file
|
After Width: | Height: | Size: 4.2 KiB |
BIN
website/source/assets/images/logo-icon.png
Normal file
|
After Width: | Height: | Size: 513 B |
BIN
website/source/assets/images/logo-icon@2x.png
Normal file
|
After Width: | Height: | Size: 1.1 KiB |
BIN
website/source/assets/images/logo-lockup.png
Normal file
|
After Width: | Height: | Size: 1.9 KiB |
BIN
website/source/assets/images/logo-lockup@2x.png
Normal file
|
After Width: | Height: | Size: 4.3 KiB |
BIN
website/source/assets/images/triangle-sprite.png
Normal file
|
After Width: | Height: | Size: 348 B |
BIN
website/source/assets/images/triangle-sprite@2x.png
Normal file
|
After Width: | Height: | Size: 653 B |
58
website/source/assets/javascripts/app/Init.js
Normal file
@@ -0,0 +1,58 @@
|
||||
(function(Sidebar){
|
||||
|
||||
// Quick and dirty IE detection
|
||||
var isIE = (function(){
|
||||
if (window.navigator.userAgent.match('Trident')) {
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
})();
|
||||
|
||||
// isIE = true;
|
||||
|
||||
var Init = {
|
||||
|
||||
start: function(){
|
||||
var id = document.body.id.toLowerCase();
|
||||
|
||||
if (this.Pages[id]) {
|
||||
this.Pages[id]();
|
||||
}
|
||||
},
|
||||
|
||||
initializeSidebar: function(){
|
||||
new Sidebar();
|
||||
},
|
||||
|
||||
initializeWaypoints: function(){
|
||||
$('#header').waypoint(function(event, direction) {
|
||||
console.log('waypoint header ', $(this)[0]);
|
||||
$(this.element).addClass('showit');
|
||||
}, {
|
||||
offset: function() {
|
||||
return 25%;
|
||||
}
|
||||
});
|
||||
|
||||
$('#hero').waypoint(function(event, direction) {
|
||||
$(this.element).addClass('showit');
|
||||
}, {
|
||||
offset: function() {
|
||||
return 25%;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
Pages: {
|
||||
'page-home': function(){
|
||||
Init.initializeSidebar();
|
||||
Init.initializeWaypoints();
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
Init.start();
|
||||
|
||||
})(window.Sidebar);
|
||||
51
website/source/assets/javascripts/app/Sidebar.js
Normal file
@@ -0,0 +1,51 @@
|
||||
(function(){
|
||||
|
||||
Sidebar = Base.extend({
|
||||
|
||||
$body: null,
|
||||
$overlay: null,
|
||||
$sidebar: null,
|
||||
$sidebarHeader: null,
|
||||
$sidebarImg: null,
|
||||
$toggleButton: null,
|
||||
|
||||
constructor: function(){
|
||||
this.$body = $('body');
|
||||
this.$overlay = $('.sidebar-overlay');
|
||||
this.$sidebar = $('#sidebar');
|
||||
this.$sidebarHeader = $('#sidebar .sidebar-header');
|
||||
this.$toggleButton = $('.navbar-toggle');
|
||||
|
||||
this.sidebarImg = this.$sidebarHeader.css('background-image');
|
||||
|
||||
this.addEventListeners();
|
||||
},
|
||||
|
||||
addEventListeners: function(){
|
||||
var _this = this;
|
||||
|
||||
_this.$toggleButton.on('click', function() {
|
||||
_this.$sidebar.toggleClass('open');
|
||||
if ((_this.$sidebar.hasClass('sidebar-fixed-left') || _this.$sidebar.hasClass('sidebar-fixed-right')) && _this.$sidebar.hasClass('open')) {
|
||||
_this.$overlay.addClass('active');
|
||||
_this.$body.css('overflow', 'hidden');
|
||||
} else {
|
||||
_this.$overlay.removeClass('active');
|
||||
_this.$body.css('overflow', 'auto');
|
||||
}
|
||||
|
||||
return false;
|
||||
});
|
||||
|
||||
_this.$overlay.on('click', function() {
|
||||
$(this).removeClass('active');
|
||||
_this.$body.css('overflow', 'auto');
|
||||
_this.$sidebar.removeClass('open');
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
window.Sidebar = Sidebar;
|
||||
|
||||
})();
|
||||
14
website/source/assets/javascripts/application.js
Normal file
@@ -0,0 +1,14 @@
|
||||
//= require jquery
|
||||
//= require bootstrap
|
||||
//= require jquery.waypoints.min
|
||||
|
||||
//= require lib/String.substitute
|
||||
//= require lib/Vector
|
||||
//= require lib/Function.prototype.bind
|
||||
//= require lib/Base
|
||||
//= require lib/Chainable
|
||||
//= require lib/dbg
|
||||
|
||||
//= require docs
|
||||
//= require app/Sidebar
|
||||
//= require app/Init
|
||||
46
website/source/assets/javascripts/docs.js
Normal file
@@ -0,0 +1,46 @@
|
||||
(function(){
|
||||
|
||||
var Init = {
|
||||
|
||||
start: function(){
|
||||
var classname = this.hasClass(document.body, 'page-sub');
|
||||
|
||||
if (classname) {
|
||||
this.addEventListeners();
|
||||
}
|
||||
},
|
||||
|
||||
hasClass: function (elem, className) {
|
||||
return new RegExp(' ' + className + ' ').test(' ' + elem.className + ' ');
|
||||
},
|
||||
|
||||
addEventListeners: function(){
|
||||
var _this = this;
|
||||
//console.log(document.querySelectorAll('.navbar-static-top')[0]);
|
||||
window.addEventListener('resize', _this.resizeImage, false);
|
||||
|
||||
this.resizeImage();
|
||||
},
|
||||
|
||||
resizeImage: function(){
|
||||
|
||||
var header = document.getElementById('header'),
|
||||
footer = document.getElementById('footer-wrap'),
|
||||
main = document.getElementById('main-content'),
|
||||
vp = window.innerHeight,
|
||||
bodyHeight = document.body.clientHeight,
|
||||
hHeight = header.clientHeight,
|
||||
fHeight = footer.clientHeight,
|
||||
withMinHeight = hHeight + fHeight + 830;
|
||||
|
||||
if(withMinHeight > bodyHeight ){
|
||||
var newHeight = (vp - (hHeight+fHeight)) + 'px';
|
||||
main.style.height = newHeight;
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
Init.start();
|
||||
|
||||
})();
|
||||
8
website/source/assets/javascripts/html5shiv.js
vendored
Executable file
@@ -0,0 +1,8 @@
|
||||
/*
|
||||
HTML5 Shiv v3.6.2pre | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed
|
||||
*/
|
||||
(function(l,f){function m(){var a=e.elements;return"string"==typeof a?a.split(" "):a}function i(a){var b=n[a[o]];b||(b={},h++,a[o]=h,n[h]=b);return b}function p(a,b,c){b||(b=f);if(g)return b.createElement(a);c||(c=i(b));b=c.cache[a]?c.cache[a].cloneNode():r.test(a)?(c.cache[a]=c.createElem(a)).cloneNode():c.createElem(a);return b.canHaveChildren&&!s.test(a)?c.frag.appendChild(b):b}function t(a,b){if(!b.cache)b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag();
|
||||
a.createElement=function(c){return!e.shivMethods?b.createElem(c):p(c,a,b)};a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+m().join().replace(/\w+/g,function(a){b.createElem(a);b.frag.createElement(a);return'c("'+a+'")'})+");return n}")(e,b.frag)}function q(a){a||(a=f);var b=i(a);if(e.shivCSS&&!j&&!b.hasCSS){var c,d=a;c=d.createElement("p");d=d.getElementsByTagName("head")[0]||d.documentElement;c.innerHTML="x<style>article,aside,figcaption,figure,footer,header,hgroup,nav,section{display:block}mark{background:#FF0;color:#000}</style>";
|
||||
c=d.insertBefore(c.lastChild,d.firstChild);b.hasCSS=!!c}g||t(a,b);return a}var k=l.html5||{},s=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,r=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,j,o="_html5shiv",h=0,n={},g;(function(){try{var a=f.createElement("a");a.innerHTML="<xyz></xyz>";j="hidden"in a;var b;if(!(b=1==a.childNodes.length)){f.createElement("a");var c=f.createDocumentFragment();b="undefined"==typeof c.cloneNode||
|
||||
"undefined"==typeof c.createDocumentFragment||"undefined"==typeof c.createElement}g=b}catch(d){g=j=!0}})();var e={elements:k.elements||"abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup mark meter nav output progress section summary time video",version:"3.6.2pre",shivCSS:!1!==k.shivCSS,supportsUnknownElements:g,shivMethods:!1!==k.shivMethods,type:"default",shivDocument:q,createElement:p,createDocumentFragment:function(a,b){a||(a=f);if(g)return a.createDocumentFragment();
|
||||
for(var b=b||i(a),c=b.frag.cloneNode(),d=0,e=m(),h=e.length;d<h;d++)c.createElement(e[d]);return c}};l.html5=e;q(f)})(this,document);
|
||||
7
website/source/assets/javascripts/jquery.waypoints.min.js
vendored
Executable file
145
website/source/assets/javascripts/lib/Base.js
Normal file
@@ -0,0 +1,145 @@
|
||||
/*
|
||||
Based on Base.js 1.1a (c) 2006-2010, Dean Edwards
|
||||
Updated to pass JSHint and converted into a module by Kenneth Powers
|
||||
License: http://www.opensource.org/licenses/mit-license.php
|
||||
*/
|
||||
/*global define:true module:true*/
|
||||
/*jshint eqeqeq:true*/
|
||||
(function (name, global, definition) {
|
||||
if (typeof module !== 'undefined') {
|
||||
module.exports = definition();
|
||||
} else if (typeof define !== 'undefined' && typeof define.amd === 'object') {
|
||||
define(definition);
|
||||
} else {
|
||||
global[name] = definition();
|
||||
}
|
||||
})('Base', this, function () {
|
||||
// Base Object
|
||||
var Base = function () {};
|
||||
|
||||
// Implementation
|
||||
Base.extend = function (_instance, _static) { // subclass
|
||||
var extend = Base.prototype.extend;
|
||||
// build the prototype
|
||||
Base._prototyping = true;
|
||||
var proto = new this();
|
||||
extend.call(proto, _instance);
|
||||
proto.base = function () {
|
||||
// call this method from any other method to invoke that method's ancestor
|
||||
};
|
||||
delete Base._prototyping;
|
||||
// create the wrapper for the constructor function
|
||||
//var constructor = proto.constructor.valueOf(); //-dean
|
||||
var constructor = proto.constructor;
|
||||
var klass = proto.constructor = function () {
|
||||
if (!Base._prototyping) {
|
||||
if (this._constructing || this.constructor === klass) { // instantiation
|
||||
this._constructing = true;
|
||||
constructor.apply(this, arguments);
|
||||
delete this._constructing;
|
||||
} else if (arguments[0] !== null) { // casting
|
||||
return (arguments[0].extend || extend).call(arguments[0], proto);
|
||||
}
|
||||
}
|
||||
};
|
||||
// build the class interface
|
||||
klass.ancestor = this;
|
||||
klass.extend = this.extend;
|
||||
klass.forEach = this.forEach;
|
||||
klass.implement = this.implement;
|
||||
klass.prototype = proto;
|
||||
klass.toString = this.toString;
|
||||
klass.valueOf = function (type) {
|
||||
return (type === 'object') ? klass : constructor.valueOf();
|
||||
};
|
||||
extend.call(klass, _static);
|
||||
// class initialization
|
||||
if (typeof klass.init === 'function') klass.init();
|
||||
return klass;
|
||||
};
|
||||
|
||||
Base.prototype = {
|
||||
extend: function (source, value) {
|
||||
if (arguments.length > 1) { // extending with a name/value pair
|
||||
var ancestor = this[source];
|
||||
if (ancestor && (typeof value === 'function') && // overriding a method?
|
||||
// the valueOf() comparison is to avoid circular references
|
||||
(!ancestor.valueOf || ancestor.valueOf() !== value.valueOf()) && /\bbase\b/.test(value)) {
|
||||
// get the underlying method
|
||||
var method = value.valueOf();
|
||||
// override
|
||||
value = function () {
|
||||
var previous = this.base || Base.prototype.base;
|
||||
this.base = ancestor;
|
||||
var returnValue = method.apply(this, arguments);
|
||||
this.base = previous;
|
||||
return returnValue;
|
||||
};
|
||||
// point to the underlying method
|
||||
value.valueOf = function (type) {
|
||||
return (type === 'object') ? value : method;
|
||||
};
|
||||
value.toString = Base.toString;
|
||||
}
|
||||
this[source] = value;
|
||||
} else if (source) { // extending with an object literal
|
||||
var extend = Base.prototype.extend;
|
||||
// if this object has a customized extend method then use it
|
||||
if (!Base._prototyping && typeof this !== 'function') {
|
||||
extend = this.extend || extend;
|
||||
}
|
||||
var proto = {
|
||||
toSource: null
|
||||
};
|
||||
// do the "toString" and other methods manually
|
||||
var hidden = ['constructor', 'toString', 'valueOf'];
|
||||
// if we are prototyping then include the constructor
|
||||
for (var i = Base._prototyping ? 0 : 1; i < hidden.length; i++) {
|
||||
var h = hidden[i];
|
||||
if (source[h] !== proto[h])
|
||||
extend.call(this, h, source[h]);
|
||||
}
|
||||
// copy each of the source object's properties to this object
|
||||
for (var key in source) {
|
||||
if (!proto[key]) extend.call(this, key, source[key]);
|
||||
}
|
||||
}
|
||||
return this;
|
||||
}
|
||||
};
|
||||
|
||||
// initialize
|
||||
Base = Base.extend({
|
||||
constructor: function () {
|
||||
this.extend(arguments[0]);
|
||||
}
|
||||
}, {
|
||||
ancestor: Object,
|
||||
version: '1.1',
|
||||
forEach: function (object, block, context) {
|
||||
for (var key in object) {
|
||||
if (this.prototype[key] === undefined) {
|
||||
block.call(context, object[key], key, object);
|
||||
}
|
||||
}
|
||||
},
|
||||
implement: function () {
|
||||
for (var i = 0; i < arguments.length; i++) {
|
||||
if (typeof arguments[i] === 'function') {
|
||||
// if it's a function, call it
|
||||
arguments[i](this.prototype);
|
||||
} else {
|
||||
// add the interface using the extend method
|
||||
this.prototype.extend(arguments[i]);
|
||||
}
|
||||
}
|
||||
return this;
|
||||
},
|
||||
toString: function () {
|
||||
return String(this.valueOf());
|
||||
}
|
||||
});
|
||||
|
||||
// Return Base implementation
|
||||
return Base;
|
||||
});
|
||||
92
website/source/assets/javascripts/lib/Chainable.js
Normal file
@@ -0,0 +1,92 @@
|
||||
(function(){
|
||||
|
||||
var Chainable = function(engine){
|
||||
this.engine = engine;
|
||||
this._chain = [];
|
||||
this._updateTimer = this._updateTimer.bind(this);
|
||||
this._cycle = this._cycle.bind(this);
|
||||
};
|
||||
|
||||
Chainable.prototype._running = false;
|
||||
|
||||
Chainable.prototype._updateTimer = function(tick){
|
||||
this._timer += tick;
|
||||
if (this._timer >= this._timerMax) {
|
||||
this.resetTimer();
|
||||
this._cycle();
|
||||
}
|
||||
};
|
||||
|
||||
Chainable.prototype.resetTimer = function(){
|
||||
this.engine.updateChainTimer = undefined;
|
||||
this._timer = 0;
|
||||
this._timerMax = 0;
|
||||
return this;
|
||||
};
|
||||
|
||||
Chainable.prototype.start = function(){
|
||||
if (this._running || !this._chain.length) {
|
||||
return this;
|
||||
}
|
||||
this._running = true;
|
||||
return this._cycle();
|
||||
};
|
||||
|
||||
Chainable.prototype.reset = function(){
|
||||
if (!this._running) {
|
||||
return this;
|
||||
}
|
||||
this.resetTimer();
|
||||
this._timer = 0;
|
||||
this._running = false;
|
||||
return this;
|
||||
};
|
||||
|
||||
Chainable.prototype._cycle = function(){
|
||||
var current;
|
||||
if (!this._chain.length) {
|
||||
return this.reset();
|
||||
}
|
||||
|
||||
current = this._chain.shift();
|
||||
|
||||
if (current.type === 'function') {
|
||||
current.func.apply(current.scope, current.args);
|
||||
current = null;
|
||||
return this._cycle();
|
||||
}
|
||||
if (current.type === 'wait') {
|
||||
this.resetTimer();
|
||||
// Convert timer to seconds
|
||||
this._timerMax = current.time / 1000;
|
||||
this.engine.updateChainTimer = this._updateTimer;
|
||||
current = null;
|
||||
}
|
||||
|
||||
return this;
|
||||
};
|
||||
|
||||
Chainable.prototype.then = Chainable.prototype.exec = function(func, scope, args){
|
||||
this._chain.push({
|
||||
type : 'function',
|
||||
|
||||
func : func,
|
||||
scope : scope || window,
|
||||
args : args || []
|
||||
});
|
||||
|
||||
return this.start();
|
||||
};
|
||||
|
||||
Chainable.prototype.wait = function(time){
|
||||
this._chain.push({
|
||||
type : 'wait',
|
||||
time : time
|
||||
});
|
||||
|
||||
return this.start();
|
||||
};
|
||||
|
||||
window.Chainable = Chainable;
|
||||
|
||||
})();
|
||||
@@ -0,0 +1,21 @@
|
||||
if (!Function.prototype.bind) {
|
||||
Function.prototype.bind = function (oThis) {
|
||||
if (typeof this !== "function") {
|
||||
throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable");
|
||||
}
|
||||
|
||||
var aArgs = Array.prototype.slice.call(arguments, 1),
|
||||
fToBind = this,
|
||||
fNOP = function () {},
|
||||
fBound = function () {
|
||||
return fToBind.apply(this instanceof fNOP && oThis ?
|
||||
this : oThis,
|
||||
aArgs.concat(Array.prototype.slice.call(arguments)));
|
||||
};
|
||||
|
||||
fNOP.prototype = this.prototype;
|
||||
fBound.prototype = new fNOP();
|
||||
|
||||
return fBound;
|
||||
};
|
||||
}
|
||||
14
website/source/assets/javascripts/lib/String.substitute.js
Normal file
@@ -0,0 +1,14 @@
|
||||
(function(String){
|
||||
|
||||
if (String.prototype.substitute) {
|
||||
return;
|
||||
}
|
||||
|
||||
String.prototype.substitute = function(object, regexp){
|
||||
return String(this).replace(regexp || (/\\?\{([^{}]+)\}/g), function(match, name){
|
||||
if (match.charAt(0) == '\\') return match.slice(1);
|
||||
return (object[name] !== null) ? object[name] : '';
|
||||
});
|
||||
};
|
||||
|
||||
})(String);
|
||||
111
website/source/assets/javascripts/lib/Vector.js
Normal file
@@ -0,0 +1,111 @@
|
||||
(function(global){ 'use strict';
|
||||
|
||||
var Vector = function(x, y){
|
||||
this.x = x || 0;
|
||||
this.y = y || 0;
|
||||
};
|
||||
|
||||
Vector.prototype = {
|
||||
|
||||
clone: function(){
|
||||
return new Vector(this.x, this.y);
|
||||
},
|
||||
|
||||
add: function(vec){
|
||||
this.x += vec.x;
|
||||
this.y += vec.y;
|
||||
return this;
|
||||
},
|
||||
|
||||
sub: function(vec){
|
||||
this.x -= vec.x;
|
||||
this.y -= vec.y;
|
||||
return this;
|
||||
},
|
||||
|
||||
subVal: function(val){
|
||||
this.x -= val;
|
||||
this.y -= val;
|
||||
return this;
|
||||
},
|
||||
|
||||
mult: function(mul){
|
||||
this.x *= mul;
|
||||
this.y *= mul;
|
||||
return this;
|
||||
},
|
||||
|
||||
div: function(div){
|
||||
if (div === 0) {
|
||||
return this;
|
||||
}
|
||||
this.x /= div;
|
||||
this.y /= div;
|
||||
return this;
|
||||
},
|
||||
|
||||
mag: function(){
|
||||
return Math.sqrt(
|
||||
this.x * this.x +
|
||||
this.y * this.y
|
||||
);
|
||||
},
|
||||
|
||||
limit: function(max){
|
||||
if (this.mag() > max) {
|
||||
this.normalize();
|
||||
this.mult(max);
|
||||
}
|
||||
return this;
|
||||
},
|
||||
|
||||
normalize: function(){
|
||||
var mag = this.mag();
|
||||
if (mag === 0) {
|
||||
return this;
|
||||
}
|
||||
this.div(mag);
|
||||
return this;
|
||||
},
|
||||
|
||||
heading: function(){
|
||||
return Math.atan2(this.y, this.x);
|
||||
},
|
||||
|
||||
set: function(vec){
|
||||
this.x = vec.x;
|
||||
this.y = vec.y;
|
||||
return this;
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
Vector.add = function(vec1, vec2){
|
||||
return vec1.clone().add(vec2.clone());
|
||||
};
|
||||
|
||||
Vector.sub = function(vec1, vec2){
|
||||
return vec1.clone().sub(vec2.clone());
|
||||
};
|
||||
|
||||
Vector.mult = function(vec, mult){
|
||||
return vec.clone().mult(mult);
|
||||
};
|
||||
|
||||
Vector.div = function(vec, div){
|
||||
return vec.clone().div(div);
|
||||
};
|
||||
|
||||
// Ripped from processing
|
||||
Vector.random2D = function(){
|
||||
var angle = Math.random(0, 1) * Math.PI * 2;
|
||||
return new Vector(Math.cos(angle), Math.sin(angle));
|
||||
};
|
||||
|
||||
Vector.coerce = function(obj){
|
||||
return new Vector(obj.x, obj.y);
|
||||
};
|
||||
|
||||
global.Vector = Vector;
|
||||
|
||||
})(this);
|
||||
60
website/source/assets/javascripts/lib/dbg.js
Normal file
@@ -0,0 +1,60 @@
|
||||
/*
|
||||
*
|
||||
* name: dbg
|
||||
*
|
||||
* description: A bad ass little console utility, check the README for deets
|
||||
*
|
||||
* license: MIT-style license
|
||||
*
|
||||
* author: Amadeus Demarzi
|
||||
*
|
||||
* provides: window.dbg
|
||||
*
|
||||
*/
|
||||
|
||||
(function(){
|
||||
|
||||
var global = this,
|
||||
|
||||
// Get the real console or set to null for easy boolean checks
|
||||
realConsole = global.console || null,
|
||||
|
||||
// Backup / Disabled Lambda
|
||||
fn = function(){},
|
||||
|
||||
// Supported console methods
|
||||
methodNames = ['log', 'error', 'warn', 'info', 'count', 'debug', 'profileEnd', 'trace', 'dir', 'dirxml', 'assert', 'time', 'profile', 'timeEnd', 'group', 'groupEnd'],
|
||||
|
||||
// Disabled Console
|
||||
disabledConsole = {
|
||||
|
||||
// Enables dbg, if it exists, otherwise it just provides disabled
|
||||
enable: function(quiet){
|
||||
global.dbg = realConsole ? realConsole : disabledConsole;
|
||||
},
|
||||
|
||||
// Disable dbg
|
||||
disable: function(){
|
||||
global.dbg = disabledConsole;
|
||||
}
|
||||
|
||||
}, name, i;
|
||||
|
||||
// Setup disabled console and provide fallbacks on the real console
|
||||
for (i = 0; i < methodNames.length;i++){
|
||||
name = methodNames[i];
|
||||
disabledConsole[name] = fn;
|
||||
if (realConsole && !realConsole[name])
|
||||
realConsole[name] = fn;
|
||||
}
|
||||
|
||||
// Add enable/disable methods
|
||||
if (realConsole) {
|
||||
realConsole.disable = disabledConsole.disable;
|
||||
realConsole.enable = disabledConsole.enable;
|
||||
}
|
||||
|
||||
// Enable dbg
|
||||
disabledConsole.enable();
|
||||
|
||||
}).call(this);
|
||||
6
website/source/assets/javascripts/respond.min.js
vendored
Executable file
@@ -0,0 +1,6 @@
|
||||
/*! matchMedia() polyfill - Test a CSS media type/query in JS. Authors & copyright (c) 2012: Scott Jehl, Paul Irish, Nicholas Zakas. Dual MIT/BSD license */
|
||||
/*! NOTE: If you're already including a window.matchMedia polyfill via Modernizr or otherwise, you don't need this part */
|
||||
window.matchMedia=window.matchMedia||function(a){"use strict";var c,d=a.documentElement,e=d.firstElementChild||d.firstChild,f=a.createElement("body"),g=a.createElement("div");return g.id="mq-test-1",g.style.cssText="position:absolute;top:-100em",f.style.background="none",f.appendChild(g),function(a){return g.innerHTML='­<style media="'+a+'"> #mq-test-1 { width: 42px; }</style>',d.insertBefore(f,e),c=42===g.offsetWidth,d.removeChild(f),{matches:c,media:a}}}(document);
|
||||
|
||||
/*! Respond.js v1.1.0: min/max-width media query polyfill. (c) Scott Jehl. MIT/GPLv2 Lic. j.mp/respondjs */
|
||||
(function(a){"use strict";function x(){u(!0)}var b={};a.respond=b,b.update=function(){},b.mediaQueriesSupported=a.matchMedia&&a.matchMedia("only all").matches,b.mediaQueriesSupported;var q,r,t,c=a.document,d=c.documentElement,e=[],f=[],g=[],h={},i=30,j=c.getElementsByTagName("head")[0]||d,k=c.getElementsByTagName("base")[0],l=j.getElementsByTagName("link"),m=[],n=function(){for(var b=0;l.length>b;b++){var c=l[b],d=c.href,e=c.media,f=c.rel&&"stylesheet"===c.rel.toLowerCase();d&&f&&!h[d]&&(c.styleSheet&&c.styleSheet.rawCssText?(p(c.styleSheet.rawCssText,d,e),h[d]=!0):(!/^([a-zA-Z:]*\/\/)/.test(d)&&!k||d.replace(RegExp.$1,"").split("/")[0]===a.location.host)&&m.push({href:d,media:e}))}o()},o=function(){if(m.length){var a=m.shift();v(a.href,function(b){p(b,a.href,a.media),h[a.href]=!0,setTimeout(function(){o()},0)})}},p=function(a,b,c){var d=a.match(/@media[^\{]+\{([^\{\}]*\{[^\}\{]*\})+/gi),g=d&&d.length||0;b=b.substring(0,b.lastIndexOf("/"));var h=function(a){return a.replace(/(url\()['"]?([^\/\)'"][^:\)'"]+)['"]?(\))/g,"$1"+b+"$2$3")},i=!g&&c;b.length&&(b+="/"),i&&(g=1);for(var j=0;g>j;j++){var k,l,m,n;i?(k=c,f.push(h(a))):(k=d[j].match(/@media *([^\{]+)\{([\S\s]+?)$/)&&RegExp.$1,f.push(RegExp.$2&&h(RegExp.$2))),m=k.split(","),n=m.length;for(var o=0;n>o;o++)l=m[o],e.push({media:l.split("(")[0].match(/(only\s+)?([a-zA-Z]+)\s?/)&&RegExp.$2||"all",rules:f.length-1,hasquery:l.indexOf("(")>-1,minw:l.match(/\(min\-width:[\s]*([\s]*[0-9\.]+)(px|em)[\s]*\)/)&&parseFloat(RegExp.$1)+(RegExp.$2||""),maxw:l.match(/\(max\-width:[\s]*([\s]*[0-9\.]+)(px|em)[\s]*\)/)&&parseFloat(RegExp.$1)+(RegExp.$2||"")})}u()},s=function(){var a,b=c.createElement("div"),e=c.body,f=!1;return b.style.cssText="position:absolute;font-size:1em;width:1em",e||(e=f=c.createElement("body"),e.style.background="none"),e.appendChild(b),d.insertBefore(e,d.firstChild),a=b.offsetWidth,f?d.removeChild(e):e.removeChild(b),a=t=parseFloat(a)},u=function(a){var b="clientWidth",h=d[b],k="CSS1Compat"===c.compatMode&&h||c.body[b]||h,m={},n=l[l.length-1],o=(new Date).getTime();if(a&&q&&i>o-q)return clearTimeout(r),r=setTimeout(u,i),void 0;q=o;for(var p in e)if(e.hasOwnProperty(p)){var v=e[p],w=v.minw,x=v.maxw,y=null===w,z=null===x,A="em";w&&(w=parseFloat(w)*(w.indexOf(A)>-1?t||s():1)),x&&(x=parseFloat(x)*(x.indexOf(A)>-1?t||s():1)),v.hasquery&&(y&&z||!(y||k>=w)||!(z||x>=k))||(m[v.media]||(m[v.media]=[]),m[v.media].push(f[v.rules]))}for(var B in g)g.hasOwnProperty(B)&&g[B]&&g[B].parentNode===j&&j.removeChild(g[B]);for(var C in m)if(m.hasOwnProperty(C)){var D=c.createElement("style"),E=m[C].join("\n");D.type="text/css",D.media=C,j.insertBefore(D,n.nextSibling),D.styleSheet?D.styleSheet.cssText=E:D.appendChild(c.createTextNode(E)),g.push(D)}},v=function(a,b){var c=w();c&&(c.open("GET",a,!0),c.onreadystatechange=function(){4!==c.readyState||200!==c.status&&304!==c.status||b(c.responseText)},4!==c.readyState&&c.send(null))},w=function(){var b=!1;try{b=new a.XMLHttpRequest}catch(c){b=new a.ActiveXObject("Microsoft.XMLHTTP")}return function(){return b}}();n(),b.update=n,a.addEventListener?a.addEventListener("resize",x,!1):a.attachEvent&&a.attachEvent("onresize",x)})(this);
|
||||
56
website/source/assets/stylesheets/_buttons.scss
Executable file
@@ -0,0 +1,56 @@
|
||||
//
|
||||
// Button Styles
|
||||
// --------------------------------------------------
|
||||
|
||||
.v-btn{
|
||||
display: inline-block;
|
||||
background-color: $white;
|
||||
color: $black;
|
||||
border: 1px solid $black;
|
||||
@include transition(color .3s ease-in-out);
|
||||
@include btn-shadow();
|
||||
|
||||
&.lrg{
|
||||
font-size: 18px;
|
||||
padding: 10px 60px;
|
||||
}
|
||||
|
||||
&.sml{
|
||||
font-size: 15px;
|
||||
padding: 8px 40px;
|
||||
}
|
||||
|
||||
&.blue{
|
||||
color: $blue;
|
||||
border: 1px solid $blue;
|
||||
}
|
||||
|
||||
&.gray{
|
||||
font-weight: 300;
|
||||
color: $gray;
|
||||
border: 1px solid $gray;
|
||||
}
|
||||
|
||||
&.terminal{
|
||||
padding-left: 52px;
|
||||
background: image-url('../images/icon-terminal.png') 16px center no-repeat;
|
||||
@include img-retina("../images/icon-terminal.png", "../images/icon-terminal@2x.png", 26px, 25px);
|
||||
}
|
||||
|
||||
&:hover{
|
||||
text-decoration: none;
|
||||
@include transition(color .3s ease-in-out);
|
||||
|
||||
&.blue{
|
||||
color: darken($blue, 8%);
|
||||
}
|
||||
|
||||
&.black{
|
||||
color: lighten($black, 50%);
|
||||
}
|
||||
|
||||
&.gray{
|
||||
color: $black;
|
||||
}
|
||||
}
|
||||
}
|
||||
20
website/source/assets/stylesheets/_community.scss
Normal file
@@ -0,0 +1,20 @@
|
||||
.people {
|
||||
margin-top: 30px;
|
||||
|
||||
.person {
|
||||
margin-bottom: 40px;
|
||||
|
||||
h3 {
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
img {
|
||||
width: 125px;
|
||||
margin: auto auto;
|
||||
}
|
||||
|
||||
.bio {
|
||||
padding-left: 150px;
|
||||
}
|
||||
}
|
||||
}
|
||||
263
website/source/assets/stylesheets/_docs.scss
Executable file
@@ -0,0 +1,263 @@
|
||||
//
|
||||
// Docs
|
||||
// --------------------------------------------------
|
||||
|
||||
body.layout-atlas,
|
||||
body.layout-consul,
|
||||
body.layout-dnsimple,
|
||||
body.layout-dme,
|
||||
body.layout-cloudflare,
|
||||
body.layout-cloudstack,
|
||||
body.layout-google,
|
||||
body.layout-heroku,
|
||||
body.layout-mailgun,
|
||||
body.layout-digitalocean,
|
||||
body.layout-aws,
|
||||
body.layout-docs,
|
||||
body.layout-inner,
|
||||
body.layout-downloads,
|
||||
body.layout-intro{
|
||||
//background: $light-black image-url('sidebar-wire.png') left 62px no-repeat;
|
||||
>.container{
|
||||
.col-md-8[role=main]{
|
||||
min-height: 800px;
|
||||
background-color: white;
|
||||
|
||||
>div{
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.docs-sidebar{
|
||||
position: relative;
|
||||
z-index: 20;
|
||||
margin-bottom: 30px;
|
||||
margin-top: 50px;
|
||||
margin-right: 4%;
|
||||
@include open();
|
||||
|
||||
a{
|
||||
color: $dark-blue;
|
||||
}
|
||||
|
||||
.docs-sidenav{
|
||||
padding-bottom: 15px;
|
||||
|
||||
:last-child{
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
//all li > a
|
||||
li{
|
||||
position: relative;
|
||||
|
||||
> a{
|
||||
padding: 10px 0 10px 8px;
|
||||
font-size: 13px;
|
||||
color: $dark-blue;
|
||||
@include transition( all 300ms cubic-bezier(.17,.67,.83,.67) );
|
||||
@include translate3d(0, 0, 0);
|
||||
|
||||
&:hover{
|
||||
background-color: transparent !important;
|
||||
@include transition( all 300ms cubic-bezier(.17,.67,.83,.67) );
|
||||
@include translate3d(5px, 0, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
> li {
|
||||
margin: 0 0 0 10px;
|
||||
|
||||
>.nav{
|
||||
li{
|
||||
a{
|
||||
color: $dark-blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.active {
|
||||
>a{
|
||||
color: lighten($black, 4%);
|
||||
@include open();
|
||||
|
||||
&:hover{
|
||||
background-color: transparent !important;
|
||||
@include transition( none );
|
||||
@include translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
&:before{
|
||||
background: url(../images/triangle-sprite.png) 0 0 no-repeat;
|
||||
@include img-retina("../images/triangle-sprite.png", "../images/triangle-sprite@2x.png", 7px, 25px);
|
||||
}
|
||||
}
|
||||
|
||||
.nav {
|
||||
display: block;
|
||||
|
||||
li.active a {
|
||||
color: $black;
|
||||
@include open();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
> a {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
&:before{
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 7px;
|
||||
height: 8px;
|
||||
top: 15px;
|
||||
left: -10px;
|
||||
overflow: hidden;
|
||||
background: url(../images/triangle-sprite.png) 0 -9px no-repeat;
|
||||
@include img-retina("../images/triangle-sprite.png", "../images/triangle-sprite@2x.png", 7px, 25px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.nav {
|
||||
display: none;
|
||||
margin-bottom: 15px;
|
||||
|
||||
> li{
|
||||
margin-left: 10px;
|
||||
|
||||
&.active{
|
||||
> a{
|
||||
&:hover{
|
||||
background-color: transparent !important;
|
||||
@include transition( none );
|
||||
@include translate3d(0, 0, 0);
|
||||
}
|
||||
&:before{
|
||||
background: url(../images/triangle-sprite.png) 0 0 no-repeat;
|
||||
@include img-retina("../images/triangle-sprite.png", "../images/triangle-sprite@2x.png", 5px, 19px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
> a{
|
||||
-webkit-font-smoothing: antialiased;
|
||||
padding: 6px 15px;
|
||||
|
||||
&:before{
|
||||
opacity: .75;
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 5px;
|
||||
height: 7px;
|
||||
top: 12px;
|
||||
left: 0px;
|
||||
overflow: hidden;
|
||||
background: url(../images/triangle-sprite.png) 0 -13px no-repeat;
|
||||
@include img-retina("../images/triangle-sprite.png", "../images/triangle-sprite@2x.png", 5px, 19px);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.nav-visible {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.bs-docs-section{
|
||||
padding-top: 10px;
|
||||
padding-left: 3%;
|
||||
padding-bottom: 80px;
|
||||
|
||||
.lead{
|
||||
margin-bottom: 48px
|
||||
}
|
||||
|
||||
.doc-sectional{
|
||||
margin-bottom: 48px;
|
||||
}
|
||||
|
||||
p, li, .alert {
|
||||
font-size: 20px;
|
||||
font-family: $font-family-open-sans;
|
||||
font-weight: $font-weight-open;
|
||||
line-height: 1.5em;
|
||||
margin: 0 0 18px;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
pre{
|
||||
margin: 0 0 18px;
|
||||
}
|
||||
|
||||
a{
|
||||
color: $dark-blue;
|
||||
&:hover{
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
img{
|
||||
max-width: 650px;
|
||||
margin-top: 25px;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
h1{
|
||||
color: $black;
|
||||
font-size: 36px;
|
||||
margin-top: 50px;
|
||||
margin-bottom: 24px;
|
||||
//@include lato-light();
|
||||
@include open();
|
||||
}
|
||||
|
||||
h2, h3, h4{
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
#graph {
|
||||
margin-top: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 992px) {
|
||||
|
||||
.bs-docs-section{
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.bs-docs-section{
|
||||
padding-top: 0;
|
||||
h1{
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.bs-docs-section{
|
||||
img{
|
||||
max-width: 450px;
|
||||
}
|
||||
|
||||
h1{
|
||||
font-size: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
59
website/source/assets/stylesheets/_downloads.scss
Normal file
@@ -0,0 +1,59 @@
|
||||
.downloads {
|
||||
margin-top: 20px;
|
||||
|
||||
.description {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.download {
|
||||
border-bottom: 1px solid #b2b2b2;
|
||||
padding-bottom: 15px;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.details {
|
||||
padding-left: 95px;
|
||||
|
||||
h2 {
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding-left: 0px;
|
||||
}
|
||||
|
||||
li {
|
||||
display: inline-block;
|
||||
|
||||
&:after {
|
||||
content: " | ";
|
||||
}
|
||||
|
||||
&:last-child:after {
|
||||
content: "";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.icon {
|
||||
img {
|
||||
width: 75px;
|
||||
}
|
||||
}
|
||||
|
||||
.os-name {
|
||||
font-size: 40px;
|
||||
margin-bottom: -3px;
|
||||
}
|
||||
}
|
||||
|
||||
.poweredby {
|
||||
margin-top: 20px;
|
||||
|
||||
img {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
width: 122px;
|
||||
}
|
||||
}
|
||||
}
|
||||
26
website/source/assets/stylesheets/_fonts.scss
Executable file
@@ -0,0 +1,26 @@
|
||||
//
|
||||
// Typography
|
||||
// --------------------------------------------------
|
||||
|
||||
//light
|
||||
.rls-l{
|
||||
font-family: $font-family-lato;
|
||||
font-weight: $font-weight-lato-xl;
|
||||
}
|
||||
|
||||
//semibold
|
||||
.rls-sb{
|
||||
font-family: $font-family-lato;
|
||||
font-weight: $font-weight-lato-sb;
|
||||
}
|
||||
|
||||
//extrabold
|
||||
.rls-xb{
|
||||
font-family: $font-family-lato;
|
||||
font-weight: $font-weight-lato-xb;
|
||||
}
|
||||
|
||||
.os{
|
||||
font-family: $font-family-open-sans;
|
||||
font-weight: $font-weight-open;
|
||||
}
|
||||
117
website/source/assets/stylesheets/_footer.scss
Normal file
@@ -0,0 +1,117 @@
|
||||
body.page-sub{
|
||||
#footer{
|
||||
padding: 0 0 40px 0;
|
||||
.col-md-5{
|
||||
padding-top: 40px;
|
||||
border-top: 1px solid $faint-gray;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#footer{
|
||||
padding: 40px 0;
|
||||
color: black;
|
||||
|
||||
.footer-links{
|
||||
margin-bottom: 20px;
|
||||
|
||||
.li-under a:hover::after,
|
||||
.li-under a:focus::after {
|
||||
opacity: 1;
|
||||
-webkit-transform: skewY(15deg) translateY(8px);
|
||||
-moz-transform: skewY(15deg) translateY(8px);
|
||||
transform: skewY(15deg) translateY(8px);
|
||||
}
|
||||
|
||||
.li-under a::after {
|
||||
background-color: $purple;
|
||||
}
|
||||
|
||||
li{
|
||||
a{
|
||||
@include v-nav-style();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pull-right{
|
||||
padding-right: 15px;
|
||||
}
|
||||
|
||||
.footer-hashi{
|
||||
font-size: 11px;
|
||||
a{
|
||||
color: black;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
span{
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.hashi-logo{
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
i{
|
||||
display: inline-block;
|
||||
margin-top: -6px;
|
||||
width: 16px;
|
||||
height: 17px;
|
||||
background: image-url('../images/icon-hashicorp-logo.png') 0 0 no-repeat;
|
||||
@include img-retina('../images/icon-hashicorp-logo.png', '../images/icon-hashicorp-logo@2x.png', 16px, 17px);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
|
||||
body.page-sub{
|
||||
#footer{
|
||||
.col-md-5{
|
||||
&:last-child{
|
||||
padding-top: 0;
|
||||
border-top: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#footer{
|
||||
padding: 100px 0 40px;
|
||||
text-align: center;
|
||||
|
||||
.footer-links{
|
||||
float: none;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.footer-hashi {
|
||||
float: none;
|
||||
display: inline-block;
|
||||
|
||||
.pull-right{
|
||||
float: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 320px) {
|
||||
|
||||
#footer{
|
||||
text-align: center;
|
||||
|
||||
.footer-links{
|
||||
.li-under{
|
||||
float: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
90
website/source/assets/stylesheets/_global.scss
Executable file
@@ -0,0 +1,90 @@
|
||||
//
|
||||
// Global Site
|
||||
// --------------------------------------------------
|
||||
|
||||
/*html{
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}*/
|
||||
|
||||
body {
|
||||
-webkit-font-smoothing: subpixel-antialiased;
|
||||
color: $black;
|
||||
background-color: $white;
|
||||
font-size: 15px;
|
||||
font-family: $font-family-lato;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
|
||||
h1, h2, h3, h4, h5 {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
h1{
|
||||
font-size: 42px;
|
||||
line-height: 42px;
|
||||
font-family: $font-family-lato;
|
||||
font-weight: $font-weight-lato-sb;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
h3{
|
||||
font-size: 28px;
|
||||
line-height: 28px;
|
||||
font-family: $font-family-lato;
|
||||
font-weight: $font-weight-lato-sb;
|
||||
}
|
||||
|
||||
//an alternative color for buttons in the doc body
|
||||
.btn-serf{
|
||||
color: $white !important;
|
||||
background-color: $btn-color;
|
||||
border-radius: $btn-border-radius;
|
||||
//@include box-shadow( $shadow );
|
||||
}
|
||||
|
||||
.highlight{
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
pre {
|
||||
background-color: $black;
|
||||
color: $white;
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-family: "Courier New", Monaco, Menlo, Consolas, monospace;
|
||||
border: none;
|
||||
padding: 20px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
|
||||
//fixed grid below 992 to prevent smaller responsive sizes
|
||||
@media (max-width: 992px) {
|
||||
.container{
|
||||
max-width: 970px;
|
||||
}
|
||||
}
|
||||
|
||||
//all below styles are overriding corrections for below (min-width: 992px)
|
||||
//below (min-width: 992px) these styles change
|
||||
.navbar-nav {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
float: right !important;
|
||||
}
|
||||
|
||||
.navbar-nav > li {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.navbar-nav > li > a {
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
.center {
|
||||
text-align: center;
|
||||
}
|
||||
122
website/source/assets/stylesheets/_header.scss
Executable file
@@ -0,0 +1,122 @@
|
||||
//
|
||||
// Header
|
||||
// --------------------------------------------------
|
||||
|
||||
#header {
|
||||
position: relative;
|
||||
color: $white;
|
||||
text-rendering: optimizeLegibility;
|
||||
margin-bottom: 0;
|
||||
/* opacity: 0;
|
||||
@include translate3d(0, -10px, 0); */
|
||||
transition: all 1s ease;
|
||||
|
||||
/* &.showit{
|
||||
opacity: 1;
|
||||
@include translate3d(0, 0px, 0);
|
||||
transition: all 1s ease;
|
||||
} */
|
||||
|
||||
&.navbar-static-top{
|
||||
height:70px;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.navbar-header{
|
||||
|
||||
.navbar-toggle{
|
||||
padding-right: 15px;
|
||||
margin-top: 26px;
|
||||
margin-bottom: 14px;
|
||||
margin-right: 0;
|
||||
//border: 2px solid $white;
|
||||
border-radius: 0;
|
||||
.icon-bar{
|
||||
border: 1px solid $black;
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.navbar-brand {
|
||||
display: inline-block;
|
||||
padding: 0;
|
||||
margin: 30px 10px 0 0 ;
|
||||
|
||||
.logo{
|
||||
display: inline-block;
|
||||
width: 24px;
|
||||
height: 23px;
|
||||
padding: 0;
|
||||
line-height: 23px;
|
||||
text-indent: 100%;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
background: image-url('../images/logo-icon.png') 0 0 no-repeat;
|
||||
@include img-retina("../images/logo-icon.png", "../images/logo-icon@2x.png", 24px, 23px);
|
||||
}
|
||||
}
|
||||
|
||||
.main-links.navbar-nav{
|
||||
margin-top: 28px;
|
||||
|
||||
li > a {
|
||||
@include v-nav-style();
|
||||
}
|
||||
}
|
||||
|
||||
.buttons{
|
||||
.navbar-nav{
|
||||
margin-top: 25px;
|
||||
margin-left: 30px;
|
||||
@include btn-shadow();
|
||||
|
||||
li{
|
||||
border: 1px solid $light-gray;
|
||||
|
||||
&.first{
|
||||
border-right: none;
|
||||
}
|
||||
}
|
||||
|
||||
li > a {
|
||||
color: $gray;
|
||||
font-size: 14px;
|
||||
font-weight: 300;
|
||||
padding: 4px 20px;
|
||||
@include transition( color 0.3s ease );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.nav > li > a:hover, .nav > li > a:focus {
|
||||
background-color: transparent;
|
||||
color: $black;
|
||||
@include transition( color 0.3s ease );
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
|
||||
}
|
||||
|
||||
@media (max-width: 763px) {
|
||||
.navbar-static-top {
|
||||
.nav-white {
|
||||
background-color:rgba(0,0,0,0.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 320px) {
|
||||
|
||||
}
|
||||
504
website/source/assets/stylesheets/_home.scss
Executable file
@@ -0,0 +1,504 @@
|
||||
//
|
||||
// Home
|
||||
// --------------------------------------------------
|
||||
|
||||
#hero{
|
||||
/* opacity: 0;
|
||||
@include translate3d(0, -10px, 0); */
|
||||
text-align: center;
|
||||
|
||||
/* &.showit{
|
||||
opacity: 1;
|
||||
@include translate3d(0, 0px, 0);
|
||||
transition: all 1s ease;
|
||||
} */
|
||||
|
||||
#logo-lockup{
|
||||
display: inline-block;
|
||||
width: 186px;
|
||||
height: 34px;
|
||||
margin-top: 120px;
|
||||
background: image-url('../images/logo-lockup.png') 0 0 no-repeat;
|
||||
@include img-retina("../images/logo-lockup.png", "../images/logo-lockup@2x.png", 186px, 34px);
|
||||
}
|
||||
|
||||
#tag-line{
|
||||
margin: 20px 0;
|
||||
font-size: 24px;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
#diagram{
|
||||
display: inline-block;
|
||||
width: 481px;
|
||||
height: 198px;
|
||||
margin-top: 120px;
|
||||
background: image-url('../images/hero.png') 0 0 no-repeat;
|
||||
@include img-retina("../images/hero.png", "../images/hero@2x.png", 481px, 198px);
|
||||
}
|
||||
|
||||
p{
|
||||
margin-top: 60px;
|
||||
text-align: left;
|
||||
font-size: 18px;
|
||||
font-weight: 300;
|
||||
line-height: 2em;
|
||||
|
||||
.strong{
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#content{
|
||||
margin-top: 180px;
|
||||
text-align: center;
|
||||
|
||||
h2{
|
||||
margin-bottom: 120px;
|
||||
font-size: 44px;
|
||||
@include lato-light();
|
||||
color: $blue;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.feature{
|
||||
margin-bottom: 150px;
|
||||
|
||||
&#crud{
|
||||
.graphic{
|
||||
width: 335px;
|
||||
height: 128px;
|
||||
background: image-url('../images/graphic-crud.png') 0 0 no-repeat;
|
||||
@include img-retina("../images/graphic-crud.png", "../images/graphic-crud@2x.png", 335px, 128px);
|
||||
}
|
||||
}
|
||||
|
||||
&#key{
|
||||
.graphic{
|
||||
width: 243px;
|
||||
height: 140px;
|
||||
background: image-url('../images/graphic-key.png') 0 0 no-repeat;
|
||||
@include img-retina("../images/graphic-key.png", "../images/graphic-key@2x.png", 243px, 140px);
|
||||
}
|
||||
}
|
||||
|
||||
&#audit{
|
||||
.graphic{
|
||||
width: 491px;
|
||||
height: 129px;
|
||||
background: image-url('../images/graphic-audit.png') 0 0 no-repeat;
|
||||
@include img-retina("../images/graphic-audit.png", "../images/graphic-audit@2x.png", 491px, 129px);
|
||||
}
|
||||
}
|
||||
|
||||
.graphic{
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
h3{
|
||||
margin: 30px 0;
|
||||
color: $black;
|
||||
font-size: 34px;
|
||||
line-height: 34px;
|
||||
letter-spacing: 1px;
|
||||
@include lato-light();
|
||||
}
|
||||
|
||||
p{
|
||||
margin-bottom: 30px;
|
||||
text-align: left;
|
||||
font-size: 16px;
|
||||
line-height: 1.75em;
|
||||
font-weight: 300;
|
||||
@include lato-light();
|
||||
}
|
||||
|
||||
.feature-footer{
|
||||
a{
|
||||
margin-bottom: 15px;
|
||||
margin-left: 15px;
|
||||
|
||||
&:first-child{
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#cta {
|
||||
position: relative;
|
||||
padding: 160px 0;
|
||||
background: image-url('../images/bg-iconscrud.png') center center no-repeat;
|
||||
@include img-retina("../images/bg-icons.png", "../images/bg-icons@2x.png", 669px, 260px);
|
||||
background-position: center center;
|
||||
border-top: 1px solid $faint-gray;
|
||||
border-bottom: 1px solid $faint-gray;
|
||||
|
||||
a{
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
p{
|
||||
margin-top: 10px;
|
||||
color: $black;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
line-height: 1.5esm;
|
||||
|
||||
&.cta-gray{
|
||||
color: $gray;
|
||||
font-weight: 300;
|
||||
}
|
||||
}
|
||||
|
||||
.outline-btn {
|
||||
padding: 16px 40px;
|
||||
display: inline-block;
|
||||
&:focus {
|
||||
outline: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#demos{
|
||||
position: relative;
|
||||
padding: 180px 0 60px;
|
||||
margin-top: -80px;
|
||||
|
||||
>.container{
|
||||
z-index: 31;
|
||||
}
|
||||
|
||||
#demo-bg{
|
||||
background-color: #000;
|
||||
@include skewY(-3deg);
|
||||
z-index: 30;
|
||||
}
|
||||
|
||||
.explantion {
|
||||
margin: 40px 0 60px 15px;
|
||||
border-left: 8px solid #1e1e1e;
|
||||
|
||||
h2 {
|
||||
margin-top: 0;
|
||||
font-size: 28px;
|
||||
color: lighten($purple, 8%);
|
||||
@include lato-light();
|
||||
}
|
||||
|
||||
p{
|
||||
margin-bottom: 0;
|
||||
font-size: 16px;
|
||||
letter-spacing: 1px;
|
||||
line-height: 1.5em;
|
||||
color: $gray-light;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
.terminals{
|
||||
margin-bottom: 80px;
|
||||
|
||||
.terminal-item{
|
||||
margin-bottom: 120px;
|
||||
|
||||
&.last{
|
||||
border-bottom: none;
|
||||
}
|
||||
>header{
|
||||
.left{
|
||||
span.icn{
|
||||
display: inline-block;
|
||||
width: 83px;
|
||||
height: 74px;
|
||||
}
|
||||
}
|
||||
|
||||
.right{
|
||||
padding-left: 25px;
|
||||
|
||||
h2{
|
||||
margin-top: 0;
|
||||
font-size: 28px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
p{
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.terminal{
|
||||
border: 2px solid #1e1e1e;
|
||||
//border-radius: 4px;
|
||||
|
||||
header{
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 3px;
|
||||
//background-color: #1e1e1e;
|
||||
border-bottom: 2px solid #1e1e1e;
|
||||
|
||||
h4{
|
||||
font-size: 14px;
|
||||
letter-spacing: 1px;
|
||||
color: white;
|
||||
font-family: $font-family-lato;
|
||||
font-weight: $font-weight-lato-xb;
|
||||
}
|
||||
|
||||
ul.shell-dots{
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 8px;
|
||||
padding-left: 0;
|
||||
|
||||
li{
|
||||
&.d1{
|
||||
background-color: #4a08a7;
|
||||
}
|
||||
&.d2{
|
||||
background-color: #6517cf;
|
||||
}
|
||||
&.d3{
|
||||
background-color: #7b29ee;
|
||||
}
|
||||
|
||||
display: inline-block;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border-radius: 6px;
|
||||
margin-left: 6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.terminal-window{
|
||||
min-height: 140px;
|
||||
padding: 20px;
|
||||
font-size: 15px;
|
||||
font-family: "Courier New", Monaco, Menlo, Consolas, monospace;
|
||||
color: $white;
|
||||
background-color: transparent;
|
||||
overflow:auto;
|
||||
font-weight: 500;
|
||||
-webkit-font-smoothing: subpixel-antialiased;
|
||||
|
||||
.txt-spe {
|
||||
color: lighten($blue, 5%);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.txt-var {
|
||||
color: lighten($purple, 8%);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.txt-str {
|
||||
color: lighten($green, 2%);
|
||||
}
|
||||
|
||||
.txt-int {
|
||||
color: lighten($orange, 2%);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
p{
|
||||
margin-bottom: 2px;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
.cursor {
|
||||
background-color: lighten($purple, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.feature-bullets{
|
||||
list-style-type: none;
|
||||
padding-left: 35px;
|
||||
|
||||
li{
|
||||
padding: 5px 0 5px 45px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
|
||||
#demos{
|
||||
.terminals{
|
||||
.terminal-item{
|
||||
.feature-bullets{
|
||||
li{
|
||||
background-size: 12px 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
|
||||
}
|
||||
|
||||
@media (min-width: 992px) and (max-width:1200px) {
|
||||
#cta a {
|
||||
margin-top: 15px;
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) and (max-width:992px) {
|
||||
#cta a {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
|
||||
#demos{
|
||||
.terminals{
|
||||
.terminal-item{
|
||||
>header{
|
||||
.left{
|
||||
span.icn{
|
||||
}
|
||||
}
|
||||
|
||||
.right{
|
||||
padding-left: 54px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
|
||||
#demos{
|
||||
.explantion {
|
||||
margin: 40px 0 60px 0;
|
||||
}
|
||||
|
||||
.terminals{
|
||||
.terminal-item{
|
||||
>header{
|
||||
.left{
|
||||
span.icn{
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.right{
|
||||
padding-left: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#cta{
|
||||
.intro{
|
||||
text-align: center;
|
||||
p{
|
||||
text-align: center;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 480px) {
|
||||
|
||||
|
||||
#hero{
|
||||
#diagram{
|
||||
width: 100%;
|
||||
height: 132px;
|
||||
background: image-url('../images/hero.png') center 0 no-repeat;
|
||||
@include img-retina("../images/hero.png", "../images/hero@2x.png", 320px, 132px);
|
||||
}
|
||||
}
|
||||
|
||||
#content{
|
||||
.feature{
|
||||
&#audit{
|
||||
.graphic{
|
||||
width: 100%;
|
||||
height: 84px;
|
||||
background: image-url('../images/graphic-audit.png') center 0 no-repeat;
|
||||
@include img-retina("../images/graphic-audit.png", "../images/graphic-audit@2x.png", 320px, 84px);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.feature-footer{
|
||||
text-align: center;
|
||||
a{
|
||||
margin-bottom: 15px;
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 320px) {
|
||||
|
||||
#hero{
|
||||
#diagram{
|
||||
width: 100%;
|
||||
height: 132px;
|
||||
background: image-url('../images/hero.png') center 0 no-repeat;
|
||||
@include img-retina("../images/hero.png", "../images/hero@2x.png", 320px, 132px);
|
||||
}
|
||||
}
|
||||
|
||||
#content{
|
||||
.feature{
|
||||
&#crud{
|
||||
.graphic{
|
||||
width: 100%;
|
||||
height: 111px;
|
||||
background: image-url('../images/graphic-crud.png') center 0 no-repeat;
|
||||
@include img-retina("../images/graphic-crud.png", "../images/graphic-crud@2x.png", 290px, 111px);
|
||||
}
|
||||
}
|
||||
|
||||
&#audit{
|
||||
.graphic{
|
||||
width: 100%;
|
||||
height: 76px;
|
||||
background: image-url('../images/graphic-audit.png') center 0 no-repeat;
|
||||
@include img-retina("../images/graphic-audit.png", "../images/graphic-audit@2x.png", 290px, 76px);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#demos .explantion{
|
||||
border-left: 8px solid transparent;
|
||||
}
|
||||
|
||||
#cta a {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
0
website/source/assets/stylesheets/_jumbotron.scss
Executable file
756
website/source/assets/stylesheets/_mixins.scss
Executable file
@@ -0,0 +1,756 @@
|
||||
//
|
||||
// Mixins
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
// Utilities
|
||||
// -------------------------
|
||||
|
||||
// Clearfix
|
||||
// Source: http://nicolasgallagher.com/micro-clearfix-hack/
|
||||
//
|
||||
// For modern browsers
|
||||
// 1. The space content is one way to avoid an Opera bug when the
|
||||
// contenteditable attribute is included anywhere else in the document.
|
||||
// Otherwise it causes space to appear at the top and bottom of elements
|
||||
// that are clearfixed.
|
||||
// 2. The use of `table` rather than `block` is only necessary if using
|
||||
// `:before` to contain the top-margins of child elements.
|
||||
@mixin clearfix() {
|
||||
&:before,
|
||||
&:after {
|
||||
content: " "; /* 1 */
|
||||
display: table; /* 2 */
|
||||
}
|
||||
&:after {
|
||||
clear: both;
|
||||
}
|
||||
}
|
||||
|
||||
// Webkit-style focus
|
||||
@mixin tab-focus() {
|
||||
// Default
|
||||
outline: thin dotted #333;
|
||||
// Webkit
|
||||
outline: 5px auto -webkit-focus-ring-color;
|
||||
outline-offset: -2px;
|
||||
}
|
||||
|
||||
// Center-align a block level element
|
||||
@mixin center-block() {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
// Sizing shortcuts
|
||||
@mixin size($width, $height) {
|
||||
width: $width;
|
||||
height: $height;
|
||||
}
|
||||
@mixin square($size) {
|
||||
@include size($size, $size);
|
||||
}
|
||||
|
||||
// Placeholder text
|
||||
@mixin placeholder($color: $input-color-placeholder) {
|
||||
&:-moz-placeholder { color: $color; } // Firefox 4-18
|
||||
&::-moz-placeholder { color: $color; } // Firefox 19+
|
||||
&:-ms-input-placeholder { color: $color; } // Internet Explorer 10+
|
||||
&::-webkit-input-placeholder { color: $color; } // Safari and Chrome
|
||||
}
|
||||
|
||||
// Text overflow
|
||||
// Requires inline-block or block for proper styling
|
||||
@mixin text-overflow() {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
// CSS image replacement
|
||||
// Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757
|
||||
@mixin hide-text() {
|
||||
font: #{"0/0"} a;
|
||||
color: transparent;
|
||||
text-shadow: none;
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// CSS3 PROPERTIES
|
||||
// --------------------------------------------------
|
||||
|
||||
// Single side border-radius
|
||||
@mixin border-top-radius($radius) {
|
||||
border-top-right-radius: $radius;
|
||||
border-top-left-radius: $radius;
|
||||
}
|
||||
@mixin border-right-radius($radius) {
|
||||
border-bottom-right-radius: $radius;
|
||||
border-top-right-radius: $radius;
|
||||
}
|
||||
@mixin border-bottom-radius($radius) {
|
||||
border-bottom-right-radius: $radius;
|
||||
border-bottom-left-radius: $radius;
|
||||
}
|
||||
@mixin border-left-radius($radius) {
|
||||
border-bottom-left-radius: $radius;
|
||||
border-top-left-radius: $radius;
|
||||
}
|
||||
|
||||
// Drop shadows
|
||||
@mixin box-shadow($shadow) {
|
||||
-webkit-box-shadow: $shadow; // iOS <4.3 & Android <4.1
|
||||
box-shadow: $shadow;
|
||||
}
|
||||
|
||||
// Transitions
|
||||
@mixin transition($transition) {
|
||||
-webkit-transition: $transition;
|
||||
transition: $transition;
|
||||
}
|
||||
@mixin transition-delay($transition-delay) {
|
||||
-webkit-transition-delay: $transition-delay;
|
||||
transition-delay: $transition-delay;
|
||||
}
|
||||
@mixin transition-duration($transition-duration) {
|
||||
-webkit-transition-duration: $transition-duration;
|
||||
transition-duration: $transition-duration;
|
||||
}
|
||||
@mixin transition-transform($transition) {
|
||||
-webkit-transition: -webkit-transform $transition;
|
||||
-moz-transition: -moz-transform $transition;
|
||||
-o-transition: -o-transform $transition;
|
||||
transition: transform $transition;
|
||||
}
|
||||
|
||||
// Transformations
|
||||
@mixin rotate($degrees) {
|
||||
-webkit-transform: rotate($degrees);
|
||||
-ms-transform: rotate($degrees); // IE9+
|
||||
transform: rotate($degrees);
|
||||
}
|
||||
@mixin scale($ratio) {
|
||||
-webkit-transform: scale($ratio);
|
||||
-ms-transform: scale($ratio); // IE9+
|
||||
transform: scale($ratio);
|
||||
}
|
||||
@mixin translate($x, $y) {
|
||||
-webkit-transform: translate($x, $y);
|
||||
-ms-transform: translate($x, $y); // IE9+
|
||||
transform: translate($x, $y);
|
||||
}
|
||||
@mixin skew($x, $y) {
|
||||
-webkit-transform: skew($x, $y);
|
||||
-ms-transform: skewX($x) skewY($y); // See https://github.com/twbs/bootstrap/issues/4885; IE9+
|
||||
transform: skew($x, $y);
|
||||
}
|
||||
@mixin translate3d($x, $y, $z) {
|
||||
-webkit-transform: translate3d($x, $y, $z);
|
||||
transform: translate3d($x, $y, $z);
|
||||
}
|
||||
|
||||
// Backface visibility
|
||||
// Prevent browsers from flickering when using CSS 3D transforms.
|
||||
// Default value is `visible`, but can be changed to `hidden`
|
||||
// See git pull https://github.com/dannykeane/bootstrap.git backface-visibility for examples
|
||||
@mixin backface-visibility($visibility) {
|
||||
-webkit-backface-visibility: $visibility;
|
||||
-moz-backface-visibility: $visibility;
|
||||
backface-visibility: $visibility;
|
||||
}
|
||||
|
||||
// Box sizing
|
||||
@mixin box-sizing($boxmodel) {
|
||||
-webkit-box-sizing: $boxmodel;
|
||||
-moz-box-sizing: $boxmodel;
|
||||
box-sizing: $boxmodel;
|
||||
}
|
||||
|
||||
// User select
|
||||
// For selecting text on the page
|
||||
@mixin user-select($select) {
|
||||
-webkit-user-select: $select;
|
||||
-moz-user-select: $select;
|
||||
-ms-user-select: $select; // IE10+
|
||||
-o-user-select: $select;
|
||||
user-select: $select;
|
||||
}
|
||||
|
||||
// Resize anything
|
||||
@mixin resizable($direction) {
|
||||
resize: $direction; // Options: horizontal, vertical, both
|
||||
overflow: auto; // Safari fix
|
||||
}
|
||||
|
||||
// CSS3 Content Columns
|
||||
@mixin content-columns($column-count, $column-gap: $grid-gutter-width) {
|
||||
-webkit-column-count: $column-count;
|
||||
-moz-column-count: $column-count;
|
||||
column-count: $column-count;
|
||||
-webkit-column-gap: $column-gap;
|
||||
-moz-column-gap: $column-gap;
|
||||
column-gap: $column-gap;
|
||||
}
|
||||
|
||||
// Optional hyphenation
|
||||
@mixin hyphens($mode: auto) {
|
||||
word-wrap: break-word;
|
||||
-webkit-hyphens: $mode;
|
||||
-moz-hyphens: $mode;
|
||||
-ms-hyphens: $mode; // IE10+
|
||||
-o-hyphens: $mode;
|
||||
hyphens: $mode;
|
||||
}
|
||||
|
||||
// Opacity
|
||||
@mixin opacity($opacity) {
|
||||
opacity: $opacity;
|
||||
// IE8 filter
|
||||
$opacity-ie: ($opacity * 100);
|
||||
filter: #{"alpha(opacity=#{opacity-ie})"};
|
||||
}
|
||||
|
||||
|
||||
|
||||
// GRADIENTS
|
||||
// --------------------------------------------------
|
||||
|
||||
#gradient {
|
||||
|
||||
// Horizontal gradient, from left to right
|
||||
//
|
||||
// Creates two color stops, start and end, by specifying a color and position for each color stop.
|
||||
// Color stops are not available in IE9 and below.
|
||||
@mixin horizontal($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {
|
||||
background-image: -webkit-gradient(linear, $start-percent top, $end-percent top, from($start-color), to($end-color)); // Safari 4+, Chrome 2+
|
||||
background-image: -webkit-linear-gradient(left, color-stop($start-color $start-percent), color-stop($end-color $end-percent)); // Safari 5.1+, Chrome 10+
|
||||
background-image: -moz-linear-gradient(left, $start-color $start-percent, $end-color $end-percent); // FF 3.6+
|
||||
background-image: linear-gradient(to right, $start-color $start-percent, $end-color $end-percent); // Standard, IE10
|
||||
background-repeat: repeat-x;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{argb($start-color)}', endColorstr='#{argb($end-color)}', GradientType=1); // IE9 and down
|
||||
}
|
||||
|
||||
// Vertical gradient, from top to bottom
|
||||
//
|
||||
// Creates two color stops, start and end, by specifying a color and position for each color stop.
|
||||
// Color stops are not available in IE9 and below.
|
||||
@mixin vertical($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {
|
||||
background-image: -webkit-gradient(linear, left $start-percent, left $end-percent, from($start-color), to($end-color)); // Safari 4+, Chrome 2+
|
||||
background-image: -webkit-linear-gradient(top, $start-color, $start-percent, $end-color, $end-percent); // Safari 5.1+, Chrome 10+
|
||||
background-image: -moz-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // FF 3.6+
|
||||
background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent); // Standard, IE10
|
||||
background-repeat: repeat-x;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{argb($start-color)}', endColorstr='#{argb($end-color)}', GradientType=0); // IE9 and down
|
||||
}
|
||||
|
||||
@mixin directional($start-color: #555, $end-color: #333, $deg: 45deg) {
|
||||
background-repeat: repeat-x;
|
||||
background-image: -webkit-linear-gradient($deg, $start-color, $end-color); // Safari 5.1+, Chrome 10+
|
||||
background-image: -moz-linear-gradient($deg, $start-color, $end-color); // FF 3.6+
|
||||
background-image: linear-gradient($deg, $start-color, $end-color); // Standard, IE10
|
||||
}
|
||||
@mixin horizontal-three-colors($start-color: #00b3ee, $mid-color: #7a43b6, $color-stop: 50%, $end-color: #c3325f) {
|
||||
background-image: -webkit-gradient(left, linear, 0 0, 0 100%, from($start-color), color-stop($color-stop, $mid-color), to($end-color));
|
||||
background-image: -webkit-linear-gradient(left, $start-color, $mid-color $color-stop, $end-color);
|
||||
background-image: -moz-linear-gradient(left, $start-color, $mid-color $color-stop, $end-color);
|
||||
background-image: linear-gradient(to right, $start-color, $mid-color $color-stop, $end-color);
|
||||
background-repeat: no-repeat;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{argb($start-color)}', endColorstr='#{argb($end-color)}', GradientType=1); // IE9 and down
|
||||
}
|
||||
@mixin vertical-three-colors($start-color: #00b3ee, $mid-color: #7a43b6, $color-stop: 50%, $end-color: #c3325f) {
|
||||
background-image: -webkit-gradient(linear, 0 0, 0 100%, from($start-color), color-stop($color-stop, $mid-color), to($end-color));
|
||||
background-image: -webkit-linear-gradient($start-color, $mid-color $color-stop, $end-color);
|
||||
background-image: -moz-linear-gradient(top, $start-color, $mid-color $color-stop, $end-color);
|
||||
background-image: linear-gradient($start-color, $mid-color $color-stop, $end-color);
|
||||
background-repeat: no-repeat;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{argb($start-color)}', endColorstr='#{argb($end-color)}', GradientType=0); // IE9 and down
|
||||
}
|
||||
@mixin radial($inner-color: #555, $outer-color: #333) {
|
||||
background-image: -webkit-gradient(radial, center center, 0, center center, 460, from($inner-color), to($outer-color));
|
||||
background-image: -webkit-radial-gradient(circle, $inner-color, $outer-color);
|
||||
background-image: -moz-radial-gradient(circle, $inner-color, $outer-color);
|
||||
background-image: radial-gradient(circle, $inner-color, $outer-color);
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
@mixin striped($color: #555, $angle: 45deg) {
|
||||
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255,255,255,.15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255,255,255,.15)), color-stop(.75, rgba(255,255,255,.15)), color-stop(.75, transparent), to(transparent));
|
||||
background-image: -webkit-linear-gradient($angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
|
||||
background-image: -moz-linear-gradient($angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
|
||||
background-image: linear-gradient($angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
|
||||
}
|
||||
}
|
||||
|
||||
// Reset filters for IE
|
||||
//
|
||||
// When you need to remove a gradient background, do not forget to use this to reset
|
||||
// the IE filter for IE9 and below.
|
||||
@mixin reset-filter() {
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Retina images
|
||||
//
|
||||
// Short retina mixin for setting background-image and -size
|
||||
|
||||
@mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {
|
||||
background-image: image-url("#{$file-1x}");
|
||||
background-size: $width-1x $height-1x;
|
||||
|
||||
@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) {
|
||||
background-image: image-url("#{$file-2x}");
|
||||
background-size: $width-1x $height-1x;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Responsive image
|
||||
//
|
||||
// Keep images from scaling beyond the width of their parents.
|
||||
|
||||
@mixin img-responsive($display: block) {
|
||||
display: $display;
|
||||
max-width: 100%; // Part 1: Set a maximum relative to the parent
|
||||
height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
|
||||
}
|
||||
|
||||
|
||||
// COMPONENT MIXINS
|
||||
// --------------------------------------------------
|
||||
|
||||
// Horizontal dividers
|
||||
// -------------------------
|
||||
// Dividers (basically an hr) within dropdowns and nav lists
|
||||
@mixin nav-divider($color: #e5e5e5) {
|
||||
height: 1px;
|
||||
margin: (($line-height-computed / 2) - 1) 0;
|
||||
overflow: hidden;
|
||||
background-color: $color;
|
||||
}
|
||||
|
||||
// Panels
|
||||
// -------------------------
|
||||
@mixin panel-variant($border, $heading-text-color, $heading-bg-color, $heading-border) {
|
||||
border-color: $border;
|
||||
& > .panel-heading {
|
||||
color: $heading-text-color;
|
||||
background-color: $heading-bg-color;
|
||||
border-color: $heading-border;
|
||||
+ .panel-collapse .panel-body {
|
||||
border-top-color: $border;
|
||||
}
|
||||
}
|
||||
& > .panel-footer {
|
||||
+ .panel-collapse .panel-body {
|
||||
border-bottom-color: $border;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Alerts
|
||||
// -------------------------
|
||||
@mixin alert-variant($background, $border, $text-color) {
|
||||
background-color: $background;
|
||||
border-color: $border;
|
||||
color: $text-color;
|
||||
hr {
|
||||
border-top-color: darken($border, 5%);
|
||||
}
|
||||
.alert-link {
|
||||
color: darken($text-color, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
// Tables
|
||||
// -------------------------
|
||||
@mixin table-row-variant($state, $background, $border) {
|
||||
// Exact selectors below required to override `.table-striped` and prevent
|
||||
// inheritance to nested tables.
|
||||
.table > thead > tr,
|
||||
.table > tbody > tr,
|
||||
.table > tfoot > tr {
|
||||
> td.#{state},
|
||||
> th.#{state},
|
||||
&.#{state} > td,
|
||||
&.#{state} > th {
|
||||
background-color: $background;
|
||||
border-color: $border;
|
||||
}
|
||||
}
|
||||
|
||||
// Hover states for `.table-hover`
|
||||
// Note: this is not available for cells or rows within `thead` or `tfoot`.
|
||||
.table-hover > tbody > tr {
|
||||
> td.#{state}:hover,
|
||||
> th.#{state}:hover,
|
||||
&.#{state}:hover > td {
|
||||
background-color: darken($background, 5%);
|
||||
border-color: darken($border, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Button variants
|
||||
// -------------------------
|
||||
// Easily pump out default styles, as well as :hover, :focus, :active,
|
||||
// and disabled options for all buttons
|
||||
@mixin button-variant($color, $background, $border) {
|
||||
color: $color;
|
||||
background-color: $background;
|
||||
border-color: $border;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active,
|
||||
.open .dropdown-toggle& {
|
||||
color: $color;
|
||||
background-color: darken($background, 8%);
|
||||
border-color: darken($border, 12%);
|
||||
}
|
||||
&:active,
|
||||
&.active,
|
||||
.open .dropdown-toggle& {
|
||||
background-image: none;
|
||||
}
|
||||
&.disabled,
|
||||
&[disabled],
|
||||
fieldset[disabled] & {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active {
|
||||
background-color: $background;
|
||||
border-color: $border
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Button sizes
|
||||
// -------------------------
|
||||
@mixin button-size($padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) {
|
||||
padding: $padding-vertical $padding-horizontal;
|
||||
font-size: $font-size;
|
||||
line-height: $line-height;
|
||||
border-radius: $border-radius;
|
||||
}
|
||||
|
||||
// Pagination
|
||||
// -------------------------
|
||||
@mixin pagination-size($padding-vertical, $padding-horizontal, $font-size, $border-radius) {
|
||||
> li {
|
||||
> a,
|
||||
> span {
|
||||
padding: $padding-vertical $padding-horizontal;
|
||||
font-size: $font-size;
|
||||
}
|
||||
&:first-child {
|
||||
> a,
|
||||
> span {
|
||||
@include border-left-radius($border-radius);
|
||||
}
|
||||
}
|
||||
&:last-child {
|
||||
> a,
|
||||
> span {
|
||||
@include border-right-radius($border-radius);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Labels
|
||||
// -------------------------
|
||||
@mixin label-variant($color) {
|
||||
background-color: $color;
|
||||
&[href] {
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: darken($color, 10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Navbar vertical align
|
||||
// -------------------------
|
||||
// Vertically center elements in the navbar.
|
||||
// Example: an element has a height of 30px, so write out `@include navbar-vertical-align(30px);` to calculate the appropriate top margin.
|
||||
@mixin navbar-vertical-align($element-height) {
|
||||
margin-top: (($navbar-height - $element-height) / 2);
|
||||
margin-bottom: (($navbar-height - $element-height) / 2);
|
||||
}
|
||||
|
||||
// Progress bars
|
||||
// -------------------------
|
||||
// @mixin progress-bar-variant($color) {
|
||||
// background-color: $color;
|
||||
// .progress-striped & {
|
||||
// #gradient > @include striped($color);
|
||||
// }
|
||||
// }
|
||||
|
||||
// Responsive utilities
|
||||
// -------------------------
|
||||
// More easily include all the states for responsive-utilities.less.
|
||||
@mixin responsive-visibility() {
|
||||
display: block !important;
|
||||
tr& { display: table-row !important; }
|
||||
th&,
|
||||
td& { display: table-cell !important; }
|
||||
}
|
||||
|
||||
@mixin responsive-invisibility() {
|
||||
display: none !important;
|
||||
tr& { display: none !important; }
|
||||
th&,
|
||||
td& { display: none !important; }
|
||||
}
|
||||
|
||||
// Grid System
|
||||
// -----------
|
||||
|
||||
// Centered container element
|
||||
@mixin container-fixed() {
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
padding-left: ($grid-gutter-width / 2);
|
||||
padding-right: ($grid-gutter-width / 2);
|
||||
@include clearfix();
|
||||
}
|
||||
|
||||
// Creates a wrapper for a series of columns
|
||||
@mixin make-row($gutter: $grid-gutter-width) {
|
||||
margin-left: ($gutter / -2);
|
||||
margin-right: ($gutter / -2);
|
||||
@include clearfix();
|
||||
}
|
||||
|
||||
// Generate the extra small columns
|
||||
@mixin make-xs-column($columns, $gutter: $grid-gutter-width) {
|
||||
position: relative;
|
||||
float: left;
|
||||
width: percentage(($columns / $grid-columns));
|
||||
// Prevent columns from collapsing when empty
|
||||
min-height: 1px;
|
||||
// Inner gutter via padding
|
||||
padding-left: ($gutter / 2);
|
||||
padding-right: ($gutter / 2);
|
||||
}
|
||||
|
||||
// Generate the small columns
|
||||
@mixin make-sm-column($columns, $gutter: $grid-gutter-width) {
|
||||
position: relative;
|
||||
// Prevent columns from collapsing when empty
|
||||
min-height: 1px;
|
||||
// Inner gutter via padding
|
||||
padding-left: ($gutter / 2);
|
||||
padding-right: ($gutter / 2);
|
||||
|
||||
// Calculate width based on number of columns available
|
||||
@media (min-width: $screen-sm) {
|
||||
float: left;
|
||||
width: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
|
||||
// Generate the small column offsets
|
||||
@mixin make-sm-column-offset($columns) {
|
||||
@media (min-width: $screen-sm) {
|
||||
margin-left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-sm-column-push($columns) {
|
||||
@media (min-width: $screen-sm) {
|
||||
left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-sm-column-pull($columns) {
|
||||
@media (min-width: $screen-sm) {
|
||||
right: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
|
||||
// Generate the medium columns
|
||||
@mixin make-md-column($columns, $gutter: $grid-gutter-width) {
|
||||
position: relative;
|
||||
// Prevent columns from collapsing when empty
|
||||
min-height: 1px;
|
||||
// Inner gutter via padding
|
||||
padding-left: ($gutter / 2);
|
||||
padding-right: ($gutter / 2);
|
||||
|
||||
// Calculate width based on number of columns available
|
||||
@media (min-width: $screen-md) {
|
||||
float: left;
|
||||
width: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
|
||||
// Generate the large column offsets
|
||||
@mixin make-md-column-offset($columns) {
|
||||
@media (min-width: $screen-md) {
|
||||
margin-left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-md-column-push($columns) {
|
||||
@media (min-width: $screen-md) {
|
||||
left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-md-column-pull($columns) {
|
||||
@media (min-width: $screen-md) {
|
||||
right: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
|
||||
// Generate the large columns
|
||||
@mixin make-lg-column($columns, $gutter: $grid-gutter-width) {
|
||||
position: relative;
|
||||
// Prevent columns from collapsing when empty
|
||||
min-height: 1px;
|
||||
// Inner gutter via padding
|
||||
padding-left: ($gutter / 2);
|
||||
padding-right: ($gutter / 2);
|
||||
|
||||
// Calculate width based on number of columns available
|
||||
@media (min-width: $screen-lg) {
|
||||
float: left;
|
||||
width: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
|
||||
// Generate the large column offsets
|
||||
@mixin make-lg-column-offset($columns) {
|
||||
@media (min-width: $screen-lg) {
|
||||
margin-left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-lg-column-push($columns) {
|
||||
@media (min-width: $screen-lg) {
|
||||
left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-lg-column-pull($columns) {
|
||||
@media (min-width: $screen-lg) {
|
||||
right: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Form validation states
|
||||
//
|
||||
// Used in forms.less to generate the form validation CSS for warnings, errors,
|
||||
// and successes.
|
||||
|
||||
@mixin form-control-validation($text-color: #555, $border-color: #ccc, $background-color: #f5f5f5) {
|
||||
// Color the label and help text
|
||||
.help-block,
|
||||
.control-label {
|
||||
color: $text-color;
|
||||
}
|
||||
// Set the border and box shadow on specific inputs to match
|
||||
.form-control {
|
||||
border-color: $border-color;
|
||||
@include box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
|
||||
&:focus {
|
||||
border-color: darken($border-color, 10%);
|
||||
$shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten($border-color, 20%);
|
||||
@include box-shadow($shadow);
|
||||
}
|
||||
}
|
||||
// Set validation states also for addons
|
||||
.input-group-addon {
|
||||
color: $text-color;
|
||||
border-color: $border-color;
|
||||
background-color: $background-color;
|
||||
}
|
||||
}
|
||||
|
||||
// Form control focus state
|
||||
//
|
||||
// Generate a customized focus state and for any input with the specified color,
|
||||
// which defaults to the `$input-focus-border` variable.
|
||||
//
|
||||
// We highly encourage you to not customize the default value, but instead use
|
||||
// this to tweak colors on an as-needed basis. This aesthetic change is based on
|
||||
// WebKit's default styles, but applicable to a wider range of browsers. Its
|
||||
// usability and accessibility should be taken into account with any change.
|
||||
//
|
||||
// Example usage: change the default blue border and shadow to white for better
|
||||
// contrast against a dark gray background.
|
||||
|
||||
@mixin form-control-focus($color: $input-border-focus) {
|
||||
$color-rgba: rgba(red($color), green($color), blue($color), .6);
|
||||
&:focus {
|
||||
border-color: $color;
|
||||
outline: 0;
|
||||
@include box-shadow(#{"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px #{color-rgba}"});
|
||||
}
|
||||
}
|
||||
|
||||
// Form control sizing
|
||||
//
|
||||
// Relative text size, padding, and border-radii changes for form controls. For
|
||||
// horizontal sizing, wrap controls in the predefined grid classes. `<select>`
|
||||
// element gets special love because it's special, and that's a fact!
|
||||
|
||||
@mixin input-size($input-height, $padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) {
|
||||
height: $input-height;
|
||||
padding: $padding-vertical $padding-horizontal;
|
||||
font-size: $font-size;
|
||||
line-height: $line-height;
|
||||
border-radius: $border-radius;
|
||||
|
||||
select& {
|
||||
height: $input-height;
|
||||
line-height: $input-height;
|
||||
}
|
||||
|
||||
textarea& {
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//mixins
|
||||
@mixin img-retina($image1x, $image, $width, $height) {
|
||||
background-image: url($image1x);
|
||||
background-size: $width $height;
|
||||
background-repeat: no-repeat;
|
||||
|
||||
@media (min--moz-device-pixel-ratio: 1.3),
|
||||
(-o-min-device-pixel-ratio: 2.6/2),
|
||||
(-webkit-min-device-pixel-ratio: 1.3),
|
||||
(min-device-pixel-ratio: 1.3),
|
||||
(min-resolution: 1.3dppx) {
|
||||
/* on retina, use image that's scaled by 2 */
|
||||
background-image: url($image);
|
||||
background-size: $width $height;
|
||||
}
|
||||
}
|
||||
|
||||
//wrapper for img-retina when using pngs
|
||||
@mixin img-ret-rails-jpg($img-name, $width, $height){
|
||||
@include img-retina( asset_path('#{$imagePath}#{$img-name}.jpg'), asset_path('#{$imagePath}#{$img-name}@2x.jpg'), $width, $height);
|
||||
}
|
||||
|
||||
@mixin img-ret-rails-png($img-name, $width, $height){
|
||||
@include img-retina( asset_path('#{$imagePath}#{$img-name}.png'), asset_path('#{$imagePath}#{$img-name}@2x.png'), $width, $height);
|
||||
}
|
||||
|
||||
|
||||
@mixin btn-shadow{
|
||||
box-shadow: 2px 3px 2px rgba(0,0,0,0.08);
|
||||
}
|
||||
481
website/source/assets/stylesheets/_sidebar.scss
Normal file
@@ -0,0 +1,481 @@
|
||||
|
||||
// Base variables
|
||||
// --------------------------------------------------
|
||||
$screen-tablet: 768px;
|
||||
|
||||
$gray-darker: #212121; // #212121 - text
|
||||
$gray-dark: #757575; // #757575 - secondary text, icons
|
||||
$gray: #bdbdbd; // #bdbdbd - hint text
|
||||
$gray-light: #e0e0e0; // #e0e0e0 - divider
|
||||
$gray-lighter: #f5f5f5; // #f5f5f5 - background
|
||||
|
||||
/* -- Sidebar style ------------------------------- */
|
||||
|
||||
// Sidebar variables
|
||||
// --------------------------------------------------
|
||||
$zindex-sidebar-fixed: 1035;
|
||||
|
||||
$sidebar-desktop-width: 280px;
|
||||
$sidebar-width: 240px;
|
||||
|
||||
|
||||
$sidebar-padding: 16px;
|
||||
$sidebar-divider: $sidebar-padding/2;
|
||||
|
||||
$sidebar-nav-height: 48px;
|
||||
|
||||
$sidebar-icon-width: 40px;
|
||||
$sidebar-icon-height: 20px;
|
||||
|
||||
$sidebar-badge-size: $sidebar-nav-height/2;
|
||||
$sidebar-badge-font-size: 10px;
|
||||
|
||||
$sidebar-brand-color: $gray-dark;
|
||||
$sidebar-icon-color: $gray-dark;
|
||||
$sidebar-menu-color: $gray-darker;
|
||||
|
||||
|
||||
$sidebar-font-weight: 300;
|
||||
|
||||
// Sidebar mixins
|
||||
// --------------------------------------------------
|
||||
|
||||
// Sidebar horizontal block
|
||||
//
|
||||
// This settings will extended by .sidebar-text, .sidebar-brand and .sidebar-nav>li>a
|
||||
@mixin sidebar-block()
|
||||
{
|
||||
display: block;
|
||||
line-height: $sidebar-nav-height;
|
||||
padding: 0;
|
||||
//padding-left: ($sidebar-padding + $sidebar-badge-size) + $sidebar-padding;
|
||||
//padding-right: ($sidebar-padding + $sidebar-badge-size) + $sidebar-padding;
|
||||
text-decoration: none;
|
||||
clear: both;
|
||||
@include lato-light();
|
||||
font-weight: $sidebar-font-weight;
|
||||
//@include text-overflow();
|
||||
@include transition(all .2s ease-in-out);
|
||||
|
||||
&:hover, &:focus {
|
||||
@include box-shadow(none);
|
||||
outline: none;
|
||||
}
|
||||
|
||||
// positioning caret in sidebar block
|
||||
.caret {
|
||||
position: absolute;
|
||||
right: $sidebar-padding + $sidebar-badge-size/2 - 4px; // caret centered by badge position; 4px - caret width
|
||||
top: $sidebar-nav-height/2;
|
||||
}
|
||||
// positioning badge in sidebar block
|
||||
.sidebar-badge {
|
||||
position: absolute;
|
||||
right: $sidebar-padding;
|
||||
top: ($sidebar-nav-height - $sidebar-badge-size)/2 ;
|
||||
}
|
||||
}
|
||||
|
||||
// Sidebar design template
|
||||
//
|
||||
// You can make own sidebar style with this template
|
||||
@mixin sidebar-template(
|
||||
$color,
|
||||
$bg,
|
||||
$header-bg,
|
||||
$brand-color,
|
||||
$brand-bg,
|
||||
$brand-hover-color,
|
||||
$brand-hover-bg,
|
||||
$divider,
|
||||
$badge-color,
|
||||
$badge-bg,
|
||||
$icon-color,
|
||||
$icon-hover-color,
|
||||
$link-color,
|
||||
$link-bg,
|
||||
$link-hover-color,
|
||||
$link-hover-bg,
|
||||
$link-active-color,
|
||||
$link-active-bg,
|
||||
$link-disabled-color,
|
||||
$link-disabled-bg
|
||||
) {
|
||||
|
||||
background-color: $bg;
|
||||
|
||||
ul{
|
||||
padding-left: 0;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.sidebar-header {
|
||||
background-color: $header-bg;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.sidebar-divider, .sidebar-nav .divider {
|
||||
background-color: $divider;
|
||||
}
|
||||
|
||||
.sidebar-text {
|
||||
color: $color;
|
||||
}
|
||||
|
||||
.buttons-nav{
|
||||
margin-top: 10px;
|
||||
text-align: center;
|
||||
a{
|
||||
min-width: 148px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-nav {
|
||||
text-align: center;
|
||||
//border-bottom: 1px solid $faint-gray;
|
||||
padding-bottom: 8px;
|
||||
|
||||
&:last-child{
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
li > a {
|
||||
color: $link-color;
|
||||
background-color: $link-bg;
|
||||
|
||||
i {
|
||||
color: $icon-color;
|
||||
}
|
||||
}
|
||||
li:hover > a, li > a:hover {
|
||||
color: $link-hover-color;
|
||||
background-color: $link-hover-bg;
|
||||
|
||||
i {
|
||||
color: $icon-hover-color;
|
||||
}
|
||||
}
|
||||
li:focus > a, li > a:focus {
|
||||
color: $link-color;
|
||||
background-color: $link-bg;
|
||||
|
||||
i {
|
||||
color: $icon-hover-color;
|
||||
}
|
||||
}
|
||||
|
||||
> .open > a {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $link-hover-color;
|
||||
background-color: $link-hover-bg;
|
||||
}
|
||||
}
|
||||
|
||||
> .active > a {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $link-active-color;
|
||||
background-color: $link-active-bg;
|
||||
}
|
||||
}
|
||||
> .disabled > a {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $link-disabled-color;
|
||||
background-color: $link-disabled-bg;
|
||||
}
|
||||
}
|
||||
> li > .ink {
|
||||
//background: #80d8ff;
|
||||
//opacity: 0.5;
|
||||
}
|
||||
|
||||
// Dropdown menu items
|
||||
> .dropdown {
|
||||
// Remove background color from open dropdown
|
||||
> .dropdown-menu {
|
||||
|
||||
background-color: $link-hover-bg;
|
||||
|
||||
> li > a {
|
||||
&:focus {
|
||||
background-color: $link-hover-bg;
|
||||
color: $link-hover-color;
|
||||
}
|
||||
&:hover {
|
||||
background-color: darken($link-hover-bg, 7%);
|
||||
color: $link-hover-color;
|
||||
}
|
||||
}
|
||||
|
||||
> .active > a {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $link-active-color;
|
||||
background-color: $link-active-bg;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
// Sidebars
|
||||
// --------------------------------------------------
|
||||
|
||||
// Wrapper and base class
|
||||
//
|
||||
// Provide a static sidebar from which we expand to create other sidebar variations.
|
||||
.sidebar {
|
||||
position: relative;
|
||||
display: block;
|
||||
min-height: 100%;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
border: none;
|
||||
@include transition(all 0.5s cubic-bezier(0.55, 0, 0.1, 1));
|
||||
@include clearfix();
|
||||
}
|
||||
|
||||
// Sidebar Elements
|
||||
//
|
||||
// Basic style of sidebar elements
|
||||
.sidebar {
|
||||
|
||||
// Sidebar heading
|
||||
//----------------
|
||||
.sidebar-header {
|
||||
position: relative;
|
||||
margin-bottom: $sidebar-divider;
|
||||
@include transition(all .2s ease-in-out);
|
||||
//border-bottom: 1px solid $faint-gray;
|
||||
|
||||
.buttons{
|
||||
text-align: center;
|
||||
padding: $xsmall-pad 0 $small-pad;
|
||||
a{
|
||||
&.outline-btn{
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-image {
|
||||
padding-top: 24px;
|
||||
img {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
// Brand/project name
|
||||
//
|
||||
// In google guideline used for email dropdown
|
||||
.sidebar-brand {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
@include sidebar-block();
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Sidebar text
|
||||
//----------------
|
||||
.sidebar-text {
|
||||
@include sidebar-block();
|
||||
}
|
||||
|
||||
// Sidebar icons
|
||||
//----------------
|
||||
.sidebar-icon {
|
||||
display: inline-block;
|
||||
height: $sidebar-icon-height;
|
||||
margin-right: $sidebar-divider;
|
||||
text-align: left;
|
||||
font-size: $sidebar-icon-height;
|
||||
vertical-align: middle;
|
||||
|
||||
&:before, &:after {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
// This values only for this icons and only for this example
|
||||
// Idea is that icons must be equal width
|
||||
&.icon-development {
|
||||
width: 22px;
|
||||
@include img-ret-rails-png('runtime-develop-icon-color', 22px, $sidebar-icon-height );
|
||||
}
|
||||
&.icon-operations {
|
||||
width: 21px;
|
||||
@include img-ret-rails-png('runtime-deploy-icon-color', 21px, $sidebar-icon-height );
|
||||
}
|
||||
&.icon-runtime {
|
||||
width: 20px;
|
||||
@include img-ret-rails-png('runtime-maintain-icon-color', 20px, $sidebar-icon-height );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Sidebar navigation class
|
||||
// ------------------------
|
||||
.sidebar .sidebar-nav {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
// Links
|
||||
//----------------
|
||||
li {
|
||||
position: relative;
|
||||
list-style-type: none;
|
||||
|
||||
a {
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
@include sidebar-block();
|
||||
|
||||
&:hover {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Sidebar color theme variations
|
||||
//
|
||||
// ------------------------
|
||||
.sidebar-default {
|
||||
@include sidebar-template(
|
||||
$color: $gray-darker,
|
||||
$bg: #fff,
|
||||
$header-bg: $white,
|
||||
$brand-color: $gray-dark,
|
||||
$brand-bg: transparent,
|
||||
$brand-hover-color: $gray-darker,
|
||||
$brand-hover-bg: rgba(0, 0, 0, 0.10),
|
||||
$divider: $gray,
|
||||
$badge-color: #fff,
|
||||
$badge-bg: $gray,
|
||||
$icon-color: $gray-dark,
|
||||
$icon-hover-color: $gray-dark,
|
||||
$link-color: $gray-darker,
|
||||
$link-bg: transparent,
|
||||
$link-hover-color: $gray-darker,
|
||||
$link-hover-bg: lighten($faint-gray, 6%),
|
||||
$link-active-color: $gray-darker,
|
||||
$link-active-bg: $gray-light,
|
||||
$link-disabled-color: $gray-light,
|
||||
$link-disabled-bg: transparent
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
// Sidebar toggling
|
||||
//
|
||||
// Hide sidebar
|
||||
.sidebar {
|
||||
width: 0;
|
||||
@include translate3d(-$sidebar-desktop-width, 0, 0);
|
||||
|
||||
&.open {
|
||||
min-width: $sidebar-desktop-width;
|
||||
width: $sidebar-desktop-width;
|
||||
@include translate3d(0, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
// Sidebar positions: fix the left/right sidebars
|
||||
.sidebar-fixed-left,
|
||||
.sidebar-fixed-right,
|
||||
.sidebar-stacked {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
z-index: $zindex-sidebar-fixed;
|
||||
}
|
||||
.sidebar-stacked {
|
||||
left: 0;
|
||||
}
|
||||
.sidebar-fixed-left {
|
||||
left: 0;
|
||||
box-shadow: 2px 0px 25px rgba(0,0,0,0.15);
|
||||
-webkit-box-shadow: 2px 0px 25px rgba(0,0,0,0.15);
|
||||
}
|
||||
.sidebar-fixed-right {
|
||||
right: 0;
|
||||
box-shadow: 0px 2px 25px rgba(0,0,0,0.15);
|
||||
-webkit-box-shadow: 0px 2px 25px rgba(0,0,0,0.15);
|
||||
|
||||
@include translate3d($sidebar-desktop-width, 0, 0);
|
||||
&.open {
|
||||
@include translate3d(0, 0, 0);
|
||||
}
|
||||
.icon-material-sidebar-arrow:before {
|
||||
content: "\e614"; // icon-material-arrow-forward
|
||||
}
|
||||
}
|
||||
|
||||
// Sidebar size
|
||||
//
|
||||
// Change size of sidebar and sidebar elements on small screens
|
||||
@media (max-width: $screen-tablet) {
|
||||
.sidebar.open {
|
||||
min-width: $sidebar-width;
|
||||
width: $sidebar-width;
|
||||
}
|
||||
|
||||
.sidebar .sidebar-header {
|
||||
//height: $sidebar-width * 9/16; // 16:9 header dimension
|
||||
}
|
||||
|
||||
.sidebar .sidebar-image {
|
||||
/* img {
|
||||
width: $sidebar-width/4 - $sidebar-padding;
|
||||
height: $sidebar-width/4 - $sidebar-padding;
|
||||
} */
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-overlay {
|
||||
visibility: hidden;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
background: $white;
|
||||
z-index: $zindex-sidebar-fixed - 1;
|
||||
|
||||
-webkit-transition: visibility 0 linear .4s,opacity .4s cubic-bezier(.4,0,.2,1);
|
||||
-moz-transition: visibility 0 linear .4s,opacity .4s cubic-bezier(.4,0,.2,1);
|
||||
transition: visibility 0 linear .4s,opacity .4s cubic-bezier(.4,0,.2,1);
|
||||
-webkit-transform: translateZ(0);
|
||||
-moz-transform: translateZ(0);
|
||||
-ms-transform: translateZ(0);
|
||||
-o-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
}
|
||||
|
||||
.sidebar-overlay.active {
|
||||
opacity: 0.8;
|
||||
visibility: visible;
|
||||
-webkit-transition-delay: 0;
|
||||
-moz-transition-delay: 0;
|
||||
transition-delay: 0;
|
||||
}
|
||||
68
website/source/assets/stylesheets/_utilities.scss
Executable file
@@ -0,0 +1,68 @@
|
||||
//
|
||||
// Utility classes
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
//
|
||||
// -------------------------
|
||||
|
||||
@mixin anti-alias() {
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
@mixin consul-gradient-bg() {
|
||||
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 */
|
||||
|
||||
}
|
||||
|
||||
@mixin lato-light() {
|
||||
font-family: $font-family-lato;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
@mixin open-light() {
|
||||
font-family: $font-family-open-sans;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
@mixin open() {
|
||||
font-family: $font-family-open-sans;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
@mixin open-bold() {
|
||||
font-family: $font-family-open-sans;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
@mixin skewY($skew) {
|
||||
-webkit-transform: skewY($skew);
|
||||
-moz-transform: skewY($skew);
|
||||
-ms-transform: skewY($skew);
|
||||
-o-transform: skewY($skew);
|
||||
transform: skewY($skew);
|
||||
}
|
||||
|
||||
@mixin v-nav-style{
|
||||
margin: 0 15px;
|
||||
padding: 0;
|
||||
line-height: 26px;
|
||||
color: $black;
|
||||
font-size: 14px;
|
||||
font-weight: 300;
|
||||
@include transition( color 0.3s ease );
|
||||
|
||||
&:hover{
|
||||
color: $blue;
|
||||
@include transition( color 0.3s ease );
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
72
website/source/assets/stylesheets/_variables.scss
Executable file
@@ -0,0 +1,72 @@
|
||||
//
|
||||
// Variables
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
// Global values
|
||||
// --------------------------------------------------
|
||||
|
||||
$header-height: 90px;
|
||||
$btn-border-radius: 4px;
|
||||
$el-border-radius: 6px;
|
||||
// colors
|
||||
// -------------------------
|
||||
|
||||
$white: #fff;
|
||||
$black: #000;
|
||||
$gray: #929199;
|
||||
$light-gray: #C2C1C7;
|
||||
$faint-gray: #E3E3EA;
|
||||
$dark-blue: #00ABE0;
|
||||
$blue: #00BFE0;
|
||||
$light-black: #242424;
|
||||
$orange: #e78c5b;
|
||||
$green: #5be764;
|
||||
$gray-darker: #555;
|
||||
$gray: #777;
|
||||
$gray-light: #939393;
|
||||
$gray-lighter: #979797;
|
||||
$red: #dd4e58;
|
||||
$red-dark: #c5454e;
|
||||
$purple: #822ff7;
|
||||
$light-purple: #f7f3f9;
|
||||
$btn-color: #4592C5;
|
||||
|
||||
|
||||
// Scaffolding
|
||||
// -------------------------
|
||||
$body-bg: #fff;
|
||||
$text-color: $gray;
|
||||
|
||||
// Links
|
||||
// -------------------------
|
||||
$link-color: $red-dark;
|
||||
$link-hover-color: darken($link-color, 15%);
|
||||
|
||||
// Typography
|
||||
// -------------------------
|
||||
$font-family-open-sans: 'Open Sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
$font-family-lato: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
$font-weight-lato-xl: 300;
|
||||
$font-weight-lato-reg: 300;
|
||||
$font-weight-lato-sb: 500;
|
||||
$font-weight-lato-xb: 700;
|
||||
$font-weight-open: $font-weight-lato-reg;
|
||||
|
||||
|
||||
$text-shadow: 1px 1px 1px #000;
|
||||
$shadow: $text-shadow;
|
||||
|
||||
|
||||
//
|
||||
// ----
|
||||
$imagePath: "atlas/";
|
||||
|
||||
//margin + padding
|
||||
$xsmall-pad: 20px;
|
||||
$small-pad: 30px;
|
||||
$med-pad: 70px;
|
||||
$large-pad: 120px;
|
||||
$xl-pad: 150px;
|
||||
|
||||
$light-outline: #f7f7f7;
|
||||
30
website/source/assets/stylesheets/application.scss
Executable file
@@ -0,0 +1,30 @@
|
||||
@import 'bootstrap-sprockets';
|
||||
@import 'bootstrap';
|
||||
|
||||
@import url("//fonts.googleapis.com/css?family=Lato:300,400,700|Open+Sans:300,600,400");
|
||||
|
||||
// Core variables and mixins
|
||||
@import '_variables';
|
||||
@import '_mixins';
|
||||
|
||||
// Utility classes
|
||||
@import '_utilities';
|
||||
|
||||
// Core CSS
|
||||
@import '_fonts';
|
||||
|
||||
//Global Site
|
||||
@import '_global';
|
||||
|
||||
// Components
|
||||
@import '_header';
|
||||
@import '_footer';
|
||||
@import '_jumbotron';
|
||||
@import '_buttons';
|
||||
@import '_sidebar';
|
||||
|
||||
// Pages
|
||||
@import '_home';
|
||||
@import '_community';
|
||||
@import '_docs';
|
||||
@import '_downloads';
|
||||
83
website/source/community.html.erb
Normal file
@@ -0,0 +1,83 @@
|
||||
---
|
||||
layout: "inner"
|
||||
page_title: "Community"
|
||||
description: |-
|
||||
Vault is a new project with a growing community. Despite this, there are active, dedicated users willing to help you through various mediums.
|
||||
---
|
||||
|
||||
<h1>Community</h1>
|
||||
|
||||
<p>
|
||||
Vault is a new project with a growing community. Despite this,
|
||||
there are active, dedicated users willing to help you through various
|
||||
mediums.
|
||||
</p>
|
||||
<p>
|
||||
<strong>IRC:</strong> <code>#vault-tool</code> on Freenode
|
||||
</p>
|
||||
<p>
|
||||
<strong>Mailing list:</strong>
|
||||
<a href="https://groups.google.com/group/vault-tool">Vault Google Group</a>
|
||||
</p>
|
||||
<p>
|
||||
<strong>Bug Tracker:</strong>
|
||||
<a href="https://github.com/hashicorp/vault/issues">Issue tracker
|
||||
on GitHub</a>. Please only use this for reporting bugs. Do not ask
|
||||
for general help here. Use IRC or the mailing list for that.
|
||||
|
||||
<h1>People</h1>
|
||||
<p>
|
||||
The following people are some of the faces behind Vault. They each
|
||||
contribute to Vault in some core way. Over time, faces may appear and
|
||||
disappear from this list as contributors come and go.
|
||||
</p>
|
||||
<div class="people">
|
||||
<div class="person">
|
||||
<img class="pull-left" src="http://www.gravatar.com/avatar/54079122b67de9677c1f93933ce8b63a.png?s=125">
|
||||
<div class="bio">
|
||||
<h3>Mitchell Hashimoto (<a href="https://github.com/mitchellh">@mitchellh</a>)</h3>
|
||||
<p>
|
||||
Mitchell Hashimoto is the creator of Vault and works on all
|
||||
layers of Vault from the core to providers. In addition to Vault,
|
||||
Mitchell is the creator of
|
||||
<a href="https://www.vagrantup.com">Vagrant</a>,
|
||||
<a href="https://www.packer.io">Packer</a>, and
|
||||
<a href="https://www.consul.io">Consul</a>.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="person">
|
||||
<img class="pull-left" src="http://www.gravatar.com/avatar/11ba9630c9136eef9a70d26473d355d5.png?s=125">
|
||||
<div class="bio">
|
||||
<h3>Armon Dadgar (<a href="https://github.com/armon">@armon</a>)</h3>
|
||||
<p>
|
||||
Armon Dadgar is a creator of Vault. He created valuable sections
|
||||
of the core and helps maintain providers as well. Armon is also the
|
||||
creator of
|
||||
<a href="https://www.consul.io">Consul</a>,
|
||||
<a href="https://www.serfdom.io">Serf</a>,
|
||||
<a href="https://github.com/armon/statsite">Statsite</a>, and
|
||||
<a href="https://github.com/armon/bloomd">Bloomd</a>.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="person">
|
||||
<img class="pull-left" src="http://www.gravatar.com/avatar/2acc31dd6370a54b18f6755cd0710ce6.png?s=125">
|
||||
<div class="bio">
|
||||
<h3>Jack Pearkes (<a href="https://github.com/pearkes">@pearkes</a>)</h3>
|
||||
<p>
|
||||
Jack Pearkes is a creator of Vault. He created and maintains
|
||||
most of the providers and documentation.
|
||||
He is also a core committer to
|
||||
<a href="https://www.packer.io">Packer</a> and
|
||||
<a href="https://www.consul.io">Consul</a>
|
||||
while also being an employee of
|
||||
<a href="https://www.hashicorp.com">HashiCorp</a>.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
53
website/source/docs/commands/apply.html.markdown
Normal file
@@ -0,0 +1,53 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Command: apply"
|
||||
sidebar_current: "docs-commands-apply"
|
||||
description: |-
|
||||
The `vault apply` command is used to apply the changes required to reach the desired state of the configuration, or the pre-determined set of actions generated by a `vault plan` execution plan.
|
||||
---
|
||||
|
||||
# Command: apply
|
||||
|
||||
The `vault apply` command is used to apply the changes required
|
||||
to reach the desired state of the configuration, or the pre-determined
|
||||
set of actions generated by a `vault plan` execution plan.
|
||||
|
||||
## Usage
|
||||
|
||||
Usage: `vault apply [options] [dir]`
|
||||
|
||||
By default, `apply` scans the current directory for the configuration
|
||||
and applies the changes appropriately. However, a path to another configuration
|
||||
or an execution plan can be provided. Execution plans can be used to only
|
||||
execute a pre-determined set of actions.
|
||||
|
||||
The `dir` argument can also be a [module source](/docs/modules/index.html).
|
||||
In this case, `apply` behaves as though `init` were called with that
|
||||
argument followed by an `apply` in the current directory. This is meant
|
||||
as a shortcut for getting started.
|
||||
|
||||
The command-line flags are all optional. The list of available flags are:
|
||||
|
||||
* `-backup=path` - Path to the backup file. Defaults to `-state-out` with
|
||||
the ".backup" extension. Disabled by setting to "-".
|
||||
|
||||
* `-input=true` - Ask for input for variables if not directly set.
|
||||
|
||||
* `-no-color` - Disables output with coloring.
|
||||
|
||||
* `-refresh=true` - Update the state for each resource prior to planning
|
||||
and applying. This has no effect if a plan file is given directly to
|
||||
apply.
|
||||
|
||||
* `-state=path` - Path to the state file. Defaults to "vault.tfstate".
|
||||
|
||||
* `-state-out=path` - Path to write updated state file. By default, the
|
||||
`-state` path will be used.
|
||||
|
||||
* `-var 'foo=bar'` - Set a variable in the Vault configuration. This
|
||||
flag can be set multiple times.
|
||||
|
||||
* `-var-file=foo` - Set variables in the Vault configuration from
|
||||
a file. If "vault.tfvars" is present, it will be automatically
|
||||
loaded if this flag is not specified.
|
||||
|
||||
23
website/source/docs/commands/destroy.html.markdown
Normal file
@@ -0,0 +1,23 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Command: destroy"
|
||||
sidebar_current: "docs-commands-destroy"
|
||||
description: |-
|
||||
The `vault destroy` command is used to destroy the Vault-managed infrastructure.
|
||||
---
|
||||
|
||||
# Command: destroy
|
||||
|
||||
The `vault destroy` command is used to destroy the Vault-managed
|
||||
infrastructure.
|
||||
|
||||
## Usage
|
||||
|
||||
Usage: `vault destroy [options] [dir]`
|
||||
|
||||
Infrastructure managed by Vault will be destroyed. This will ask for
|
||||
confirmation before destroying.
|
||||
|
||||
This command accepts all the flags that the
|
||||
[apply command](/docs/commands/apply.html) accepts. If `-force` is
|
||||
set, then the destroy confirmation will not be shown.
|
||||
28
website/source/docs/commands/get.html.markdown
Normal file
@@ -0,0 +1,28 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Command: get"
|
||||
sidebar_current: "docs-commands-get"
|
||||
description: |-
|
||||
The `vault get` command is used to download and update modules.
|
||||
---
|
||||
|
||||
# Command: get
|
||||
|
||||
The `vault get` command is used to download and update
|
||||
[modules](/docs/modules/index.html).
|
||||
|
||||
## Usage
|
||||
|
||||
Usage: `vault get [options] [dir]`
|
||||
|
||||
The modules are downloaded into a local `.vault` folder. This
|
||||
folder should not be committed to version control.
|
||||
|
||||
If a module is already downloaded and the `-update` flag is _not_ set,
|
||||
Vault will do nothing. As a result, it is safe (and fast) to run this
|
||||
command multiple times.
|
||||
|
||||
The command-line flags are all optional. The list of available flags are:
|
||||
|
||||
* `-update` - If specified, modules that are already downloaded will be
|
||||
checked for updates and the updates will be downloaded if present.
|
||||
25
website/source/docs/configuration/index.html.md
Normal file
@@ -0,0 +1,25 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Configuration"
|
||||
sidebar_current: "docs-config"
|
||||
description: |-
|
||||
Vault uses text files to describe infrastructure and to set variables. These text files are called Vault _configurations_ and end in `.tf`. This section talks about the format of these files as well as how they're loaded.
|
||||
---
|
||||
|
||||
# Configuration
|
||||
|
||||
Vault uses text files to describe infrastructure and to set variables.
|
||||
These text files are called Vault _configurations_ and end in
|
||||
`.tf`. This section talks about the format of these files as well as
|
||||
how they're loaded.
|
||||
|
||||
The format of the configuration files are able to be in two formats:
|
||||
Vault format and JSON. The Vault format is more human-readable,
|
||||
supports comments, and is the generally recommended format for most
|
||||
Vault files. The JSON format is meant for machines to create,
|
||||
modify, and update, but can also be done by Vault operators if
|
||||
you prefer. Vault format ends in `.tf` and JSON format ends in
|
||||
`.tf.json`.
|
||||
|
||||
Click a sub-section in the navigation to the left to learn more about
|
||||
Vault configuration.
|
||||
108
website/source/docs/configuration/interpolation.html.md
Normal file
@@ -0,0 +1,108 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Interpolation Syntax"
|
||||
sidebar_current: "docs-config-interpolation"
|
||||
description: |-
|
||||
Embedded within strings in Vault, whether you're using the Vault syntax or JSON syntax, you can interpolate other values into strings. These interpolations are wrapped in `${}`, such as `${var.foo}`.
|
||||
---
|
||||
|
||||
# Interpolation Syntax
|
||||
|
||||
Embedded within strings in Vault, whether you're using the
|
||||
Vault syntax or JSON syntax, you can interpolate other values
|
||||
into strings. These interpolations are wrapped in `${}`, such as
|
||||
`${var.foo}`.
|
||||
|
||||
The interpolation syntax is powerful and allows you to reference
|
||||
variables, attributes of resources, call functions, etc.
|
||||
|
||||
## Available Variables
|
||||
|
||||
**To reference user variables**, use the `var.` prefix followed by the
|
||||
variable name. For example, `${var.foo}` will interpolate the
|
||||
`foo` variable value. If the variable is a mapping, then you
|
||||
can reference static keys in the map with the syntax
|
||||
`var.MAP.KEY`. For example, `${var.amis.us-east-1}` would
|
||||
get the value of the `us-east-1` key within the `amis` variable
|
||||
that is a mapping.
|
||||
|
||||
**To reference attributes of your own resource**, the syntax is
|
||||
`self.ATTRIBUTE`. For example `${self.private_ip_address}` will
|
||||
interpolate that resource's private IP address. Note that this is
|
||||
only allowed/valid within provisioners.
|
||||
|
||||
**To reference attributes of other resources**, the syntax is
|
||||
`TYPE.NAME.ATTRIBUTE`. For example, `${aws_instance.web.id}`
|
||||
will interpolate the ID attribute from the "aws\_instance"
|
||||
resource named "web". If the resource has a `count` attribute set,
|
||||
you can access individual attributes with a zero-based index, such
|
||||
as `${aws_instance.web.0.id}`. You can also use the splat syntax
|
||||
to get a list of all the attributes: `${aws_instance.web.*.id}`.
|
||||
This is documented in more detail in the
|
||||
[resource configuration page](/docs/configuration/resources.html).
|
||||
|
||||
**To reference outputs from a module**, the syntax is
|
||||
`MODULE.NAME.OUTPUT`. For example `${module.foo.bar}` will
|
||||
interpolate the "bar" output from the "foo"
|
||||
[module](/docs/modules/index.html).
|
||||
|
||||
**To reference count information**, the syntax is `count.FIELD`.
|
||||
For example, `${count.index}` will interpolate the current index
|
||||
in a multi-count resource. For more information on count, see the
|
||||
resource configuration page.
|
||||
|
||||
**To reference path information**, the syntax is `path.TYPE`.
|
||||
TYPE can be `cwd`, `module`, or `root`. `cwd` will interpolate the
|
||||
cwd. `module` will interpolate the path to the current module. `root`
|
||||
will interpolate the path of the root module. In general, you probably
|
||||
want the `path.module` variable.
|
||||
|
||||
## Built-in Functions
|
||||
|
||||
Vault ships with built-in functions. Functions are called with
|
||||
the syntax `name(arg, arg2, ...)`. For example,
|
||||
to read a file: `${file("path.txt")}`. The built-in functions
|
||||
are documented below.
|
||||
|
||||
The supported built-in functions are:
|
||||
|
||||
* `concat(args...)` - Concatenates the values of multiple arguments into
|
||||
a single string.
|
||||
|
||||
* `element(list, index)` - Returns a single element from a list
|
||||
at the given index. If the index is greater than the number of
|
||||
elements, this function will wrap using a standard mod algorithm.
|
||||
A list is only possible with splat variables from resources with
|
||||
a count greater than one.
|
||||
Example: `element(aws_subnet.foo.*.id, count.index)`
|
||||
|
||||
* `file(path)` - Reads the contents of a file into the string. Variables
|
||||
in this file are _not_ interpolated. The contents of the file are
|
||||
read as-is.
|
||||
|
||||
* `format(format, args...)` - Formats a string according to the given
|
||||
format. The syntax for the format is standard `sprintf` syntax.
|
||||
Good documentation for the syntax can be [found here](http://golang.org/pkg/fmt/).
|
||||
Example to zero-prefix a count, used commonly for naming servers:
|
||||
`format("web-%03d", count.index+1)`.
|
||||
|
||||
* `join(delim, list)` - Joins the list with the delimiter. A list is
|
||||
only possible with splat variables from resources with a count
|
||||
greater than one. Example: `join(",", aws_instance.foo.*.id)`
|
||||
|
||||
* `lookup(map, key)` - Performs a dynamic lookup into a mapping
|
||||
variable. The `map` parameter should be another variable, such
|
||||
as `var.amis`.
|
||||
|
||||
* `replace(string, search, replace)` - Does a search and replace on the
|
||||
given string. All instances of `search` are replaced with the value
|
||||
of `replace`. If `search` is wrapped in forward slashes, it is treated
|
||||
as a regular expression. If using a regular expression, `replace`
|
||||
can reference subcaptures in the regular expression by using `$n` where
|
||||
`n` is the index or name of the subcapture. If using a regular expression,
|
||||
the syntax conforms to the [re2 regular expression syntax](https://code.google.com/p/re2/wiki/Syntax).
|
||||
|
||||
* `split(delim, string)` - Splits the string previously created by `join`
|
||||
back into a list. This is useful for pushing lists through module
|
||||
outputs since they currently only support string values.
|
||||
Example: `split(",", module.amod.server_ids)`
|
||||
14
website/source/docs/index.html.markdown
Normal file
@@ -0,0 +1,14 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Documentation"
|
||||
sidebar_current: "docs-home"
|
||||
description: |-
|
||||
Welcome to the Vault documentation! This documentation is more of a reference guide for all available features and options of Vault. If you're just getting started with Vault, please start with the introduction and getting started guide instead.
|
||||
---
|
||||
|
||||
# Vault Documentation
|
||||
|
||||
Welcome to the Vault documentation! This documentation is more of a reference
|
||||
guide for all available features and options of Vault. If you're just getting
|
||||
started with Vault, please start with the
|
||||
[introduction and getting started guide](/intro/index.html) instead.
|
||||
98
website/source/docs/internals/graph.html.md
Normal file
@@ -0,0 +1,98 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Resource Graph"
|
||||
sidebar_current: "docs-internals-graph"
|
||||
description: |-
|
||||
Vault builds a dependency graph from the Vault configurations, and walks this graph to generate plans, refresh state, and more. This page documents the details of what are contained in this graph, what types of nodes there are, and how the edges of the graph are determined.
|
||||
---
|
||||
|
||||
# Resource Graph
|
||||
|
||||
Vault builds a
|
||||
[dependency graph](http://en.wikipedia.org/wiki/Dependency_graph)
|
||||
from the Vault configurations, and walks this graph to
|
||||
generate plans, refresh state, and more. This page documents
|
||||
the details of what are contained in this graph, what types
|
||||
of nodes there are, and how the edges of the graph are determined.
|
||||
|
||||
~> **Advanced Topic!** This page covers technical details
|
||||
of Vault. You don't need to understand these details to
|
||||
effectively use Vault. The details are documented here for
|
||||
those who wish to learn about them without having to go
|
||||
spelunking through the source code.
|
||||
|
||||
## Graph Nodes
|
||||
|
||||
There are only a handful of node types that can exist within the
|
||||
graph. We'll cover these first before explaining how they're
|
||||
determined and built:
|
||||
|
||||
* **Resource Node** - Represents a single resource. If you have
|
||||
the `count` metaparameter set, then there will be one resource
|
||||
node for each count. The configuration, diff, state, etc. of
|
||||
the resource under change is attached to this node.
|
||||
|
||||
* **Provider Configuration Node** - Represents the time to fully
|
||||
configure a provider. This is when the provider configuration
|
||||
block is given to a provider, such as AWS security credentials.
|
||||
|
||||
* **Resource Meta-Node** - Represents a group of resources, but
|
||||
does not represent any action on its own. This is done for
|
||||
convenience on dependencies and making a prettier graph. This
|
||||
node is only present for resources that have a `count`
|
||||
parameter greater than 1.
|
||||
|
||||
When visualizing a configuration with `vault graph`, you can
|
||||
see all of these nodes present.
|
||||
|
||||
## Building the Graph
|
||||
|
||||
Building the graph is done in a series of sequential steps:
|
||||
|
||||
1. Resources nodes are added based on the configuration. If a
|
||||
diff (plan) or state is present, that meta-data is attached
|
||||
to each resource node.
|
||||
|
||||
1. Resources are mapped to provisioners if they have any
|
||||
defined. This must be done after all resource nodes are
|
||||
created so resources with the same provisioner type can
|
||||
share the provisioner implementation.
|
||||
|
||||
1. Explicit dependencies from the `depends_on` meta-parameter
|
||||
are used to create edges between resources.
|
||||
|
||||
1. If a state is present, any "orphan" resources are added to
|
||||
the graph. Orphan resources are any resources that are no
|
||||
longer present in the configuration but are present in the
|
||||
state file. Orphans never have any configuration associated
|
||||
with them, since the state file does not store configuration.
|
||||
|
||||
1. Resources are mapped to providers. Provider configuration
|
||||
nodes are created for these providers, and edges are created
|
||||
such that the resources depend on their respective provider
|
||||
being configured.
|
||||
|
||||
1. Interpolations are parsed in resource and provider configurations
|
||||
to determine dependencies. References to resource attributes
|
||||
are turned into dependencies from the resource with the interpolation
|
||||
to the resource being referenced.
|
||||
|
||||
1. Create a root node. The root node points to all resources and
|
||||
is created so there is a single root to the dependency graph. When
|
||||
traversing the graph, the root node is ignored.
|
||||
|
||||
1. If a diff is present, traverse all resource nodes and find resources
|
||||
that are being destroyed. These resource nodes are split into two:
|
||||
one node that destroys the resource and another that creates
|
||||
the resource (if it is being recreated). The reason the nodes must
|
||||
be split is because the destroy order is often different from the
|
||||
create order, and so they can't be represented by a single graph
|
||||
node.
|
||||
|
||||
1. Validate the graph has no cycles and has a single root.
|
||||
|
||||
## Walking the Graph
|
||||
|
||||
To walk the graph, a standard depth-first traversal is done. Graph
|
||||
walking is done with as much parallelism as possible: a node is walked
|
||||
as soon as all of its dependencies are walked.
|
||||
19
website/source/docs/internals/index.html.md
Normal file
@@ -0,0 +1,19 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Internals"
|
||||
sidebar_current: "docs-internals"
|
||||
description: |-
|
||||
This section covers the internals of Vault and explains how plans are generated, the lifecycle of a provider, etc. The goal of this section is to remove any notion of "magic" from Vault. We want you to be able to trust and understand what Vault is doing to function.
|
||||
---
|
||||
|
||||
# Vault Internals
|
||||
|
||||
This section covers the internals of Vault and explains how
|
||||
plans are generated, the lifecycle of a provider, etc. The goal
|
||||
of this section is to remove any notion of "magic" from Vault.
|
||||
We want you to be able to trust and understand what Vault is
|
||||
doing to function.
|
||||
|
||||
-> **Note:** Knowledge of Vault internals is not
|
||||
required to use Vault. If you aren't interested in the internals
|
||||
of Vault, you may safely skip this section.
|
||||
58
website/source/docs/internals/lifecycle.html.md
Normal file
@@ -0,0 +1,58 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Resource Lifecycle"
|
||||
sidebar_current: "docs-internals-lifecycle"
|
||||
description: |-
|
||||
Resources have a strict lifecycle, and can be thought of as basic state machines. Understanding this lifecycle can help better understand how Vault generates an execution plan, how it safely executes that plan, and what the resource provider is doing throughout all of this.
|
||||
---
|
||||
|
||||
# Resource Lifecycle
|
||||
|
||||
Resources have a strict lifecycle, and can be thought of as basic
|
||||
state machines. Understanding this lifecycle can help better understand
|
||||
how Vault generates an execution plan, how it safely executes that
|
||||
plan, and what the resource provider is doing throughout all of this.
|
||||
|
||||
~> **Advanced Topic!** This page covers technical details
|
||||
of Vault. You don't need to understand these details to
|
||||
effectively use Vault. The details are documented here for
|
||||
those who wish to learn about them without having to go
|
||||
spelunking through the source code.
|
||||
|
||||
## Lifecycle
|
||||
|
||||
A resource roughly follows the steps below:
|
||||
|
||||
1. `ValidateResource` is called to do a high-level structural
|
||||
validation of a resource's configuration. The configuration
|
||||
at this point is raw and the interpolations have not been processed.
|
||||
The value of any key is not guaranteed and is just meant to be
|
||||
a quick structural check.
|
||||
|
||||
1. `Diff` is called with the current state and the configuration.
|
||||
The resource provider inspects this and returns a diff, outlining
|
||||
all the changes that need to occur to the resource. The diff includes
|
||||
details such as whether or not the resource is being destroyed, what
|
||||
attribute necessitates the destroy, old values and new values, whether
|
||||
a value is computed, etc. It is up to the resource provider to
|
||||
have this knowledge.
|
||||
|
||||
1. `Apply` is called with the current state and the diff. Apply does
|
||||
not have access to the configuration. This is a safety mechanism
|
||||
that limits the possibility that a provider changes a diff on the
|
||||
fly. `Apply` must apply a diff as prescribed and do nothing else
|
||||
to remain true to the Vault execution plan. Apply returns the
|
||||
new state of the resource (or nil if the resource was destroyed).
|
||||
|
||||
1. If a resource was just created and did not exist before, and the
|
||||
apply succeeded without error, then the provisioners are executed
|
||||
in sequence. If any provisioner errors, the resource is marked as
|
||||
_tainted_, so that it will be destroyed on the next apply.
|
||||
|
||||
## Partial State and Error Handling
|
||||
|
||||
If an error happens at any stage in the lifecycle of a resource,
|
||||
Vault stores a partial state of the resource. This behavior is
|
||||
critical for Vault to ensure that you don't end up with any
|
||||
_zombie_ resources: resources that were created by Vault but
|
||||
no longer managed by Vault due to a loss of state.
|
||||
127
website/source/docs/modules/create.html.markdown
Normal file
@@ -0,0 +1,127 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Creating Modules"
|
||||
sidebar_current: "docs-modules-create"
|
||||
description: |-
|
||||
Creating modules in Vault is easy. You may want to do this to better organize your code, to make a reusable component, or just to learn more about Vault. For any reason, if you already know the basics of Vault, creating a module is a piece of cake.
|
||||
---
|
||||
|
||||
# Creating Modules
|
||||
|
||||
Creating modules in Vault is easy. You may want to do this to better
|
||||
organize your code, to make a reusable component, or just to learn more about
|
||||
Vault. For any reason, if you already know the basics of Vault,
|
||||
creating a module is a piece of cake.
|
||||
|
||||
Modules in Vault are just folders with Vault files. In fact,
|
||||
when you run `vault apply`, the current working directory holding
|
||||
the Vault files you're applying comprise what is called the
|
||||
_root module_. It itself is a valid module.
|
||||
|
||||
Therefore, you can enter the source of any module, run `vault apply`,
|
||||
and expect it to work (assuming you satisfy the required variables, if any).
|
||||
|
||||
## An Example
|
||||
|
||||
Within a folder containing Vault configurations, create a subfolder
|
||||
"child". In this subfolder, make one empty "main.tf" file. Then, back in
|
||||
the root folder containing the "child" folder, add this to one of the
|
||||
Vault files:
|
||||
|
||||
```
|
||||
module "child" {
|
||||
source = "./child"
|
||||
}
|
||||
```
|
||||
|
||||
This will work. You've created your first module! You can add resources
|
||||
to the child module to see how that interaction works.
|
||||
|
||||
Note: Prior to running the above, you'll have to run
|
||||
[the get command](/docs/commands/get.html) for Vault to sync
|
||||
your modules. This should be instant since the module is just a local path.
|
||||
|
||||
## Inputs/Outputs
|
||||
|
||||
To make modules more useful than simple isolated containers of Vault
|
||||
configurations, modules can be configured and also have outputs that can be
|
||||
consumed by the configuration using the module.
|
||||
|
||||
Inputs of a module are [variables](/docs/configuration/variables.html)
|
||||
and outputs are [outputs](/docs/configuration/outputs.html). There is no
|
||||
special syntax to define these, they're defined just like any other
|
||||
variables or outputs.
|
||||
|
||||
In the "child" module we created above, add the following:
|
||||
|
||||
```
|
||||
variable "memory" {}
|
||||
|
||||
output "received" {
|
||||
value = "${var.memory}"
|
||||
}
|
||||
```
|
||||
|
||||
This will create a required variable "memory" and then an output "received"
|
||||
that will simply be the value of the memory variable.
|
||||
|
||||
You can then configure the module and use the output like so:
|
||||
|
||||
```
|
||||
module "child" {
|
||||
source = "./child"
|
||||
|
||||
memory = "1G"
|
||||
}
|
||||
|
||||
output "child_memory" {
|
||||
value = "${module.child.received}"
|
||||
}
|
||||
```
|
||||
|
||||
If you run `apply`, you'll again see that this works.
|
||||
|
||||
And that is all there is to it. Variables and outputs are used to configure
|
||||
modules and provide results. Resources within a module are isolated,
|
||||
and the whole thing is managed as a single unit.
|
||||
|
||||
## Paths and Embedded Files
|
||||
|
||||
It is sometimes useful to embed files within the module that aren't
|
||||
Vault configuration files, such as a script to provision a resource
|
||||
or a file to upload.
|
||||
|
||||
In these cases, you can't use a relative path, since paths in Vault
|
||||
are generally relative to the working directory that Vault was executed
|
||||
from. Instead, you want to use a module-relative path. To do this, use
|
||||
the [path interpolated variables](/docs/configuration/interpolation.html).
|
||||
|
||||
An example is shown below:
|
||||
|
||||
```
|
||||
resource "aws_instance" "server" {
|
||||
...
|
||||
|
||||
provisioner "remote-exec" {
|
||||
script = "${path.module}/script.sh"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
In the above, we use `${path.module}` to get a module-relative path. This
|
||||
is usually what you'll want in any case.
|
||||
|
||||
## Nested Modules
|
||||
|
||||
You can use a module within a module just like you would anywhere else.
|
||||
This module will be hidden from the root user, so you'll have re-expose any
|
||||
variables if you need to, as well as outputs.
|
||||
|
||||
The [get command](/docs/commands/get.html) will automatically get all
|
||||
nested modules as well.
|
||||
|
||||
You don't have to worry about conflicting versions of modules, since
|
||||
Vault builds isolated subtrees of all dependencies. For example,
|
||||
one module might use version 1.0 of module "foo" and another module
|
||||
might use version 2.0 of module "foo", and this would all work fine
|
||||
within Vault since the modules are created separately.
|
||||
17
website/source/docs/modules/index.html.markdown
Normal file
@@ -0,0 +1,17 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Modules"
|
||||
sidebar_current: "docs-modules"
|
||||
description: |-
|
||||
Modules in Vault are self-contained packages of Vault configurations that are managed as a group. Modules are used to create reusable components in Vault as well as for basic code organization.
|
||||
---
|
||||
|
||||
# Modules
|
||||
|
||||
Modules in Vault are self-contained packages of Vault configurations
|
||||
that are managed as a group. Modules are used to create reusable components
|
||||
in Vault as well as for basic code organization.
|
||||
|
||||
Modules are very easy to both use and create. Depending on what you're
|
||||
looking to do first, use the navigation on the left to dive into how
|
||||
modules work.
|
||||
205
website/source/docs/modules/sources.html.markdown
Normal file
@@ -0,0 +1,205 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Module Sources"
|
||||
sidebar_current: "docs-modules-sources"
|
||||
description: |-
|
||||
As documented in usage, the only required parameter when using a module is the `source` parameter which tells Vault where the module can be found and what constraints to put on the module if any (such as branches for Git, versions, etc.).
|
||||
---
|
||||
|
||||
# Module Sources
|
||||
|
||||
As documented in [usage](/docs/modules/usage.html), the only required
|
||||
parameter when using a module is the `source` parameter which tells Vault
|
||||
where the module can be found and what constraints to put on the module
|
||||
if any (such as branches for Git, versions, etc.).
|
||||
|
||||
Vault manages modules for you: it downloads them, organizes them
|
||||
on disk, checks for updates, etc. Vault uses this source parameter for
|
||||
the download/update of modules.
|
||||
|
||||
Vault supports the following sources:
|
||||
|
||||
* Local file paths
|
||||
|
||||
* GitHub
|
||||
|
||||
* BitBucket
|
||||
|
||||
* Generic Git, Mercurial repositories
|
||||
|
||||
* HTTP URLs
|
||||
|
||||
Each is documented further below.
|
||||
|
||||
## Local File Paths
|
||||
|
||||
The easiest source is the local file path. For maximum portability, this
|
||||
should be a relative file path into a subdirectory. This allows you to
|
||||
organize your Vault configuration into modules within one repository,
|
||||
for example.
|
||||
|
||||
An example is shown below:
|
||||
|
||||
```
|
||||
module "consul" {
|
||||
source = "./consul"
|
||||
}
|
||||
```
|
||||
|
||||
Updates for file paths are automatic: when "downloading" the module
|
||||
using the [get command](/docs/commands/get.html), Vault will create
|
||||
a symbolic link to the original directory. Therefore, any changes are
|
||||
automatically instantly available.
|
||||
|
||||
## GitHub
|
||||
|
||||
Vault will automatically recognize GitHub URLs and turn them into
|
||||
the proper Git repository. The syntax is simple:
|
||||
|
||||
```
|
||||
module "consul" {
|
||||
source = "github.com/hashicorp/example"
|
||||
}
|
||||
```
|
||||
|
||||
Subdirectories within the repository can also be referenced:
|
||||
|
||||
```
|
||||
module "consul" {
|
||||
source = "github.com/hashicorp/example//subdir"
|
||||
}
|
||||
```
|
||||
|
||||
**Note:** The double-slash is important. It is what tells Vault that
|
||||
that is the separator for a subdirectory, and not part of the repository
|
||||
itself.
|
||||
|
||||
GitHub source URLs will require that Git is installed on your system
|
||||
and that you have the proper access to the repository.
|
||||
|
||||
You can use the same parameters to GitHub repositories as you can generic
|
||||
Git repositories (such as tags or branches). See the documentation for generic
|
||||
Git repositories for more information.
|
||||
|
||||
## BitBucket
|
||||
|
||||
Vault will automatically recognize BitBucket URLs and turn them into
|
||||
the proper Git or Mercurial repository. An example:
|
||||
|
||||
```
|
||||
module "consul" {
|
||||
source = "bitbucket.org/hashicorp/example"
|
||||
}
|
||||
```
|
||||
|
||||
Subdirectories within the repository can also be referenced:
|
||||
|
||||
```
|
||||
module "consul" {
|
||||
source = "bitbucket.org/hashicorp/example//subdir"
|
||||
}
|
||||
```
|
||||
|
||||
**Note:** The double-slash is important. It is what tells Vault that
|
||||
that is the separator for a subdirectory, and not part of the repository
|
||||
itself.
|
||||
|
||||
BitBucket URLs will require that Git or Mercurial is installed on your
|
||||
system, depending on the source URL.
|
||||
|
||||
## Generic Git Repository
|
||||
|
||||
Generic Git repositories are also supported. The value of `source` in this
|
||||
case should be a complete Git-compatible URL. Using Git requires that
|
||||
Git is installed on your system. Example:
|
||||
|
||||
```
|
||||
module "consul" {
|
||||
source = "git://hashicorp.com/module.git"
|
||||
}
|
||||
```
|
||||
|
||||
You can also use protocols such as HTTP or SSH, but you'll have to hint
|
||||
to Vault (using the forced source type syntax documented below) to use
|
||||
Git:
|
||||
|
||||
```
|
||||
module "consul" {
|
||||
source = "git::https://hashicorp.com/module.git"
|
||||
}
|
||||
```
|
||||
|
||||
URLs for Git repositories (of any protocol) support the following query
|
||||
parameters:
|
||||
|
||||
* `ref` - The ref to checkout. This can be a branch, tag, commit, etc.
|
||||
|
||||
An example of using these parameters is shown below:
|
||||
|
||||
```
|
||||
module "consul" {
|
||||
source = "git::https://hashicorp.com/module.git?ref=master"
|
||||
}
|
||||
```
|
||||
|
||||
## Generic Mercurial Repository
|
||||
|
||||
Generic Mercurial repositories are supported. The value of `source` in this
|
||||
case should be a complete Mercurial-compatible URL. Using Mercurial requires that
|
||||
Mercurial is installed on your system. Example:
|
||||
|
||||
```
|
||||
module "consul" {
|
||||
source = "hg::http://hashicorp.com/module.hg"
|
||||
}
|
||||
```
|
||||
|
||||
In the case of above, we used the forced source type syntax documented below.
|
||||
Mercurial repositories require this.
|
||||
|
||||
URLs for Mercurial repositories (of any protocol) support the following query
|
||||
parameters:
|
||||
|
||||
* `rev` - The rev to checkout. This can be a branch, tag, commit, etc.
|
||||
|
||||
## HTTP URLs
|
||||
|
||||
Any HTTP endpoint can serve up Vault modules. For HTTP URLs (SSL is
|
||||
supported, as well), Vault will make a GET request to the given URL.
|
||||
An additional GET parameter `vault-get=1` will be appended, allowing
|
||||
you to optionally render the page differently when Vault is requesting it.
|
||||
|
||||
Vault then looks for the resulting module URL in the following order.
|
||||
|
||||
First, if a header `X-Vault-Get` is present, then it should contain
|
||||
the source URL of the actual module. This will be used.
|
||||
|
||||
If the header isn't present, Vault will look for a `<meta>` tag
|
||||
with the name of "vault-get". The value will be used as the source
|
||||
URL.
|
||||
|
||||
## Forced Source Type
|
||||
|
||||
In a couple places above, we've referenced "forced source type." Forced
|
||||
source type is a syntax added to URLs that allow you to force a specific
|
||||
method for download/updating the module. It is used to disambiguate URLs.
|
||||
|
||||
For example, the source "http://hashicorp.com/foo.git" could just as
|
||||
easily be a plain HTTP URL as it might be a Git repository speaking the
|
||||
HTTP protocol. The forced source type syntax is used to force Vault
|
||||
one way or the other.
|
||||
|
||||
Example:
|
||||
|
||||
```
|
||||
module "consul" {
|
||||
source = "git::http://hashicorp.com/foo.git"
|
||||
}
|
||||
```
|
||||
|
||||
The above will force Vault to get the module using Git, despite it
|
||||
being an HTTP URL.
|
||||
|
||||
If a forced source type isn't specified, Vault will match the exact
|
||||
protocol if it supports it. It will not try multiple methods. In the case
|
||||
above, it would've used the HTTP method.
|
||||
106
website/source/docs/modules/usage.html.markdown
Normal file
@@ -0,0 +1,106 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Using Modules"
|
||||
sidebar_current: "docs-modules-usage"
|
||||
description: Using modules in Vault is very similar to defining resources.
|
||||
---
|
||||
|
||||
# Module Usage
|
||||
|
||||
Using modules in Vault is very similar to defining resources:
|
||||
|
||||
```
|
||||
module "consul" {
|
||||
source = "github.com/hashicorp/consul/vault/aws"
|
||||
servers = 3
|
||||
}
|
||||
```
|
||||
|
||||
You can view the full documentation for the syntax of configuring
|
||||
modules [here](/docs/configuration/modules.html).
|
||||
|
||||
As you can see, it is very similar to defining resources, with the exception
|
||||
that we don't specify a type, and just a name. This name can be used elsewhere
|
||||
in the configuration to reference the module and its variables.
|
||||
|
||||
The existence of the above configuration will tell Vault to create
|
||||
the resources in the "consul" module which can be found on GitHub with the
|
||||
given URL. Just like a resource, the module configuration can be deleted
|
||||
to remove the module.
|
||||
|
||||
## Source
|
||||
|
||||
The only required configuration key is the `source` parameter. The value of
|
||||
this tells Vault where the module can be downloaded, updated, etc.
|
||||
Vault comes with support for a variety of module sources. These
|
||||
are documented on a [separate page](/docs/modules/sources.html).
|
||||
|
||||
Prior to running any command such as `plan` with a configuration that
|
||||
uses modules, you'll have to [get](/docs/commands/get.html) the modules.
|
||||
This is done using the [get command](/docs/commands/get.html).
|
||||
|
||||
```
|
||||
$ vault get
|
||||
...
|
||||
```
|
||||
|
||||
This command will download the modules if they haven't been already.
|
||||
By default, the command will not check for updates, so it is safe (and fast)
|
||||
to run multiple times. You can use the `-u` flag to check and download
|
||||
updates.
|
||||
|
||||
## Configuration
|
||||
|
||||
The parameters used to configure modules, such as the `servers` parameter
|
||||
above, map directly to [variables](/docs/configuration/variables.html) within
|
||||
the module itself. Therefore, you can quickly discover all the configuration
|
||||
for a module by inspecting the source of it very easily.
|
||||
|
||||
Additionally, because these map directly to variables, they're always simple
|
||||
key/value pairs. Modules can't have complex variable inputs.
|
||||
|
||||
## Outputs
|
||||
|
||||
Modules can also specify their own [outputs](/docs/configuration/outputs.html).
|
||||
These outputs can be referenced in other places in your configuration.
|
||||
For example:
|
||||
|
||||
```
|
||||
resource "aws_instance" "client" {
|
||||
ami = "ami-123456"
|
||||
instance_type = "m1.small"
|
||||
availability_zone = "${module.consul.server_availability_zone}"
|
||||
}
|
||||
```
|
||||
|
||||
This purposely is very similar to accessing resource attributes. But instead
|
||||
of mapping to a resource, the variable in this case maps to an output of
|
||||
a module.
|
||||
|
||||
Just like resources, this will create a dependency from the `aws_instance.client`
|
||||
resource to the module, so the module will be built first.
|
||||
|
||||
## Plans and Graphs
|
||||
|
||||
With modules, commands such as the [plan command](/docs/commands/plan.html)
|
||||
and
|
||||
[graph command](/docs/commands/graph.html) will show the module as a single
|
||||
unit by default. You can use the `-module-depth` parameter to expand this
|
||||
graph further.
|
||||
|
||||
For example, with a configuration similar to what we've built above, here
|
||||
is what the graph output looks like by default:
|
||||
|
||||
<div class="center">
|
||||

|
||||
</div>
|
||||
|
||||
But if we set `-module-depth=-1`, the graph will look like this:
|
||||
|
||||
<div class="center">
|
||||

|
||||
</div>
|
||||
|
||||
Other commands work similarly with modules. Note that the `-module-depth`
|
||||
flag is purely a formatting flag; it doesn't affect what modules are created
|
||||
or not.
|
||||
107
website/source/docs/plugins/basics.html.md
Normal file
@@ -0,0 +1,107 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Plugin Basics"
|
||||
sidebar_current: "docs-plugins-basics"
|
||||
description: |-
|
||||
This page documents the basics of how the plugin system in Vault works, and how to setup a basic development environment for plugin development if you're writing a Vault plugin.
|
||||
---
|
||||
|
||||
# Plugin Basics
|
||||
|
||||
This page documents the basics of how the plugin system in Vault
|
||||
works, and how to setup a basic development environment for plugin development
|
||||
if you're writing a Vault plugin.
|
||||
|
||||
~> **Advanced topic!** Plugin development is a highly advanced
|
||||
topic in Vault, and is not required knowledge for day-to-day usage.
|
||||
If you don't plan on writing any plugins, we recommend not reading
|
||||
this section of the documentation.
|
||||
|
||||
## How it Works
|
||||
|
||||
The plugin system for Vault is based on multi-process RPC. Every
|
||||
provider, provisioner, etc. in Vault is actually a separate compiled
|
||||
binary. You can see this when you download Vault: the Vault package
|
||||
contains multiple binaries.
|
||||
|
||||
Vault executes these binaries in a certain way and uses Unix domain
|
||||
sockets or network sockets to perform RPC with the plugins.
|
||||
|
||||
If you try to execute a plugin directly, an error will be shown:
|
||||
|
||||
```
|
||||
$ vault-provider-aws
|
||||
This binary is a Vault plugin. These are not meant to be
|
||||
executed directly. Please execute `vault`, which will load
|
||||
any plugins automatically.
|
||||
```
|
||||
|
||||
The code within the binaries must adhere to certain interfaces.
|
||||
The network communication and RPC is handled automatically by higher-level
|
||||
Vault libraries. The exact interface to implement is documented
|
||||
in its respective documentation section.
|
||||
|
||||
## Installing a Plugin
|
||||
|
||||
To install a plugin, put the binary somewhere on your filesystem, then
|
||||
configure Vault to be able to find it. The configuration where plugins
|
||||
are defined is `~/.vaultrc` for Unix-like systems and
|
||||
`%APPDATA%/vault.rc` for Windows.
|
||||
|
||||
An example that configures a new provider is shown below:
|
||||
|
||||
```
|
||||
providers {
|
||||
privatecloud = "/path/to/privatecloud"
|
||||
}
|
||||
```
|
||||
|
||||
The key `privatecloud` is the _prefix_ of the resources for that provider.
|
||||
For example, if there is `privatecloud_instance` resource, then the above
|
||||
configuration would work. The value is the name of the executable. This
|
||||
can be a full path. If it isn't a full path, the executable will be looked
|
||||
up on the `PATH`.
|
||||
|
||||
## Developing a Plugin
|
||||
|
||||
Developing a plugin is simple. The only knowledge necessary to write
|
||||
a plugin is basic command-line skills and basic knowledge of the
|
||||
[Go programming language](http://golang.org).
|
||||
|
||||
-> **Note:** A common pitfall is not properly setting up a
|
||||
<code>$GOPATH</code>. This can lead to strange errors. You can read more about
|
||||
this [here](https://golang.org/doc/code.html) to familiarize
|
||||
yourself.
|
||||
|
||||
Create a new Go project somewhere in your `$GOPATH`. If you're a
|
||||
GitHub user, we recommend creating the project in the directory
|
||||
`$GOPATH/src/github.com/USERNAME/vault-NAME`, where `USERNAME`
|
||||
is your GitHub username and `NAME` is the name of the plugin you're
|
||||
developing. This structure is what Go expects and simplifies things down
|
||||
the road.
|
||||
|
||||
With the directory made, create a `main.go` file. This project will
|
||||
be a binary so the package is "main":
|
||||
|
||||
```
|
||||
package main
|
||||
|
||||
import (
|
||||
"github.com/hashicorp/vault/plugin"
|
||||
)
|
||||
|
||||
func main() {
|
||||
plugin.Serve(new(MyPlugin))
|
||||
}
|
||||
```
|
||||
|
||||
And that's basically it! You'll have to change the argument given to
|
||||
`plugin.Serve` to be your actual plugin, but that is the only change
|
||||
you'll have to make. The argument should be a structure implementing
|
||||
one of the plugin interfaces (depending on what sort of plugin
|
||||
you're creating).
|
||||
|
||||
Vault plugins must follow a very specific naming convention of
|
||||
`vault-TYPE-NAME`. For example, `vault-provider-aws`, which
|
||||
tells Vault that the plugin is a provider that can be referenced
|
||||
as "aws".
|
||||
24
website/source/docs/plugins/index.html.md
Normal file
@@ -0,0 +1,24 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Plugins"
|
||||
sidebar_current: "docs-plugins"
|
||||
description: |-
|
||||
Vault is built on a plugin-based architecture. All providers and provisioners that are used in Vault configurations are plugins, even the core types such as AWS and Heroku. Users of Vault are able to write new plugins in order to support new functionality in Vault.
|
||||
---
|
||||
|
||||
# Plugins
|
||||
|
||||
Vault is built on a plugin-based architecture. All providers and
|
||||
provisioners that are used in Vault configurations are plugins, even
|
||||
the core types such as AWS and Heroku. Users of Vault are able to
|
||||
write new plugins in order to support new functionality in Vault.
|
||||
|
||||
This section of the documentation gives a high-level overview of how
|
||||
to write plugins for Vault. It does not hold your hand through the
|
||||
process, however, and expects a relatively high level of understanding
|
||||
of Go, provider semantics, Unix, etc.
|
||||
|
||||
~> **Advanced topic!** Plugin development is a highly advanced
|
||||
topic in Vault, and is not required knowledge for day-to-day usage.
|
||||
If you don't plan on writing any plugins, we recommend not reading
|
||||
this section of the documentation.
|
||||
248
website/source/docs/plugins/provider.html.md
Normal file
@@ -0,0 +1,248 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Provider Plugins"
|
||||
sidebar_current: "docs-plugins-provider"
|
||||
description: |-
|
||||
A provider in Vault is responsible for the lifecycle of a resource: create, read, update, delete. An example of a provider is AWS, which can manage resources of type `aws_instance`, `aws_eip`, `aws_elb`, etc.
|
||||
---
|
||||
|
||||
# Provider Plugins
|
||||
|
||||
A provider in Vault is responsible for the lifecycle of a resource:
|
||||
create, read, update, delete. An example of a provider is AWS, which
|
||||
can manage resources of type `aws_instance`, `aws_eip`, `aws_elb`, etc.
|
||||
|
||||
The primary reasons to care about provider plugins are:
|
||||
|
||||
* You want to add a new resource type to an existing provider.
|
||||
|
||||
* You want to write a completely new provider for managing resource
|
||||
types in a system not yet supported.
|
||||
|
||||
* You want to write a completely new provider for custom, internal
|
||||
systems such as a private inventory management system.
|
||||
|
||||
~> **Advanced topic!** Plugin development is a highly advanced
|
||||
topic in Vault, and is not required knowledge for day-to-day usage.
|
||||
If you don't plan on writing any plugins, we recommend not reading
|
||||
this section of the documentation.
|
||||
|
||||
If you're interested in provider development, then read on. The remainder
|
||||
of this page will assume you're familiar with
|
||||
[plugin basics](/docs/plugins/basics.html) and that you already have
|
||||
a basic development environment setup.
|
||||
|
||||
## Low-Level Interface
|
||||
|
||||
The interface you must implement for providers is
|
||||
[ResourceProvider](https://github.com/hashicorp/vault/blob/master/vault/resource_provider.go).
|
||||
|
||||
This interface is extremely low level, however, and we don't recommend
|
||||
you implement it directly. Implementing the interface directly is error
|
||||
prone, complicated, and difficult.
|
||||
|
||||
Instead, we've developed some higher level libraries to help you out
|
||||
with developing providers. These are the same libraries we use in our
|
||||
own core providers.
|
||||
|
||||
## helper/schema
|
||||
|
||||
The `helper/schema` library is a framework we've built to make creating
|
||||
providers extremely easy. This is the same library we use to build most
|
||||
of the core providers.
|
||||
|
||||
To give you an idea of how productive you can become with this framework:
|
||||
we implemented the Google Cloud provider in about 6 hours of coding work.
|
||||
This isn't a simple provider, and we did have knowledge of
|
||||
the framework beforehand, but it goes to show how expressive the framework
|
||||
can be.
|
||||
|
||||
The GoDoc for `helper/schema` can be
|
||||
[found here](http://godoc.org/github.com/hashicorp/vault/helper/schema).
|
||||
This is API-level documentation but will be extremely important
|
||||
for you going forward.
|
||||
|
||||
## Provider
|
||||
|
||||
The first thing to do in your plugin is to create the
|
||||
[schema.Provider](http://godoc.org/github.com/hashicorp/vault/helper/schema#Provider) structure.
|
||||
This structure implements the `ResourceProvider` interface. We
|
||||
recommend creating this structure in a function to make testing easier
|
||||
later. Example:
|
||||
|
||||
```
|
||||
func Provider() *schema.Provider {
|
||||
return &schema.Provider{
|
||||
...
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Within the `schema.Provider`, you should initialize all the fields. They
|
||||
are documented within the godoc, but a brief overview is here as well:
|
||||
|
||||
* `Schema` - This is the configuration schema for the provider itself.
|
||||
You should define any API keys, etc. here. Schemas are covered below.
|
||||
|
||||
* `ResourcesMap` - The map of resources that this provider supports.
|
||||
All keys are resource names and the values are the
|
||||
[schema.Resource](http://godoc.org/github.com/hashicorp/vault/helper/schema#Resource) structures implementing this resource.
|
||||
|
||||
* `ConfigureFunc` - This function callback is used to configure the
|
||||
provider. This function should do things such as initialize any API
|
||||
clients, validate API keys, etc. The `interface{}` return value of
|
||||
this function is the `meta` parameter that will be passed into all
|
||||
resource [CRUD](http://en.wikipedia.org/wiki/Create,_read,_update_and_delete)
|
||||
functions. In general, the returned value is a configuration structure
|
||||
or a client.
|
||||
|
||||
As part of the unit tests, you should call `InternalValidate`. This is used
|
||||
to verify the structure of the provider and all of the resources, and reports
|
||||
an error if it is invalid. An example test is shown below:
|
||||
|
||||
```
|
||||
func TestProvider(t *testing.T) {
|
||||
if err := Provider().InternalValidate(); err != nil {
|
||||
t.Fatalf("err: %s", err)
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Having this unit test will catch a lot of beginner mistakes as you build
|
||||
your provider.
|
||||
|
||||
## Resources
|
||||
|
||||
Next, you'll want to create the resources that the provider can manage.
|
||||
These resources are put into the `ResourcesMap` field of the provider
|
||||
structure. Again, we recommend creating functions to instantiate these.
|
||||
An example is shown below.
|
||||
|
||||
```
|
||||
func resourceComputeAddress() *schema.Resource {
|
||||
return &schema.Resource {
|
||||
...
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Resources are described using the
|
||||
[schema.Resource](http://godoc.org/github.com/hashicorp/vault/helper/schema#Resource)
|
||||
structure. This structure has the following fields:
|
||||
|
||||
* `Schema` - The configuration schema for this resource. Schemas are
|
||||
covered in more detail below.
|
||||
|
||||
* `Create`, `Read`, `Update`, and `Delete` - These are the callback
|
||||
functions that implement CRUD operations for the resource. The only
|
||||
optional field is `Update`. If your resource doesn't support update, then
|
||||
you may keep that field nil.
|
||||
|
||||
The CRUD operations in more detail, along with their contracts:
|
||||
|
||||
* `Create` - This is called to create a new instance of the resource.
|
||||
Vault guarantees that an existing ID is not set on the resource
|
||||
data. That is, you're working with a new resource.
|
||||
|
||||
* `Read` - This is called to resync the local state with the remote state.
|
||||
Vault guarantees that an existing ID will be set. This ID should be
|
||||
used to look up the resource. Any remote data should be updated into
|
||||
the local data. **No changes to the remote resource are to be made.**
|
||||
|
||||
* `Update` - This is called to update properties of an existing resource.
|
||||
Vault guarantees that an existing ID will be set. Additionally,
|
||||
the only changed attributes are guaranteed to be those that support
|
||||
update, as specified by the schema. Be careful to read about partial
|
||||
states below.
|
||||
|
||||
* `Delete` - This is called to delete the resource. Vault guarantees
|
||||
an existing ID will be set.
|
||||
|
||||
* `Exists` - This is called to verify a resource still exists. It is
|
||||
called prior to `Read`, and lowers the burden of `Read` to be able
|
||||
to assume the resource exists.
|
||||
|
||||
## Schemas
|
||||
|
||||
Both providers and resources require a schema to be specified. The schema
|
||||
is used to define the structure of the configuration, the types, etc. It is
|
||||
very important to get correct.
|
||||
|
||||
In both provider and resource, the schema is a `map[string]*schema.Schema`.
|
||||
The key of this map is the configuration key, and the value is a schema for
|
||||
the value of that key.
|
||||
|
||||
Schemas are incredibly powerful, so this documentation page won't attempt
|
||||
to cover the full power of them. Instead, the API docs should be referenced
|
||||
which cover all available settings.
|
||||
|
||||
We recommend viewing schemas of existing or similar providers to learn
|
||||
best practices. A good starting place is the
|
||||
[core Vault providers](https://github.com/hashicorp/vault/tree/master/builtin/providers).
|
||||
|
||||
## Resource Data
|
||||
|
||||
The parameter to provider configuration as well as all the CRUD operations
|
||||
on a resource is a
|
||||
[schema.ResourceData](http://godoc.org/github.com/hashicorp/vault/helper/schema#ResourceData).
|
||||
This structure is used to query configurations as well as to set information
|
||||
about the resource such as its ID, connection information, and computed
|
||||
attributes.
|
||||
|
||||
The API documentation covers ResourceData well, as well as the core providers
|
||||
in Vault.
|
||||
|
||||
**Partial state** deserves a special mention. Occasionally in Vault, create or
|
||||
update operations are not atomic; they can fail halfway through. As an example,
|
||||
when creating an AWS security group, creating the group may succeed,
|
||||
but creating all the initial rules may fail. In this case, it is incredibly
|
||||
important that Vault record the correct _partial state_ so that a
|
||||
subsequent `vault apply` fixes this resource.
|
||||
|
||||
Most of the time, partial state is not required. When it is, it must be
|
||||
specifically enabled. An example is shown below:
|
||||
|
||||
<pre class="prettyprint">
|
||||
func resourceUpdate(d *schema.ResourceData, meta interface{}) error {
|
||||
// Enable partial state mode
|
||||
d.Partial(true)
|
||||
|
||||
if d.HasChange("tags") {
|
||||
// If an error occurs, return with an error,
|
||||
// we didn't finish updating
|
||||
if err := updateTags(d, meta); err != nil {
|
||||
return err
|
||||
}
|
||||
|
||||
d.SetPartial("tags")
|
||||
}
|
||||
|
||||
if d.HasChange("name") {
|
||||
if err := updateName(d, meta); err != nil {
|
||||
return err
|
||||
}
|
||||
|
||||
d.SetPartial("name")
|
||||
}
|
||||
|
||||
// We succeeded, disable partial mode
|
||||
d.Partial(false)
|
||||
|
||||
return nil
|
||||
}
|
||||
</pre>
|
||||
|
||||
In the example above, it is possible that setting the `tags` succeeds,
|
||||
but setting the `name` fails. In this scenario, we want to make sure
|
||||
that only the state of the `tags` is updated. To do this the
|
||||
`Partial` and `SetPartial` functions are used.
|
||||
|
||||
`Partial` toggles partial-state mode. When disabled, all changes are merged
|
||||
into the state upon result of the operation. When enabled, only changes
|
||||
enabled with `SetPartial` are merged in.
|
||||
|
||||
`SetPartial` tells Vault what state changes to adopt upon completion
|
||||
of an operation. You should call `SetPartial` with every key that is safe
|
||||
to merge into the state. The parameter to `SetPartial` is a prefix, so
|
||||
if you have a nested structure and want to accept the whole thing,
|
||||
you can just specify the prefix.
|
||||
36
website/source/docs/providers/github/index.html.markdown
Normal file
@@ -0,0 +1,36 @@
|
||||
---
|
||||
layout: "mailgun"
|
||||
page_title: "Provider: Mailgun"
|
||||
sidebar_current: "docs-mailgun-index"
|
||||
description: |-
|
||||
The Mailgun provider is used to interact with the resources supported by Mailgun. The provider needs to be configured with the proper credentials before it can be used.
|
||||
---
|
||||
|
||||
# Provider
|
||||
|
||||
The Mailgun provider is used to interact with the
|
||||
resources supported by Mailgun. The provider needs to be configured
|
||||
with the proper credentials before it can be used.
|
||||
|
||||
Use the navigation to the left to read about the available resources.
|
||||
|
||||
## Example Usage
|
||||
|
||||
```
|
||||
# Configure the Mailgun provider
|
||||
provider "mailgun" {
|
||||
api_key = "${var.mailgun_api_key}"
|
||||
}
|
||||
|
||||
# Create a new domain
|
||||
resource "mailgun_domain" "default" {
|
||||
...
|
||||
}
|
||||
```
|
||||
|
||||
## Argument Reference
|
||||
|
||||
The following arguments are supported:
|
||||
|
||||
* `api_key` - (Required) Mailgun API key
|
||||
|
||||
20
website/source/docs/providers/index.html.markdown
Normal file
@@ -0,0 +1,20 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Providers"
|
||||
sidebar_current: "docs-providers"
|
||||
description: |-
|
||||
Vault is used to create, manage, and manipulate infrastructure resources. Examples of resources include physical machines, VMs, network switches, containers, etc. Almost any infrastructure noun can be represented as a resource in Vault.
|
||||
---
|
||||
|
||||
# Providers
|
||||
|
||||
Vault is used to create, manage, and manipulate infrastructure resources.
|
||||
Examples of resources include physical machines, VMs, network switches, containers,
|
||||
etc. Almost any infrastructure noun can be represented as a resource in Vault.
|
||||
|
||||
Vault is agnostic to the underlying platforms by supporting providers. A provider
|
||||
is responsible for understanding API interactions and exposing resources. Providers
|
||||
generally are an IaaS (e.g. AWS, DigitalOcean, GCE), PaaS (e.g. Heroku, CloudFoundry),
|
||||
or SaaS services (e.g. Atlas, DNSimple, CloudFlare).
|
||||
|
||||
Use the navigation to the left to read about the available providers.
|
||||
55
website/source/docs/provisioners/connection.html.markdown
Normal file
@@ -0,0 +1,55 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Provisioner Connections"
|
||||
sidebar_current: "docs-provisioners-connection"
|
||||
description: |-
|
||||
Many provisioners require access to the remote resource. For example, a provisioner may need to use ssh to connect to the resource.
|
||||
---
|
||||
|
||||
# Provisioner Connections
|
||||
|
||||
Many provisioners require access to the remote resource. For example,
|
||||
a provisioner may need to use ssh to connect to the resource.
|
||||
|
||||
Vault uses a number of defaults when connecting to a resource, but these
|
||||
can be overridden using `connection` block in either a `resource` or `provisioner`.
|
||||
Any `connection` information provided in a `resource` will apply to all the
|
||||
provisioners, but it can be scoped to a single provisioner as well. One use case
|
||||
is to have an initial provisioner connect as root to setup user accounts, and have
|
||||
subsequent provisioners connect as a user with more limited permissions.
|
||||
|
||||
## Example usage
|
||||
|
||||
```
|
||||
# Copies the file as the root user using a password
|
||||
provisioner "file" {
|
||||
source = "conf/myapp.conf"
|
||||
destination = "/etc/myapp.conf"
|
||||
connection {
|
||||
user = "root"
|
||||
password = "${var.root_password}"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## Argument Reference
|
||||
|
||||
The following arguments are supported:
|
||||
|
||||
* `type` - The connection type that should be used. This defaults to "ssh". The type
|
||||
of connection supported depends on the provisioner.
|
||||
|
||||
* `user` - The user that we should use for the connection. This defaults to "root".
|
||||
|
||||
* `password` - The password we should use for the connection.
|
||||
|
||||
* `key_file` - The SSH key to use for the connection. This takes preference over the
|
||||
password if provided.
|
||||
|
||||
* `host` - The address of the resource to connect to. This is provided by the provider.
|
||||
|
||||
* `port` - The port to connect to. This defaults to 22.
|
||||
|
||||
* `timeout` - The timeout to wait for the connection to become available. This defaults
|
||||
to 5 minutes. Should be provided as a string like "30s" or "5m".
|
||||
|
||||
66
website/source/docs/provisioners/file.html.markdown
Normal file
@@ -0,0 +1,66 @@
|
||||
---
|
||||
layout: "docs"
|
||||
page_title: "Provisioner: file"
|
||||
sidebar_current: "docs-provisioners-file"
|
||||
description: |-
|
||||
The `file` provisioner is used to copy files or directories from the machine executing Vault to the newly created resource. The `file` provisioner only supports `ssh` type connections.
|
||||
---
|
||||
|
||||
# File Provisioner
|
||||
|
||||
The `file` provisioner is used to copy files or directories from the machine
|
||||
executing Vault to the newly created resource. The `file` provisioner only
|
||||
supports `ssh` type [connections](/docs/provisioners/connection.html).
|
||||
|
||||
## Example usage
|
||||
|
||||
```
|
||||
resource "aws_instance" "web" {
|
||||
...
|
||||
|
||||
# Copies the myapp.conf file to /etc/myapp.conf
|
||||
provisioner "file" {
|
||||
source = "conf/myapp.conf"
|
||||
destination = "/etc/myapp.conf"
|
||||
}
|
||||
|
||||
# Copies the configs.d folder to /etc/configs.d
|
||||
provisioner "file" {
|
||||
source = "conf/configs.d"
|
||||
destination = "/etc"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## Argument Reference
|
||||
|
||||
The following arguments are supported:
|
||||
|
||||
* `source` - (Required) This is the source file or folder. It can be specified as relative
|
||||
to the current working directory or as an absolute path.
|
||||
|
||||
* `destination` - (Required) This is the destination path. It must be specified as an
|
||||
absolute path.
|
||||
|
||||
## Directory Uploads
|
||||
|
||||
The file provisioner is also able to upload a complete directory to the remote machine.
|
||||
When uploading a directory, there are a few important things you should know.
|
||||
|
||||
First, the destination directory must already exist. If you need to create it,
|
||||
use a remote-exec provisioner just prior to the file provisioner in order to create the directory.
|
||||
|
||||
Next, the existence of a trailing slash on the source path will determine whether the
|
||||
directory name will be embedded within the destination, or whether the destination will
|
||||
be created. An example explains this best:
|
||||
|
||||
If the source is `/foo` (no trailing slash), and the destination is `/tmp`, then the contents
|
||||
of `/foo` on the local machine will be uploaded to `/tmp/foo` on the remote machine. The
|
||||
`foo` directory on the remote machine will be created by Vault.
|
||||
|
||||
If the source, however, is `/foo/` (a trailing slash is present), and the destination is
|
||||
`/tmp`, then the contents of `/foo` will be uploaded directly into `/tmp` directly.
|
||||
|
||||
This behavior was adopted from the standard behavior of rsync. Note that under the covers,
|
||||
rsync may or may not be used.
|
||||
|
||||
48
website/source/downloads.html.erb
Normal file
@@ -0,0 +1,48 @@
|
||||
---
|
||||
layout: "downloads"
|
||||
page_title: "Download Vault"
|
||||
sidebar_current: "downloads-vault"
|
||||
description: |-
|
||||
Download Vault
|
||||
---
|
||||
|
||||
<h1>Download Vault</h1>
|
||||
|
||||
<section class="downloads">
|
||||
<div class="description row">
|
||||
<div class="col-md-12">
|
||||
<p>
|
||||
Below are all available downloads for the latest version of Vault
|
||||
(<%= latest_version %>). Please download the proper package for your
|
||||
operating system and architecture. You can find SHA256 checksums
|
||||
for packages <a href="https://dl.bintray.com/mitchellh/vault/vault_<%= latest_version %>_SHA256SUMS?direct">here</a>.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<% product_versions.each do |os, versions| %>
|
||||
<div class="row">
|
||||
<div class="col-md-12 download">
|
||||
<div class="icon pull-left"><%= system_icon(os) %>
|
||||
</div>
|
||||
<div class="details">
|
||||
<h2 class="os-name"><%= os %></h2>
|
||||
<ul>
|
||||
<% versions.each do |url| %>
|
||||
<li><a href="<%= url %>"><%= arch_for_filename(url) %></a></li>
|
||||
<% end %>
|
||||
</ul>
|
||||
<div class="clearfix">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12 poweredby">
|
||||
<a href='http://www.bintray.com'>
|
||||
<img src='https://www.bintray.com/docs/images/poweredByBintray_ColorTransparent.png'>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
BIN
website/source/favicon.png
Normal file
|
After Width: | Height: | Size: 986 B |
72
website/source/index.html.erb
Normal file
@@ -0,0 +1,72 @@
|
||||
<%= partial "layouts/sidebar" %>
|
||||
|
||||
<div id="hero">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-offset-3 col-md-6">
|
||||
<div id="logo-lockup"></div>
|
||||
<h2 id="tag-line">A tool for storing and retrieving secrets.</h2>
|
||||
<div>
|
||||
<a class="v-btn blue lrg" href="/intro">Get Started</a>
|
||||
</div>
|
||||
<div id="diagram"></div>
|
||||
<p><span class="strong">Vault</span> secures, stores and tightly controls access to tokens, passwords, certificates and other secrets in modern computing. Vault presents a unified access in front of multiple backends, with logical support for HSMs, IAM, Postgres and more.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-offset-3 col-md-6">
|
||||
<h2 class="featuer-header">Features</h2>
|
||||
|
||||
<div id="crud" class="feature">
|
||||
<div class="graphic"></div>
|
||||
<h3 class="">CRUD</h2>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas et purus at orci cursus mattis. Maecenas ullamcorper dictum elit. Vivamus sit amet nisi eu lacus lacinia iaculis. Nulla non massa ultricies, placerat lectus vel, mattis mauris. Nullam urna risus, volutpat quis viverra in, convallis at magna.
|
||||
</p>
|
||||
<div class="feature-footer">
|
||||
<a class="v-btn black sml" href="/intro">Learn more</a>
|
||||
</div>
|
||||
</div> <!-- .feature -->
|
||||
|
||||
<div id="key" class="feature">
|
||||
<div class="graphic"></div>
|
||||
<h3 class="">Key Rolling</h2>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas et purus at orci cursus mattis. Maecenas ullamcorper dictum elit. Vivamus sit amet nisi eu lacus lacinia iaculis. Nulla non massa ultricies, placerat lectus vel, mattis mauris. Nullam urna risus, volutpat quis viverra in, convallis at magna.
|
||||
<div class="feature-footer">
|
||||
<a class="v-btn black sml" href="/intro">Learn more</a>
|
||||
<a class="v-btn black sml terminal" href="/intro">Launch Interactive Terminal</a>
|
||||
</div>
|
||||
</p>
|
||||
</div> <!-- .feature -->
|
||||
|
||||
<div id="audit" class="feature">
|
||||
<div class="graphic"></div>
|
||||
<h3 class="">Audit Logs</h2>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas et purus at orci cursus mattis. Maecenas ullamcorper dictum elit. Vivamus sit amet nisi eu lacus lacinia iaculis. Nulla non massa ultricies, placerat lectus vel, mattis mauris. Nullam urna risus, volutpat quis viverra in, convallis at magna.
|
||||
<div class="feature-footer">
|
||||
<a class="v-btn black sml" href="/intro">Learn more</a>
|
||||
</div>
|
||||
</p>
|
||||
</div> <!-- .feature -->
|
||||
|
||||
</div> <!-- .col -->
|
||||
</div> <!-- .row -->
|
||||
|
||||
<div class="row">
|
||||
<div class="col-sm-offset-1 col-sm-10 col-xs-12">
|
||||
<div id="cta">
|
||||
<a class="v-btn black sml" href="/intro/index.html">Try Vault Free</a>
|
||||
<p class="cta-black">Maecenas ullamcorper dictum elit.</p>
|
||||
<p class="cta-gray">Vivamus venenatis augue.</p>
|
||||
</div><!-- #cta -->
|
||||
</div> <!-- .col -->
|
||||
</div> <!-- .row -->
|
||||
</div> <!-- /container -->
|
||||
</div> <!-- #features -->
|
||||
28
website/source/intro/examples/aws.html.markdown
Normal file
@@ -0,0 +1,28 @@
|
||||
---
|
||||
layout: "intro"
|
||||
page_title: "Basic Two-Tier AWS Architecture"
|
||||
sidebar_current: "examples-aws"
|
||||
description: |-
|
||||
This provides a template for running a simple two-tier architecture on Amazon Web services. The premise is that you have stateless app servers running behind an ELB serving traffic.
|
||||
---
|
||||
|
||||
# Basic Two-Tier AWS Architecture
|
||||
|
||||
[**Example Contents**](https://github.com/hashicorp/vault/tree/master/examples/aws-two-tier)
|
||||
|
||||
This provides a template for running a simple two-tier architecture on Amazon
|
||||
Web services. The premise is that you have stateless app servers running behind
|
||||
an ELB serving traffic.
|
||||
|
||||
To simplify the example, this intentionally ignores deploying and
|
||||
getting your application onto the servers. However, you could do so either via
|
||||
[provisioners](/docs/provisioners/index.html) and a configuration
|
||||
management tool, or by pre-baking configured AMIs with
|
||||
[Packer](https://www.packer.io).
|
||||
|
||||
After you run `vault apply` on this configuration, it will
|
||||
automatically output the DNS address of the ELB. After your instance
|
||||
registers, this should respond with the default nginx web page.
|
||||
|
||||
As with all examples, just copy and paste the example and run
|
||||
`vault apply` to see it work.
|
||||
212
website/source/intro/getting-started/build.html.md
Normal file
@@ -0,0 +1,212 @@
|
||||
---
|
||||
layout: "intro"
|
||||
page_title: "Build Infrastructure"
|
||||
sidebar_current: "gettingstarted-build"
|
||||
description: |-
|
||||
With Vault installed, let's dive right into it and start creating some infrastructure.
|
||||
---
|
||||
|
||||
# Build Infrastructure
|
||||
|
||||
With Vault installed, let's dive right into it and start creating
|
||||
some infrastructure.
|
||||
|
||||
We'll build infrastructure on
|
||||
[AWS](http://aws.amazon.com) for the getting started guide
|
||||
since it is popular and generally understood, but Vault
|
||||
can [manage many providers](/docs/providers/index.html),
|
||||
including multiple providers in a single configuration.
|
||||
Some examples of this are in the
|
||||
[use cases section](/intro/use-cases.html).
|
||||
|
||||
If you don't have an AWS account,
|
||||
[create one now](http://aws.amazon.com/free/).
|
||||
For the getting started guide, we'll only be using resources
|
||||
which qualify under the AWS
|
||||
[free-tier](http://aws.amazon.com/free/),
|
||||
meaning it will be free.
|
||||
If you already have an AWS account, you may be charged some
|
||||
amount of money, but it shouldn't be more than a few dollars
|
||||
at most.
|
||||
|
||||
~> **Warning!** If you're not using an account that qualifies under the AWS
|
||||
[free-tier](http://aws.amazon.com/free/), you may be charged to run these
|
||||
examples. The most you should be charged should only be a few dollars, but
|
||||
we're not responsible for any charges that may incur.
|
||||
|
||||
## Configuration
|
||||
|
||||
The set of files used to describe infrastructure in Vault is simply
|
||||
known as a Vault _configuration_. We're going to write our first
|
||||
configuration now to launch a single AWS EC2 instance.
|
||||
|
||||
The format of the configuration files is
|
||||
[documented here](/docs/configuration/index.html).
|
||||
Configuration files can
|
||||
[also be JSON](/docs/configuration/syntax.html), but we recommend only using JSON when the
|
||||
configuration is generated by a machine.
|
||||
|
||||
The entire configuration is shown below. We'll go over each part
|
||||
after. Save the contents to a file named `example.tf`. Verify that
|
||||
there are no other `*.tf` files in your directory, since Vault
|
||||
loads all of them.
|
||||
|
||||
```
|
||||
provider "aws" {
|
||||
access_key = "ACCESS_KEY_HERE"
|
||||
secret_key = "SECRET_KEY_HERE"
|
||||
region = "us-east-1"
|
||||
}
|
||||
|
||||
resource "aws_instance" "example" {
|
||||
ami = "ami-408c7f28"
|
||||
instance_type = "t1.micro"
|
||||
}
|
||||
```
|
||||
|
||||
Replace the `ACCESS_KEY_HERE` and `SECRET_KEY_HERE` with your
|
||||
AWS access key and secret key, available from
|
||||
[this page](https://console.aws.amazon.com/iam/home?#security_credential).
|
||||
We're hardcoding them for now, but will extract these into
|
||||
variables later in the getting started guide.
|
||||
|
||||
This is a complete configuration that Vault is ready to apply.
|
||||
The general structure should be intuitive and straightforward.
|
||||
|
||||
The `provider` block is used to configure the named provider, in
|
||||
our case "aws." A provider is responsible for creating and
|
||||
managing resources. Multiple provider blocks can exist if a
|
||||
Vault configuration is comprised of multiple providers,
|
||||
which is a common situation.
|
||||
|
||||
The `resource` block defines a resource that exists within
|
||||
the infrastructure. A resource might be a physical component such
|
||||
as an EC2 instance, or it can be a logical resource such as
|
||||
a Heroku application.
|
||||
|
||||
The resource block has two strings before opening the block:
|
||||
the resource type and the resource name. In our example, the
|
||||
resource type is "aws\_instance" and the name is "example."
|
||||
The prefix of the type maps to the provider. In our case
|
||||
"aws\_instance" automatically tells Vault that it is
|
||||
managed by the "aws" provider.
|
||||
|
||||
Within the resource block itself is configuration for that
|
||||
resource. This is dependent on each resource provider and
|
||||
is fully documented within our
|
||||
[providers reference](/docs/providers/index.html). For our EC2 instance, we specify
|
||||
an AMI for Ubuntu, and request a "t1.micro" instance so we
|
||||
qualify under the free tier.
|
||||
|
||||
## Execution Plan
|
||||
|
||||
Next, let's see what Vault would do if we asked it to
|
||||
apply this configuration. In the same directory as the
|
||||
`example.tf` file you created, run `vault plan`. You
|
||||
should see output similar to what is copied below. We've
|
||||
truncated some of the output to save space.
|
||||
|
||||
```
|
||||
$ vault plan
|
||||
...
|
||||
|
||||
+ aws_instance.example
|
||||
ami: "" => "ami-408c7f28"
|
||||
availability_zone: "" => "<computed>"
|
||||
instance_type: "" => "t1.micro"
|
||||
key_name: "" => "<computed>"
|
||||
private_dns: "" => "<computed>"
|
||||
private_ip: "" => "<computed>"
|
||||
public_dns: "" => "<computed>"
|
||||
public_ip: "" => "<computed>"
|
||||
security_groups: "" => "<computed>"
|
||||
subnet_id: "" => "<computed>"
|
||||
```
|
||||
|
||||
`vault plan` shows what changes Vault will apply to
|
||||
your infrastructure given the current state of your infrastructure
|
||||
as well as the current contents of your configuration.
|
||||
|
||||
If `vault plan` failed with an error, read the error message
|
||||
and fix the error that occurred. At this stage, it is probably a
|
||||
syntax error in the configuration.
|
||||
|
||||
The output format is similar to the diff format generated by tools
|
||||
such as Git. The output has a "+" next to "aws\_instance.example",
|
||||
meaning that Vault will create this resource. Beneath that,
|
||||
it shows the attributes that will be set. When the value it is
|
||||
going to is `<computed>`, it means that the value won't be known
|
||||
until the resource is created.
|
||||
|
||||
## Apply
|
||||
|
||||
The plan looks good, our configuration appears valid, so it's time to
|
||||
create real resources. Run `vault apply` in the same directory
|
||||
as your `example.tf`, and watch it go! It will take a few minutes
|
||||
since Vault waits for the EC2 instance to become available.
|
||||
|
||||
```
|
||||
$ vault apply
|
||||
aws_instance.example: Creating...
|
||||
ami: "" => "ami-408c7f28"
|
||||
instance_type: "" => "t1.micro"
|
||||
|
||||
Apply complete! Resources: 1 added, 0 changed, 0 destroyed.
|
||||
|
||||
...
|
||||
```
|
||||
|
||||
Done! You can go to the AWS console to prove to yourself that the
|
||||
EC2 instance has been created.
|
||||
|
||||
Vault also put some state into the `vault.tfstate` file
|
||||
by default. This state file is extremely important; it maps various
|
||||
resource metadata to actual resource IDs so that Vault knows
|
||||
what it is managing. This file must be saved and distributed
|
||||
to anyone who might run Vault. We recommend simply putting it
|
||||
into version control, since it generally isn't too large.
|
||||
|
||||
You can inspect the state using `vault show`:
|
||||
|
||||
```
|
||||
$ vault show
|
||||
aws_instance.example:
|
||||
id = i-e60900cd
|
||||
ami = ami-408c7f28
|
||||
availability_zone = us-east-1c
|
||||
instance_type = t1.micro
|
||||
key_name =
|
||||
private_dns = domU-12-31-39-12-38-AB.compute-1.internal
|
||||
private_ip = 10.200.59.89
|
||||
public_dns = ec2-54-81-21-192.compute-1.amazonaws.com
|
||||
public_ip = 54.81.21.192
|
||||
security_groups.# = 1
|
||||
security_groups.0 = default
|
||||
subnet_id =
|
||||
```
|
||||
|
||||
You can see that by creating our resource, we've also gathered
|
||||
a lot more metadata about it. This metadata can actually be referenced
|
||||
for other resources or outputs, which will be covered later in
|
||||
the getting started guide.
|
||||
|
||||
## Provisioning
|
||||
|
||||
The EC2 instance we launched at this point is based on the AMI
|
||||
given, but has no additional software installed. If you're running
|
||||
an image-based infrastructure (perhaps creating images with
|
||||
[Packer](https://www.packer.io)), then this is all you need.
|
||||
|
||||
However, many infrastructures still require some sort of initialization
|
||||
or software provisioning step. Vault supports
|
||||
provisioners,
|
||||
which we'll cover a little bit later in the getting started guide,
|
||||
in order to do this.
|
||||
|
||||
## Next
|
||||
|
||||
Congratulations! You've built your first infrastructure with Vault.
|
||||
You've seen the configuration syntax, an example of a basic execution
|
||||
plan, and understand the state file.
|
||||
|
||||
Next, we're going to move on to [changing and destroying infrastructure](/intro/getting-started/change.html).
|
||||
97
website/source/intro/getting-started/change.html.md
Normal file
@@ -0,0 +1,97 @@
|
||||
---
|
||||
layout: "intro"
|
||||
page_title: "Change Infrastructure"
|
||||
sidebar_current: "gettingstarted-change"
|
||||
description: |-
|
||||
In the previous page, you created your first infrastructure with Vault: a single EC2 instance. In this page, we're going to modify that resource, and see how Vault handles change.
|
||||
---
|
||||
|
||||
# Change Infrastructure
|
||||
|
||||
In the previous page, you created your first infrastructure with
|
||||
Vault: a single EC2 instance. In this page, we're going to
|
||||
modify that resource, and see how Vault handles change.
|
||||
|
||||
Infrastructure is continuously evolving, and Vault was built
|
||||
to help manage and enact that change. As you change Vault
|
||||
configurations, Vault builds an execution plan that only
|
||||
modifies what is necessary to reach your desired state.
|
||||
|
||||
By using Vault to change infrastructure, you can version
|
||||
control not only your configurations but also your state so you
|
||||
can see how the infrastructure evolved over time.
|
||||
|
||||
## Configuration
|
||||
|
||||
Let's modify the `ami` of our instance. Edit the "aws\_instance.example"
|
||||
resource in your configuration and change it to the following:
|
||||
|
||||
```
|
||||
resource "aws_instance" "example" {
|
||||
ami = "ami-aa7ab6c2"
|
||||
instance_type = "t1.micro"
|
||||
}
|
||||
```
|
||||
|
||||
We've changed the AMI from being an Ubuntu 14.04 AMI to being
|
||||
an Ubuntu 12.04 AMI. Vault configurations are meant to be
|
||||
changed like this. You can also completely remove resources
|
||||
and Vault will know to destroy the old one.
|
||||
|
||||
## Execution Plan
|
||||
|
||||
Let's see what Vault will do with the change we made.
|
||||
|
||||
```
|
||||
$ vault plan
|
||||
...
|
||||
|
||||
-/+ aws_instance.example
|
||||
ami: "ami-408c7f28" => "ami-aa7ab6c2" (forces new resource)
|
||||
availability_zone: "us-east-1c" => "<computed>"
|
||||
key_name: "" => "<computed>"
|
||||
private_dns: "domU-12-31-39-12-38-AB.compute-1.internal" => "<computed>"
|
||||
private_ip: "10.200.59.89" => "<computed>"
|
||||
public_dns: "ec2-54-81-21-192.compute-1.amazonaws.com" => "<computed>"
|
||||
public_ip: "54.81.21.192" => "<computed>"
|
||||
security_groups: "" => "<computed>"
|
||||
subnet_id: "" => "<computed>"
|
||||
```
|
||||
|
||||
The prefix "-/+" means that Vault will destroy and recreate
|
||||
the resource, versus purely updating it in-place. While some attributes
|
||||
can do in-place updates (which are shown with a "~" prefix), AMI
|
||||
changing on EC2 instance requires a new resource. Vault handles
|
||||
these details for you, and the execution plan makes it clear what
|
||||
Vault will do.
|
||||
|
||||
Additionally, the plan output shows that the AMI change is what
|
||||
necessitated the creation of a new resource. Using this information,
|
||||
you can tweak your changes to possibly avoid destroy/create updates
|
||||
if you didn't want to do them at this time.
|
||||
|
||||
## Apply
|
||||
|
||||
From the plan, we know what will happen. Let's apply and enact
|
||||
the change.
|
||||
|
||||
```
|
||||
$ vault apply
|
||||
aws_instance.example: Destroying...
|
||||
aws_instance.example: Modifying...
|
||||
ami: "ami-408c7f28" => "ami-aa7ab6c2"
|
||||
|
||||
Apply complete! Resources: 0 added, 1 changed, 1 destroyed.
|
||||
|
||||
...
|
||||
```
|
||||
|
||||
As the plan predicted, Vault started by destroying our old
|
||||
instance, then creating the new one. You can use `vault show`
|
||||
again to see the new properties associated with this instance.
|
||||
|
||||
## Next
|
||||
|
||||
You've now seen how easy it is to modify infrastructure with
|
||||
Vault. Feel free to play around with this more before continuing.
|
||||
In the next section we're going to [destroy our infrastructure](/intro/getting-started/destroy.html).
|
||||
73
website/source/intro/index.html.markdown
Normal file
@@ -0,0 +1,73 @@
|
||||
---
|
||||
layout: "intro"
|
||||
page_title: "Introduction"
|
||||
sidebar_current: "what"
|
||||
description: |-
|
||||
Welcome to the intro guide to Vault! This guide is the best place to start with Vault. We cover what Vault is, what problems it can solve, how it compares to existing software, and contains a quick start for using Vault.
|
||||
---
|
||||
|
||||
# Introduction to Vault
|
||||
|
||||
Welcome to the intro guide to Vault! This guide is the best
|
||||
place to start with Vault. We cover what Vault is, what
|
||||
problems it can solve, how it compares to existing software,
|
||||
and contains a quick start for using Vault.
|
||||
|
||||
If you are already familiar with the basics of Vault, the
|
||||
[documentation](/docs/index.html) provides a better reference
|
||||
guide for all available features as well as internals.
|
||||
|
||||
## What is Vault?
|
||||
|
||||
Vault is a tool for building, changing, and versioning infrastructure
|
||||
safely and efficiently. Vault can manage existing and popular service
|
||||
providers as well as custom in-house solutions.
|
||||
|
||||
Configuration files describe to Vault the components needed to
|
||||
run a single application or your entire datacenter.
|
||||
Vault generates an execution plan describing
|
||||
what it will do to reach the desired state, and then executes it to build the
|
||||
described infrastructure. As the configuration changes, Vault is able
|
||||
to determine what changed and create incremental execution plans which
|
||||
can be applied.
|
||||
|
||||
The infrastructure Vault can manage includes
|
||||
low-level components such as
|
||||
compute instances, storage, and networking, as well as high-level
|
||||
components such as DNS entries, SaaS features, etc.
|
||||
|
||||
Examples work best to showcase Vault. Please see the
|
||||
[use cases](/intro/use-cases.html).
|
||||
|
||||
The key features of Vault are:
|
||||
|
||||
* **Infrastructure as Code**: Infrastructure is described using a high-level
|
||||
configuration syntax. This allows a blueprint of your datacenter to be
|
||||
versioned and treated as you would any other code. Additionally,
|
||||
infrastructure can be shared and re-used.
|
||||
|
||||
* **Execution Plans**: Vault has a "planning" step where it generates
|
||||
an _execution plan_. The execution plan shows what Vault will do when
|
||||
you call apply. This lets you avoid any surprises when Vault
|
||||
manipulates infrastructure.
|
||||
|
||||
* **Resource Graph**: Vault builds a graph of all your resources,
|
||||
and parallelizes the creation and modification of any non-dependent
|
||||
resources. Because of this, Vault builds infrastructure as efficiently
|
||||
as possible, and operators get insight into dependencies in their
|
||||
infrastructure.
|
||||
|
||||
* **Change Automation**: Complex changesets can be applied to
|
||||
your infrastructure with minimal human interaction.
|
||||
With the previously mentioned execution
|
||||
plan and resource graph, you know exactly what Vault will change
|
||||
and in what order, avoiding many possible human errors.
|
||||
|
||||
## Next Steps
|
||||
|
||||
See the page on [Vault use cases](/intro/use-cases.html) to see the
|
||||
multiple ways Vault can be used. Then see
|
||||
[how Vault compares to other software](/intro/vs/index.html)
|
||||
to see how it fits into your existing infrastructure. Finally, continue onwards with
|
||||
the [getting started guide](/intro/getting-started/install.html) to use
|
||||
Vault to manage real infrastructure and to see how it works.
|
||||
121
website/source/intro/use-cases.html.markdown
Normal file
@@ -0,0 +1,121 @@
|
||||
---
|
||||
layout: "intro"
|
||||
page_title: "Use Cases"
|
||||
sidebar_current: "use-cases"
|
||||
description: |-
|
||||
Before understanding use cases, it's useful to know what Vault is. This page lists some concrete use cases for Vault, but the possible use cases are much broader than what we cover. Due to its extensible nature, providers and provisioners can be added to further extend Vault's ability to manipulate resources.
|
||||
---
|
||||
|
||||
# Use Cases
|
||||
|
||||
Before understanding use cases, it's useful to know [what Vault is](/intro/index.html).
|
||||
This page lists some concrete use cases for Vault, but the possible use cases are
|
||||
much broader than what we cover. Due to its extensible nature, providers and provisioners
|
||||
can be added to further extend Vault's ability to manipulate resources.
|
||||
|
||||
#### Heroku App Setup
|
||||
|
||||
Heroku is a popular PaaS for hosting web apps. Developers create an app, and then
|
||||
attach add-ons, such as a database, or email provider. One of the best features is
|
||||
the ability to elastically scale the number of dynos or workers. However, most
|
||||
non-trivial applications quickly need many add-ons and external services.
|
||||
|
||||
Vault can be used to codify the setup required for a Heroku application, ensuring
|
||||
that all the required add-ons are available, but it can go even further: configuring
|
||||
DNSimple to set a CNAME, or setting up CloudFlare as a CDN for the
|
||||
app. Best of all, Vault can do all of this in under 30 seconds without
|
||||
using a web interface.
|
||||
|
||||
#### Multi-Tier Applications
|
||||
|
||||
A very common pattern is the N-tier architecture. The most common 2-tier architecture is
|
||||
a pool of web servers that use a database tier. Additional tiers get added for API servers,
|
||||
caching servers, routing meshes, etc. This pattern is used because the tiers can be scaled
|
||||
independently and provide a separation of concerns.
|
||||
|
||||
Vault is an ideal tool for building and managing these infrastructures. Each tier can
|
||||
be described as a collection of resources, and the dependencies between each tier are handled
|
||||
automatically; Vault will ensure the database tier is available before the web servers
|
||||
are started and that the load balancers are aware of the web nodes. Each tier can then be
|
||||
scaled easily using Vault by modifying a single `count` configuration value. Because
|
||||
the creation and provisioning of a resource is codified and automated, elastically scaling
|
||||
with load becomes trivial.
|
||||
|
||||
#### Self-Service Clusters
|
||||
|
||||
At a certain organizational size, it becomes very challenging for a centralized
|
||||
operations team to manage a large and growing infrastructure. Instead it becomes
|
||||
more attractive to make "self-serve" infrastructure, allowing product teams to
|
||||
manage their own infrastructure using tooling provided by the central operations team.
|
||||
|
||||
Using Vault, the knowledge of how to build and scale a service can be codified
|
||||
in a configuration. Vault configurations can be shared within an organization
|
||||
enabling customer teams to use the configuration as a black box and use Vault as
|
||||
a tool to manage their services.
|
||||
|
||||
#### Software Demos
|
||||
|
||||
Modern software is increasingly networked and distributed. Although tools like
|
||||
[Vagrant](https://www.vagrantup.com/) exist to build virtualized environments
|
||||
for demos, it is still very challenging to demo software on real infrastructure
|
||||
which more closely matches production environments.
|
||||
|
||||
Software writers can provide a Vault configuration to create, provision and
|
||||
bootstrap a demo on cloud providers like AWS. This allows end users to easily demo
|
||||
the software on their own infrastructure, and even enables tweaking parameters like
|
||||
cluster size to more rigorously test tools at any scale.
|
||||
|
||||
#### Disposable Environments
|
||||
|
||||
It is common practice to have both a production and staging or QA environment.
|
||||
These environments are smaller clones of their production counterpart, but are
|
||||
used to test new applications before releasing in production. As the production
|
||||
environment grows larger and more complex, it becomes increasingly onerous to
|
||||
maintain an up-to-date staging environment.
|
||||
|
||||
Using Vault, the production environment can be codified and then shared with
|
||||
staging, QA or dev. These configurations can be used to rapidly spin up new
|
||||
environments to test in, and then be easily disposed of. Vault can help tame
|
||||
the difficulty of maintaining parallel environments, and makes it practical
|
||||
to elastically create and destroy them.
|
||||
|
||||
#### Software Defined Networking
|
||||
|
||||
Software Defined Networking (SDN) is becoming increasingly prevalent in the
|
||||
datacenter, as it provides more control to operators and developers and
|
||||
allows the network to better support the applications running on top. Most SDN
|
||||
implementations have a control layer and infrastructure layer.
|
||||
|
||||
Vault can be used to codify the configuration for software defined networks.
|
||||
This configuration can then be used by Vault to automatically setup and modify
|
||||
settings by interfacing with the control layer. This allows configuration to be
|
||||
versioned and changes to be automated. As an example, [AWS VPC](http://aws.amazon.com/vpc/)
|
||||
is one of the most commonly used SDN implementations, and [can be configured by
|
||||
Vault](/docs/providers/aws/r/vpc.html).
|
||||
|
||||
#### Resource Schedulers
|
||||
|
||||
In large-scale infrastructures, static assignment of applications to machines
|
||||
becomes increasingly challenging. To solve that problem, there are a number
|
||||
of schedulers like Borg, Mesos, YARN, and Kubernetes. These can be used to
|
||||
dynamically schedule Docker containers, Hadoop, Spark, and many other software
|
||||
tools.
|
||||
|
||||
Vault is not limited to physical providers like AWS. Resource schedulers
|
||||
can be treated as a provider, enabling Vault to request resources from them.
|
||||
This allows Vault to be used in layers: to setup the physical infrastructure
|
||||
running the schedulers as well as provisioning onto the scheduled grid.
|
||||
|
||||
#### Multi-Cloud Deployment
|
||||
|
||||
It's often attractive to spread infrastructure across multiple clouds to increase
|
||||
fault-tolerance. By using only a single region or cloud provider, fault tolerance
|
||||
is limited by the availability of that provider. Having a multi-cloud deployment
|
||||
allows for more graceful recovery of the loss of a region or entire provider.
|
||||
|
||||
Realizing multi-cloud deployments can be very challenging as many existing tools
|
||||
for infrastructure management are cloud-specific. Vault is cloud-agnostic
|
||||
and allows a single configuration to be used to manage multiple providers, and
|
||||
to even handle cross-cloud dependencies. This simplifies management and orchestration,
|
||||
helping operators build large-scale multi-cloud infrastructures.
|
||||
|
||||
40
website/source/intro/vs/custom.html.markdown
Normal file
@@ -0,0 +1,40 @@
|
||||
---
|
||||
layout: "intro"
|
||||
page_title: "Vault vs. Custom Solutions"
|
||||
sidebar_current: "vs-other-custom"
|
||||
description: |-
|
||||
Most organizations start by manually managing infrastructure through simple scripts or web-based interfaces. As the infrastructure grows, any manual approach to management becomes both error-prone and tedious, and many organizations begin to home-roll tooling to help automate the mechanical processes involved.
|
||||
---
|
||||
|
||||
# Vault vs. Custom Solutions
|
||||
|
||||
Most organizations start by manually managing infrastructure through
|
||||
simple scripts or web-based interfaces. As the infrastructure grows,
|
||||
any manual approach to management becomes both error-prone and tedious,
|
||||
and many organizations begin to home-roll tooling to help
|
||||
automate the mechanical processes involved.
|
||||
|
||||
These tools require time and resources to build and maintain.
|
||||
As tools of necessity, they represent the minimum viable
|
||||
features needed by an organization, being built to handle only
|
||||
the immediate needs. As a result, they are often hard
|
||||
to extend and difficult to maintain. Because the tooling must be
|
||||
updated in lockstep with any new features or infrastructure,
|
||||
it becomes the limiting factor for how quickly the infrastructure
|
||||
can evolve.
|
||||
|
||||
Vault is designed to tackle these challenges. It provides a simple,
|
||||
unified syntax, allowing almost any resource to be managed without
|
||||
learning new tooling. By capturing all the resources required, the
|
||||
dependencies between them can be resolved automatically so that operators
|
||||
do not need to remember and reason about them. Removing the burden
|
||||
of building the tool allows operators to focus on their infrastructure
|
||||
and not the tooling.
|
||||
|
||||
Furthermore, Vault is an open source tool. In addition to
|
||||
HashiCorp, the community around Vault helps to extend its features,
|
||||
fix bugs and document new use cases. Vault helps solve a problem
|
||||
that exists in every organization and provides a standard that can
|
||||
be adopted to avoid reinventing the wheel between and within organizations.
|
||||
Its open source nature ensures it will be around in the long term.
|
||||
|
||||
21
website/source/intro/vs/index.html.markdown
Normal file
@@ -0,0 +1,21 @@
|
||||
---
|
||||
layout: "intro"
|
||||
page_title: "Vault vs. Other Software"
|
||||
sidebar_current: "vs-other"
|
||||
description: |-
|
||||
Vault provides a flexible abstraction of resources and providers. This model allows for representing everything from physical hardware, virtual machines, and containers, to email and DNS providers. Because of this flexibility, Vault can be used to solve many different problems. This means there are a number of existing tools that overlap with the capabilities of Vault. We compare Vault to a number of these tools, but it should be noted that Vault is not mutually exclusive with other systems. It can be used to manage a single application, or the entire datacenter.
|
||||
---
|
||||
|
||||
# Vault vs. Other Software
|
||||
|
||||
Vault provides a flexible abstraction of resources and providers. This model
|
||||
allows for representing everything from physical hardware, virtual machines, and
|
||||
containers, to email and DNS providers. Because of this flexibility, Vault
|
||||
can be used to solve many different problems. This means there are a number of
|
||||
existing tools that overlap with the capabilities of Vault. We compare Vault
|
||||
to a number of these tools, but it should be noted that Vault is not mutually
|
||||
exclusive with other systems. It can be used to manage a single application, or the
|
||||
entire datacenter.
|
||||
|
||||
Use the navigation on the left to read comparisons of Vault versus other
|
||||
specific systems.
|
||||
35
website/source/layouts/_footer.erb
Normal file
@@ -0,0 +1,35 @@
|
||||
<div id="footer">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-offset-1 col-md-5 col-sm-6 col-xs-12">
|
||||
<ul class="footer-links nav navbar-nav">
|
||||
<li class="li-under"><a href="/intro/index.html">Intro</a></li>
|
||||
<li class="active li-under"><a href="/docs/index.html">Docs</a></li>
|
||||
<li class="li-under"><a href="/community.html">Community</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="footer-hashi col-md-5 col-sm-6 col-xs-12">
|
||||
<div class="pull-right">
|
||||
<span>A <a href="https://www.hashicorp.com">HashiCorp</a> Project.</span>
|
||||
<a class="hashi-logo" href="https://www.hashicorp.com"><i class="hashi-logo"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||||
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||||
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
|
||||
|
||||
ga('create', 'UA-53231375-1', 'auto');
|
||||
ga('send', 'pageview');
|
||||
</script>
|
||||
|
||||
<%= javascript_include_tag "application" %>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
32
website/source/layouts/_header.erb
Normal file
@@ -0,0 +1,32 @@
|
||||
<div id="header" class="<%= current_page.data.page_title == "home" ? "" : "navbar-static-top" %>">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-offset-1 col-md-10 col-xs-12">
|
||||
<div class="navbar-header">
|
||||
<div class="navbar-brand">
|
||||
<a class="logo" href="/">Vault</a>
|
||||
</div>
|
||||
<ul class="main-links nav navbar-nav navbar-right hidden-xs">
|
||||
<li class="first li-under"><a href="/intro/index.html">Intro</a></li>
|
||||
<li class="li-under"><a href="/docs/index.html">Docs</a></li>
|
||||
<li class="li-under"><a href="/community.html">Community</a></li>
|
||||
</ul>
|
||||
<button class="navbar-toggle" type="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="buttons hidden-xs">
|
||||
<nav role="navigation">
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li class="first"><a href="/downloads.html">Download</a></li>
|
||||
<li class=""><a href="https://github.com/hashicorp/vault">GitHub</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
21
website/source/layouts/_meta.erb
Normal file
@@ -0,0 +1,21 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="<%= current_page.data.description %>">
|
||||
|
||||
<link rel="shortcut icon" href="<%= image_path('favicon.png') %>">
|
||||
|
||||
<title><%= [current_page.data.page_title, "Vault by HashiCorp"].compact.join(" - ") %></title>
|
||||
|
||||
<%= stylesheet_link_tag "application" %>
|
||||
|
||||
<!--[if lt IE 9]>
|
||||
<%= javascript_include_tag "html5shiv", "respond.min" %>
|
||||
<![endif]-->
|
||||
|
||||
<%= yield_content :head %>
|
||||
</head>
|
||||
|
||||
<body id="page-<%= current_page.data.page_title ? "#{current_page.data.page_title}" : "home" %>" class="page-<%= current_page.data.page_title ? "#{current_page.data.page_title} layout-#{current_page.data.layout} page-sub" : "home layout-#{current_page.data.layout}" %>">
|
||||
26
website/source/layouts/_sidebar.erb
Normal file
@@ -0,0 +1,26 @@
|
||||
<!-- Overlay for fixed sidebar -->
|
||||
<div class="sidebar-overlay"></div>
|
||||
|
||||
<!-- Material sidebar -->
|
||||
<aside id="sidebar" class="sidebar sidebar-default sidebar-fixed-right" role="navigation">
|
||||
<!-- Sidebar header -->
|
||||
<div class="sidebar-header header-cover">
|
||||
<!-- Sidebar brand image -->
|
||||
<div class="sidebar-image">
|
||||
<img src="<%= image_path('logo-icon-large@2x.png') %>" width="112px" height="72px">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sidebar navigation -->
|
||||
<ul class="nav sidebar-nav">
|
||||
<li class="first"><a href="/intro/index.html">Intro</a></li>
|
||||
<li class=""><a href="/docs/index.html">Docs</a></li>
|
||||
<li class=""><a href="/community.html">Community</a></li>
|
||||
</ul>
|
||||
|
||||
<!-- Sidebar navigation 2-->
|
||||
<ul class="buttons-nav">
|
||||
<li class="first"><a class="v-btn gray sml" href="/downloads.html">Download</a></li>
|
||||
<li class=""><a class="v-btn gray sml" href="https://github.com/hashicorp/vault">GitHub</a></li>
|
||||
</ul>
|
||||
</aside>
|
||||
217
website/source/layouts/docs.erb
Normal file
@@ -0,0 +1,217 @@
|
||||
<% wrap_layout :inner do %>
|
||||
<% content_for :sidebar do %>
|
||||
<div class="docs-sidebar hidden-print affix-top" role="complementary">
|
||||
<ul class="nav docs-sidenav">
|
||||
<li<%= sidebar_current("docs-home") %>>
|
||||
<a href="/docs/index.html">Documentation Home</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-config") %>>
|
||||
<a href="/docs/configuration/index.html">Configuration</a>
|
||||
<ul class="nav">
|
||||
<li<%= sidebar_current("docs-config-load") %>>
|
||||
<a href="/docs/configuration/load.html">Load Order and Semantics</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-config-syntax") %>>
|
||||
<a href="/docs/configuration/syntax.html">Configuration Syntax</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-config-interpolation") %>>
|
||||
<a href="/docs/configuration/interpolation.html">Interpolation Syntax</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-config-override") %>>
|
||||
<a href="/docs/configuration/override.html">Overrides</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-config-resources") %>>
|
||||
<a href="/docs/configuration/resources.html">Resources</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-config-providers") %>>
|
||||
<a href="/docs/configuration/providers.html">Providers</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-config-variables") %>>
|
||||
<a href="/docs/configuration/variables.html">Variables</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-config-outputs") %>>
|
||||
<a href="/docs/configuration/outputs.html">Outputs</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-config-modules") %>>
|
||||
<a href="/docs/configuration/modules.html">Modules</a>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-commands") %>>
|
||||
<a href="/docs/commands/index.html">Commands (CLI)</a>
|
||||
<ul class="nav">
|
||||
<li<%= sidebar_current("docs-commands-apply") %>>
|
||||
<a href="/docs/commands/apply.html">apply</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-commands-destroy") %>>
|
||||
<a href="/docs/commands/destroy.html">destroy</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-commands-get") %>>
|
||||
<a href="/docs/commands/get.html">get</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-commands-graph") %>>
|
||||
<a href="/docs/commands/graph.html">graph</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-commands-init") %>>
|
||||
<a href="/docs/commands/init.html">init</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-commands-output") %>>
|
||||
<a href="/docs/commands/output.html">output</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-commands-plan") %>>
|
||||
<a href="/docs/commands/plan.html">plan</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-commands-refresh") %>>
|
||||
<a href="/docs/commands/refresh.html">refresh</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-commands-remote") %>>
|
||||
<a href="/docs/commands/remote.html">remote</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-commands-show") %>>
|
||||
<a href="/docs/commands/show.html">show</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-commands-taint") %>>
|
||||
<a href="/docs/commands/taint.html">taint</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-providers") %>>
|
||||
<a href="/docs/providers/index.html">Providers</a>
|
||||
<ul class="nav">
|
||||
<li<%= sidebar_current("docs-providers-atlas") %>>
|
||||
<a href="/docs/providers/atlas/index.html">Atlas</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-providers-aws") %>>
|
||||
<a href="/docs/providers/aws/index.html">AWS</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-providers-cloudflare") %>>
|
||||
<a href="/docs/providers/cloudflare/index.html">CloudFlare</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-providers-cloudstack") %>>
|
||||
<a href="/docs/providers/cloudstack/index.html">CloudStack</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-providers-consul") %>>
|
||||
<a href="/docs/providers/consul/index.html">Consul</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-providers-do") %>>
|
||||
<a href="/docs/providers/do/index.html">DigitalOcean</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-providers-dme") %>>
|
||||
<a href="/docs/providers/dme/index.html">DNSMadeEasy</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-providers-dnsimple") %>>
|
||||
<a href="/docs/providers/dnsimple/index.html">DNSimple</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-providers-google") %>>
|
||||
<a href="/docs/providers/google/index.html">Google Cloud</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-providers-heroku") %>>
|
||||
<a href="/docs/providers/heroku/index.html">Heroku</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-providers-mailgun") %>>
|
||||
<a href="/docs/providers/mailgun/index.html">Mailgun</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-provisioners") %>>
|
||||
<a href="/docs/provisioners/index.html">Provisioners</a>
|
||||
<ul class="nav">
|
||||
<li<%= sidebar_current("docs-provisioners-connection") %>>
|
||||
<a href="/docs/provisioners/connection.html">connection</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-provisioners-file") %>>
|
||||
<a href="/docs/provisioners/file.html">file</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-provisioners-local") %>>
|
||||
<a href="/docs/provisioners/local-exec.html">local-exec</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-provisioners-remote") %>>
|
||||
<a href="/docs/provisioners/remote-exec.html">remote-exec</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-modules") %>>
|
||||
<a href="/docs/modules/index.html">Modules</a>
|
||||
<ul class="nav">
|
||||
<li<%= sidebar_current("docs-modules-usage") %>>
|
||||
<a href="/docs/modules/usage.html">Usage</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-modules-sources") %>>
|
||||
<a href="/docs/modules/sources.html">Sources</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-modules-create") %>>
|
||||
<a href="/docs/modules/create.html">Creating Modules</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-plugins") %>>
|
||||
<a href="/docs/plugins/index.html">Plugins</a>
|
||||
<ul class="nav">
|
||||
<li<%= sidebar_current("docs-plugins-basics") %>>
|
||||
<a href="/docs/plugins/basics.html">Basics</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-plugins-provider") %>>
|
||||
<a href="/docs/plugins/provider.html">Provider</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-internals") %>>
|
||||
<a href="/docs/internals/index.html">Internals</a>
|
||||
<ul class="nav">
|
||||
<li<%= sidebar_current("docs-internals-graph") %>>
|
||||
<a href="/docs/internals/graph.html">Resource Graph</a>
|
||||
</li>
|
||||
|
||||
<li<%= sidebar_current("docs-internals-lifecycle") %>>
|
||||
<a href="/docs/internals/lifecycle.html">Resource Lifecycle</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<%= yield %>
|
||||
<% end %>
|
||||
13
website/source/layouts/downloads.erb
Normal file
@@ -0,0 +1,13 @@
|
||||
<% wrap_layout :inner do %>
|
||||
<% content_for :sidebar do %>
|
||||
<div class="docs-sidebar hidden-print affix-top" role="complementary">
|
||||
<ul class="nav docs-sidenav">
|
||||
<li<%= sidebar_current("downloads-vault") %>>
|
||||
<a href="/downloads.html">Download Vault</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<%= yield %>
|
||||
<% end %>
|
||||
14
website/source/layouts/inner.erb
Normal file
@@ -0,0 +1,14 @@
|
||||
<% wrap_layout :layout do %>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-offset-1 col-md-2 col-sm-3 col-xs-12">
|
||||
<%= yield_content :sidebar %>
|
||||
</div> <!-- /col-md-4 -->
|
||||
<div id="main-content" class="col-sm-9 col-md-8 col-xs-12" role="main">
|
||||
<div class="bs-docs-section">
|
||||
<%= yield %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||