Commit ec5eaeea authored by Kenny Johnston's avatar Kenny Johnston 🏖

Rename Competitor to DevOps Tool

parent a6a29401
source/javascripts/libs/*.js
source/javascripts/autodevops-animation.js
source/javascripts/mobile-menu.js
source/javascripts/rotate-competitors.js
source/javascripts/rotate-devops_tools.js
source/javascripts/testimonials.js
vendor/
public/
......
### Description
Compare GitLab with <Competitor>.
Compare GitLab with <DevOps_Tool>.
### Links / references
(Add links to the competitor home page, documentation, Wikipedia article, etc.)
(Add links to the devops tools home page, documentation, Wikipedia article, etc.)
-
-
......
### Description
Create comparison page for: GitLab vs <Competitor>.
Create comparison page for: GitLab vs <DevOps_Tool>.
Closes <link to issue>
......
require 'scss_lint/rake_task'
require 'yaml'
require 'stringex'
require_relative './lib/competitor.rb'
require_relative './lib/devops_tool.rb'
require_relative './lib/team.rb'
desc 'Run all lint tasks'
task lint: ['lint:scss',
'lint:competitors:categories',
'lint:devops_tools:categories',
'lint:events',
'lint:blog:categories',
'lint:roles_yml',
......@@ -25,31 +25,31 @@ namespace :lint do
Rake::Task['scss_lint'].invoke
end
namespace :competitors do
desc "Ensure every competitor has at least one valid category"
namespace :devops_tools do
desc "Ensure every devops tool has at least one valid category"
task :categories do
failed = 0
categories = YAML.load_file('data/categories.yml')
puts ''
puts '=> Checking if every competitor has a valid category'
puts '=> Checking if every devops tool has a valid category'
Gitlab::Homepage::Competitor.all!.each do |competitor|
next if competitor.gitlab?
Gitlab::Homepage::DevopsTool.all!.each do |devops_tool|
next if devops_tool.gitlab?
# allow nil category
next unless competitor.category
next unless devops_tool.category
# fail on nil category
# unless competitor.category
# puts competitor.key
# unless devops_tool.category
# puts devops_tool.key
# failed += 1
# next
# end
competitor.category.each do |category_key|
devops_tool.category.each do |category_key|
if categories.key?(category_key) == false
failed += 1
puts "#{competitor.key} has invalid category #{category_key}"
puts "#{devops_tool.key} has invalid category #{category_key}"
end
end
end
......@@ -57,14 +57,14 @@ namespace :lint do
unless failed.zero?
puts '----------------------------'
if failed == 1
puts "Oops! #{failed} competitor has an invalid category"
puts "Oops! #{failed} devops tool has an invalid category"
else
puts "Oops! #{failed} competitors have an invalid category"
puts "Oops! #{failed} devops tools have an invalid category"
end
exit 1
end
puts 'Every competitor has a valid category! Congrats!'
puts 'Every devops tool has a valid category! Congrats!'
end
end
......@@ -551,7 +551,7 @@ end
desc 'Comparison PDFS'
task :comparison_pdfs do
file = YAML.load_file('data/features.yml')
file['competitors'].each_key do |key, competitor|
file['devops_tools'].each_key do |key, devops_tool|
puts key
next if key[0..6] == 'gitlab_'
......
......@@ -107,16 +107,16 @@ org_chart = OrgChart.new
proxy '/company/team/org-chart/index.html', '/company/team/org-chart/template.html', locals: { team_data_tree: org_chart.team_data_tree }, ignore: true
# Proxy Comparison html and PDF pages
data.features.competitors.each_key do |competitor|
next if competitor[0..6] == 'gitlab_'
data.features.devops_tools.each_key do |devops_tool|
next if devops_tool[0..6] == 'gitlab_'
file_name = "#{competitor}-vs-gitlab".tr('_', '-')
file_name = "#{devops_tool}-vs-gitlab".tr('_', '-')
proxy "/devops-tools/#{file_name}.html", "/templates/comparison.html", locals: {
key_one: competitor,
key_one: devops_tool,
key_two: 'gitlab_ultimate'
}
proxy "/devops-tools/pdfs/#{file_name}.html", '/devops-tools/pdfs/template.html', locals: {
key_one: competitor,
key_one: devops_tool,
key_two: 'gitlab_ultimate'
}, ignore: true
end
......
......@@ -2,7 +2,7 @@
# https://about.gitlab.com/handbook/marketing/website/#adding-features-to-webpages
# https://about.gitlab.com/handbook/marketing/website/#creating-a-comparison-page
competitors:
devops_tools:
# gitlab_core, gitlab_starter, gitlab_premium are needed for the feature comparison
# table under /products.
gitlab_core:
......
......@@ -2,7 +2,7 @@ require 'yaml'
module Gitlab
module Homepage
class Competitor
class DevopsTool
attr_reader :key
def initialize(key, data)
......@@ -29,14 +29,14 @@ module Gitlab
def self.all!
@features ||= YAML.load_file('data/features.yml')
@features['competitors'].map do |key, data|
@features['devops_tools'].map do |key, data|
new(key, data)
end
end
def self.for_stage(stage)
all!.dup.keep_if do |competitor|
!competitor.gitlab? && competitor.category && !(competitor.category & stage.categories.map(&:key)).empty?
all!.dup.keep_if do |devops_tool|
!devops_tool.gitlab? && devops_tool.category && !(devops_tool.category & stage.categories.map(&:key)).empty?
end
end
end
......
......@@ -2,7 +2,7 @@ module Gitlab
module Homepage
autoload :Team, 'lib/team'
autoload :Event, 'lib/event'
autoload :Competitor, 'lib/competitor'
autoload :DevopsTool, 'lib/devops_tool'
autoload :Category, 'lib/category'
autoload :Stage, 'lib/stage'
autoload :Feature, 'lib/feature'
......
......@@ -14,8 +14,8 @@ module Gitlab
@categories ||= Category.for_stage(self)
end
def competitors
@competitors ||= Competitor.for_stage(self)
def devops_tools
@devops_tools ||= DevopsTool.for_stage(self)
end
# rubocop:disable Style/MethodMissingSuper
......
......@@ -13,5 +13,5 @@ extra_js:
- bootstrap-tooltip.js
---
- competitors = data.features.competitors
- devops_tools = data.features.devops_tools
= partial "includes/home/sdlc-alt"
......@@ -2,8 +2,8 @@
layout: false
---
- product_one = data.features.competitors[key_one]
- product_two = data.features.competitors[key_two]
- product_one = data.features.devops_tools[key_one]
- product_two = data.features.devops_tools[key_two]
%html
%head
......
......@@ -264,7 +264,7 @@ To add a new feature, add a feature block to under the `features:` section of th
- solution: REQUIRED legacy field. A [stage of the DevOps lifecycle](https://gitlab.com/gitlab-com/www-gitlab-com/blob/master/data/stages.yml). Will be [removed soon](https://gitlab.com/gitlab-com/www-gitlab-com/issues/2435).
- tier: `true` or `false` is this feature or capability available in this tier? `gitlab_core`, `gitlab_starter`, `gitlab_premium`, `gitlab_ultimate`
- gitlab_com: `true` or `false` is this feature or capability available on GitLab.com? Because GitLab.com tiers map 1:1 to self-managed tiers setting this will automatically assign the GitLab.com tier. E.g. `gitlab_core: true` + `gitlab_com: true` == `GitLab.com Free`. Adding a tiers fields is what powers the tier badges on product pages and comparison pages, as well as powers the tier [feature comparison of the pricing page](https://about.gitlab.com/pricing/self-managed/feature-comparison/).
- tools: `true` or `false` or `partially` - any tool from the `competitors:` section such as `jira:`, `circle_ci:`, `blackduck:`, etc. that does or does not have this feature. Examples of `partially` are if a competitor has some but not all of the feature described, or if they have the feature, but only through a plugin. See [Creating a comparison page](#creating-a-comparison-page)
- tools: `true` or `false` or `partially` - any tool from the `devops_tools:` section such as `jira:`, `circle_ci:`, `blackduck:`, etc. that does or does not have this feature. Examples of `partially` are if a DevOps tool has some but not all of the feature described, or if they have the feature, but only through a plugin. See [Creating a comparison page](#creating-a-comparison-page)
- pricing_page: `true` | `false` this option was created when the pricing page used to be called the "products" page. Setting true cause the feature to show up on the [pricing page](/pricing/#self-managed). Only a limited number of the most important capabilities should be shown on the main pricing page to keep it easily consumable. Folks can click on "see all features" to see the full list of features ([self-managed comparison](/pricing/self-managed/feature-comparison/), [GitLab.com comparison](/pricing/gitlab-com/feature-comparison/)).
For example:
......@@ -318,11 +318,11 @@ Copy and paste this template:
### Creating a DevOps tools comparison page
The [`/devops-tools`](/devops-tools) section of the website shows info about DevOps tools and a feature comparison of those tools to Gitlab. Comparison pages are auto-generated from `features.yml`. All you need to do is add a tool to the `competitors` section and add that tool id to some features and the page will be created.
The [`/devops-tools`](/devops-tools) section of the website shows info about DevOps tools and a feature comparison of those tools to Gitlab. Comparison pages are auto-generated from `features.yml`. All you need to do is add a tool to the `devops_tools` section and add that tool id to some features and the page will be created.
To add a new comparison page:
1. Edit [`features.yml`](https://gitlab.com/gitlab-com/www-gitlab-com/blob/master/data/features.yml)
2. Under the `competitors` section add a tool.
2. Under the `devops_tools` section add a tool.
Although the summary and include_file fields are not strictly required by the parser in order to build the page, every tool should have at least one paragraph summarizing the comparison.
......
- comparisons = data.features.comparisons
- category_lookup = data.categories
- competitors = data.features.competitors
- competitor_keys = competitors.keys.delete_if{ |c| c[0..6] == 'gitlab_' }.sort
- competitor_categories = competitor_keys.map{ |n| competitors[n] }.keep_if{ |c| c['category'] }.collect{ |c| c.category }.flatten.uniq.compact.sort
- gitlab_keys = competitors.keys.keep_if{ |c| c[0..6] == 'gitlab_' }
- gitlab_categories = gitlab_keys.map{ |n| competitors[n] }.keep_if{ |c| c['category'] }.collect{ |c| c.category }.flatten.uniq.compact.sort
- categories = competitor_categories & gitlab_categories
- devops_tools = data.features.devops_tools
- devops_tool_keys = devops_tools.keys.delete_if{ |c| c[0..6] == 'gitlab_' }.sort
- devops_tool_categories = devops_tool_keys.map{ |n| devops_tools[n] }.keep_if{ |c| c['category'] }.collect{ |c| c.category }.flatten.uniq.compact.sort
- gitlab_keys = devops_tools.keys.keep_if{ |c| c[0..6] == 'gitlab_' }
- gitlab_categories = gitlab_keys.map{ |n| devops_tools[n] }.keep_if{ |c| c['category'] }.collect{ |c| c.category }.flatten.uniq.compact.sort
- categories = devops_tool_categories & gitlab_categories
- key_one ||= ''
- key_two ||= ''
-# Check if tools have features
- valid_tools = {}
- competitor_keys.each do |competitor|
- devops_tool_keys.each do |devops_tool|
- data.features.features.each do |feature|
- if (feature[competitor] != nil)
- valid_tools[competitor] = true
- if (feature[devops_tool] != nil)
- valid_tools[devops_tool] = true
- break
.text-center
......@@ -33,18 +33,18 @@
%span
= category_lookup[category].name
.dropdown.level#competitors-filter{ data: { selected: key_two } }
.dropdown.level#devops_tools-filter{ data: { selected: key_two } }
%button.dropdown-menu-toggle.btn{type: 'button', 'data-toggle' => 'dropdown'}
%span Tool
%i.fa.fa-chevron-down
%ul.dropdown-menu
- competitor_keys.each do |competitor_key|
- competitor = competitors[competitor_key]
- if (valid_tools[competitor_key] != nil)
%li{ data: { categories: '||' + (competitor.category ? competitor.category.join('||') : '') + '||', key: competitor_key } }
- devops_tool_keys.each do |devops_tool_key|
- devops_tool = devops_tools[devops_tool_key]
- if (valid_tools[devops_tool_key] != nil)
%li{ data: { categories: '||' + (devops_tool.category ? devops_tool.category.join('||') : '') + '||', key: devops_tool_key } }
%span
= competitor.name
= devops_tool.name
%div vs.
......
......@@ -13,7 +13,7 @@
- Gitlab::Homepage::Stage.all!.select{|stage| stage.dept!="enablement"}.each do |stage|
%td.solutions-container
%a.gitlab-logo-container{href: "/stages-devops-lifecycle/#{stage.key}/"}
.competitor-tooltip
.devops-tool-tooltip
%p.tooltip-text
GitLab
.tooltip-carat
......@@ -21,14 +21,14 @@
%tr.separate-application-row
- Gitlab::Homepage::Stage.all!.select{|stage| stage.dept!="enablement"}.each do |stage|
%td.competitors-container{ id: "#{stage.key}-competitors-container" }
- stage.competitors.each do |competitor|
%a.competitor-logo-container{ href: "/devops-tools/#{competitor.key.dup.tr('_', '-')}-vs-gitlab.html" }
.competitor-tooltip
%td.devops-tools-container{ id: "#{stage.key}-devops-tools-container" }
- stage.devops_tools.each do |devops_tool|
%a.devops-tool-logo-container{ href: "/devops-tools/#{devops_tool.key.dup.tr('_', '-')}-vs-gitlab.html" }
.devops-tool-tooltip
%p.tooltip-text
= competitor.name
= devops_tool.name
.tooltip-carat
%img.competitor-logo{ src: "#{competitor.logo}", alt: "#{competitor.name} logo png" }
%img.devops-tool-logo{ src: "#{devops_tool.logo}", alt: "#{devops_tool.name} logo png" }
.btn-group.margin-top20
%a.btn.cta-btn.accent.see-all-comparisons{ href: '/devops-tools/' } See and compare all DevOps tools
......@@ -41,19 +41,19 @@
- url = data.categories[key].alt_link ? data.categories[key].alt_link : "/product/#{key.tr('_', '-').downcase}/"
%a.future-category{ href: "#{url}", target: "_blank" } #{data.categories[key].name}
.competitors-wrapper{ id: "#{stage.key}-competitors-container" }
.devops-tools-wrapper{ id: "#{stage.key}-devops_tools-container" }
%p.replace-text.font-bold GitLab can replace:
.competitors-container
- stage.competitors.each do |competitor|
%a.competitor-logo-container{ href: "/devops-tools/#{competitor.key.dup.tr('_', '-')}-vs-gitlab.html" }
.competitor-tooltip
.devops-tools-container
- stage.devops_tools.each do |devops_tool|
%a.devops-tool-logo-container{ href: "/devops-tools/#{devops_tool.key.dup.tr('_', '-')}-vs-gitlab.html" }
.devops-tool-tooltip
%p.tooltip-text
= competitor.name
= devops_tool.name
.tooltip-carat
%img.competitor-logo{ src: "#{competitor.logo}", alt: "#{competitor.name} logo png" }
%img.devops-tool-logo{ src: "#{devops_tool.logo}", alt: "#{devops_tool.name} logo png" }
.btn-group.margin-top40
%a.btn.cta-btn.orange.see-all-comparisons{ href: '/devops-tools/' } See and compare all DevOps tools
%script{ src: "/javascripts/rotate-competitors.js" }
%script{ src: "/javascripts/rotate-devops_tools.js" }
%script{ src: "/javascripts/libs/tweenmax.min.js" }
......@@ -67,9 +67,9 @@ var CategoryRoiCalculator = {
this.$total = this.$container.find('#js-roi-calculator-total');
this.$annual_total = this.$container.find('#js-roi-calculator-annual-total');
this.$inputs.on('change', this.handleChange.bind(this));
$(document).on('click', '.js-competitor-dropdown li', this.handleDropdownClick.bind(this));
$(document).on('click', '.js-devops-tool-dropdown li', this.handleDropdownClick.bind(this));
this.updateTotal();
this.setDefaultCompetitors();
this.setDefaultDevopsTools();
this.setupAddToolSupport();
this.addOtherToolchainOptions();
this.preSelectChoices();
......@@ -82,7 +82,7 @@ var CategoryRoiCalculator = {
}
var self = this;
// Default all pulldowns to no selection
this.$container.find('.js-competitor-dropdown .dropdown-title').html('');
this.$container.find('.js-devops-tool-dropdown .dropdown-title').html('');
$.each(stages, function(i, stage) {
var keyInStage = { };
var textInStage = { };
......@@ -101,7 +101,7 @@ var CategoryRoiCalculator = {
if ( keyInStage[tool.key] ) {
return;
}
var $tool = $row.find('.js-roi-calculator-competitor[data-key="' + tool.key + '"]');
var $tool = $row.find('.js-roi-calculator-devops-tool[data-key="' + tool.key + '"]');
if ($tool.length > 0) {
self.updateDropdownTitle($tool, overwrite);
keyInStage[tool.key] = true;
......@@ -141,13 +141,13 @@ var CategoryRoiCalculator = {
$row.find('.js-roi-calculator-add-tool').remove();
$row.after($newRow);
$newRow.find('.js-roi-calculator-input').val(this.default_cost);
$newRow.find('.js-competitor-dropdown .dropdown-title').html('');
$newRow.find('.js-devops-tool-dropdown .dropdown-title').html('');
window.setTimeout(function() { this.updateTotal(); }.bind(this), 100);
return $newRow;
},
addOtherToolchainOptions: function() {
var selector = '.js-other-tool-input';
this.$container.find('.js-competitor-dropdown .dropdown-menu').each(function() {
this.$container.find('.js-devops-tool-dropdown .dropdown-menu').each(function() {
$(this).append('<li data-type="other">Other</li>');
});
$(document)
......@@ -173,9 +173,9 @@ var CategoryRoiCalculator = {
}.bind(this))
;
},
setDefaultCompetitors: function() {
setDefaultDevopsTools: function() {
var self = this;
$('.js-competitor-dropdown ul').each(function() {
$('.js-devops-tool-dropdown ul').each(function() {
var $$ = $(this).children(':first');
if ( $$.length > 0 ) {
self.updateDropdownTitle($$);
......@@ -232,7 +232,7 @@ var CategoryRoiCalculator = {
return;
}
var choices = {};
this.$container.find('.js-competitor-dropdown .dropdown-title').each(function() {
this.$container.find('.js-devops-tool-dropdown .dropdown-title').each(function() {
var $$ = $(this);
var $row = $$.parents('.js-data-row:first');
var stage = $row.data('stage');
......@@ -296,7 +296,7 @@ var CategoryRoiChooser = {
var tools = CategoryRoiStore.toolsForStage(stage);
$.each(tools, function(j, tool) {
if (tool.key) {
var $tool = $container.find('.js-roi-choose-tool[data-stage="' + stage + '"][data-competitor="' + tool.key + '"]');
var $tool = $container.find('.js-roi-choose-tool[data-stage="' + stage + '"][data-devops-tool="' + tool.key + '"]');
$tool.addClass('is-selected');
if ( tool.category_key ) {
$tool.data('category-key', tool.category_key);
......@@ -336,7 +336,7 @@ var CategoryRoiChooser = {
if (!choices[$$.data('stage')]) {
choices[$$.data('stage')] = [];
}
choices[$$.data('stage')].push({ key: $$.data('competitor'), category_key: $$.data('category-key') });
choices[$$.data('stage')].push({ key: $$.data('devops-tool'), category_key: $$.data('category-key') });
});
$(this.selector).find('.js-roi-custom-tool').each(function() {
var $$ = $(this);
......
......@@ -64,8 +64,8 @@ $(function() {
};
CategoriesFilter.init();
var CompetitorsFilter = {
selector: '#competitors-filter',
var DevopsToolsFilter = {
selector: '#devops-tools-filter',
$el: [],
$selected_option: null,
$options: [],
......@@ -121,7 +121,7 @@ $(function() {
this.$title.text(this.value());
}
};
CompetitorsFilter.init();
DevopsToolsFilter.init();
var GitLabProductsFilter = {
value: function() {
......@@ -146,13 +146,13 @@ $(function() {
},
render: function() {
var gitlabProduct = GitLabProductsFilter.linkValue();
var competitor = CompetitorsFilter.linkValue();
if (!gitlabProduct || !competitor) {
var devopsTool = DevopsToolsFilter.linkValue();
if (!gitlabProduct || !devopsTool) {
this.$el.attr('disabled', true);
return;
}
this.$el.attr('disabled', false);
var href = ('/devops-tools/' + competitor + '-vs-' + gitlabProduct + '.html').replace(/_/g, '-');
var href = ('/devops-tools/' + devopsTool + '-vs-' + gitlabProduct + '.html').replace(/_/g, '-');
this.$el.attr('href', href);
}
};
......
(function() {
var competitorsContainers = document.getElementsByClassName('competitors-container');
function getLogos() {
for (var i = 0; i < competitorsContainers.length; i++) {
if (competitorsContainers[i].children.length > 1) {
var tlLeft = new TimelineMax({ repeat: -1 });
tlLeft.staggerTo(competitorsContainers[i].children, 0, {ease: Power4.easeOut, opacity: 1, zIndex: 1}, 4);
tlLeft.staggerTo(competitorsContainers[i].children, 0, {ease: Power4.easeOut, opacity: 0, zIndex: 0}, 4);
tlLeft.play();
} else if (competitorsContainers[i].children.length) {
competitorsContainers[i].firstElementChild.style.opacity = '1';
}
}
}
window.addEventListener('load', getLogos);
})();
(function() {
var devops_toolsContainers = document.getElementsByClassName('devops-tools-container');
function getLogos() {
for (var i = 0; i < devops_toolsContainers.length; i++) {
if (devops_toolsContainers[i].children.length > 1) {
var tlLeft = new TimelineMax({ repeat: -1 });
tlLeft.staggerTo(devops_toolsContainers[i].children, 0, {ease: Power4.easeOut, opacity: 1, zIndex: 1}, 4);
tlLeft.staggerTo(devops_toolsContainers[i].children, 0, {ease: Power4.easeOut, opacity: 0, zIndex: 0}, 4);
tlLeft.play();
} else if (devops_toolsContainers[i].children.length) {
devops_toolsContainers[i].firstElementChild.style.opacity = '1';
}
}
}
window.addEventListener('load', getLogos);
})();
......@@ -13,6 +13,6 @@ extra_js:
%h2.faq-title.light.text-center
Feature Comparison
.comparison-page-content.comparison.gray-bg#comparison
= partial "includes/features/table", locals: { product_one: data.features.competitors.gitlab_core, product_two: data.features.competitors.gitlab_starter, product_three: data.features.competitors.gitlab_premium, product_four: data.features.competitors.gitlab_ultimate, key_one: 'gitlab_core', key_two: 'gitlab_starter', key_three: 'gitlab_premium', key_four: 'gitlab_ultimate', name_one: 'Free', name_two: 'Bronze', name_three: 'Silver', name_four: 'Gold', gitlab_com_features: true }
= partial "includes/features/table", locals: { product_one: data.features.devops_tools.gitlab_core, product_two: data.features.devops_tools.gitlab_starter, product_three: data.features.devops_tools.gitlab_premium, product_four: data.features.devops_tools.gitlab_ultimate, key_one: 'gitlab_core', key_two: 'gitlab_starter', key_three: 'gitlab_premium', key_four: 'gitlab_ultimate', name_one: 'Free', name_two: 'Bronze', name_three: 'Silver', name_four: 'Gold', gitlab_com_features: true }
.text-center
= link_to "Contact Us", "/sales/", class: "featured-item-button contact-us-button"
\ No newline at end of file
......@@ -13,7 +13,7 @@ extra_js:
%h2.faq-title.light.text-center
Feature Comparison
.comparison-page-content.comparison.gray-bg#comparison
= partial "includes/features/table", locals: { product_one: data.features.competitors.gitlab_core, product_two: data.features.competitors.gitlab_starter, product_three: data.features.competitors.gitlab_premium, product_four: data.features.competitors.gitlab_ultimate, key_one: 'gitlab_core', key_two: 'gitlab_starter', key_three: 'gitlab_premium', key_four: 'gitlab_ultimate', name_one: 'Free', name_two: 'Bronze', name_three: 'Silver', name_four: 'Gold', gitlab_com_features: true }
= partial "includes/features/table", locals: { product_one: data.features.devops_tools.gitlab_core, product_two: data.features.devops_tools.gitlab_starter, product_three: data.features.devops_tools.gitlab_premium, product_four: data.features.devops_tools.gitlab_ultimate, key_one: 'gitlab_core', key_two: 'gitlab_starter', key_three: 'gitlab_premium', key_four: 'gitlab_ultimate', name_one: 'Free', name_two: 'Bronze', name_three: 'Silver', name_four: 'Gold', gitlab_com_features: true }
.text-center
= link_to "Contact Us", "/sales/", class: "featured-item-button contact-us-button"
......@@ -17,7 +17,7 @@ extra_font:
%h2.faq-title.light.text-center
Feature Comparison
.comparison-page-content.comparison.gray-bg#comparison
= partial "includes/features/table", locals: { product_one: data.features.competitors.gitlab_core, product_two: data.features.competitors.gitlab_starter, product_three: data.features.competitors.gitlab_premium, product_four: data.features.competitors.gitlab_ultimate, key_one: 'gitlab_core', key_two: 'gitlab_starter', key_three: 'gitlab_premium', key_four: 'gitlab_ultimate', gitlab_com_features: false, highlight_features: false }
= partial "includes/features/table", locals: { product_one: data.features.devops_tools.gitlab_core, product_two: data.features.devops_tools.gitlab_starter, product_three: data.features.devops_tools.gitlab_premium, product_four: data.features.devops_tools.gitlab_ultimate, key_one: 'gitlab_core', key_two: 'gitlab_starter', key_three: 'gitlab_premium', key_four: 'gitlab_ultimate', gitlab_com_features: false, highlight_features: false }
.text-center
= link_to "See pricing", "/pricing/", class: "featured-item-button"
.text-center
......
......@@ -57,17 +57,17 @@ extra_js:
Included
.col-xs-4.data-col
.toolchain-group
.dropdown.level.js-competitor-dropdown
.dropdown.level.js-devops-tool-dropdown
%button.dropdown-menu-toggle.btn{type: 'button', 'data-toggle' => 'dropdown'}
.dropdown-title
%i.fa.fa-chevron-down
%ul.dropdown-menu.dropdown-scroll
- data.features.competitors.each do |competitor_key, competitor|
- next if competitor_key[0..6] == 'gitlab_'
- next unless competitor.category && competitor.category.include?(category_key)
%li.js-roi-calculator-competitor{ data: { key: competitor_key } }
%img{src: competitor.logo}
= competitor.name
- data.features.devops_tools.each do |devops_tool_key, devops_tool|
- next if devops_tool_key[0..6] == 'gitlab_'
- next unless devops_tool.category && devops_tool.category.include?(category_key)
%li.js-roi-calculator-devops-tool{ data: { key: devops_tool_key } }
%img{src: devops_tool.logo}
= devops_tool.name
%span.add-tool.js-roi-calculator-add-tool
= partial "images/icons/add.svg"
.toolchain-cost-field
......
......@@ -32,14 +32,14 @@ extra_js:
%tr.separate-application-row
- Gitlab::Homepage::Stage.all!.select{|stage| stage.dept!="enablement"}.each do |stage|
%td.competitors-container{ id: "#{stage.key}-competitors-container" }
- stage.competitors.each do |competitor|
%span.competitor-logo-container.js-roi-choose-tool{ data: { stage: stage.key, competitor: competitor.key } }
.competitor-tooltip
%td.devops-tools-container{ id: "#{stage.key}-devops-tools-container" }
- stage.devops_tools.each do |devops_tool|
%span.devops-tool-logo-container.js-roi-choose-tool{ data: { stage: stage.key, devops_tool: devops_tool.key } }
.devops-tool-tooltip
%p.tooltip-text
= competitor.name
= devops_tool.name
.tooltip-carat
%img.competitor-logo{ src: "#{competitor.logo}", alt: "#{competitor.name} logo png" }
%img.devops-tool-logo{ src: "#{devops_tool.logo}", alt: "#{devops_tool.name} logo png" }
%span.add-tool.js-add-tool{ data: { stage: stage.key } }
= partial "images/icons/add.svg"
......
......@@ -1961,12 +1961,12 @@ iframe {
}
.competitors-wrapper {
.devops-tools-wrapper {
height: 90px;
flex-shrink: 0;
width: 100%;
.competitors-container {
.devops-tools-container {
position: relative;
width: 100%;
height: 100%;
......@@ -2079,7 +2079,7 @@ iframe {
}
//scss-lint:disable all
.competitor-logo-container {
.devops-tool-logo-container {
opacity: 0;
position: absolute;
left: 0;
......@@ -2092,14 +2092,14 @@ iframe {
align-items: center;
object-fit: contain;
.competitor-logo {
.devops-tool-logo {
display: block;
max-height: calc(100% - 40px);
max-width: 80%;
width: auto;
}
.competitor-tooltip {
.devops-tool-tooltip {
display: none;
justify-content: center;
align-items: center;
......@@ -2130,13 +2130,13 @@ iframe {
}
}
.competitor-logo-container:hover {
.devops-tool-logo-container:hover {
.competitor-tooltip {
.devops-tool-tooltip {
display: flex;
}
.competitor-logo {
.devops-tool-logo {
transform: scale(1.1);
}
}
......@@ -2169,7 +2169,7 @@ iframe {
max-width: 100%;
}
.competitor-logo {
.devops-tool-logo {
// position: absolute;
transition: $transition-primary;
max-height: calc(80% - 20px);
......@@ -2273,7 +2273,7 @@ iframe {
width: 100%;
}
.competitors-container {
.devops-tools-container {
padding: 10px;
}
......@@ -2369,7 +2369,7 @@ iframe {
}
//scss-lint:disable all
.competitor-logo-container,
.devops-tool-logo-container,
.gitlab-logo-container {
height: 80px;
width: 100%;
......@@ -2378,7 +2378,7 @@ iframe {
align-items: center;
position: relative;
.competitor-tooltip {
.devops-tool-tooltip {
display: none;
justify-content: center;
align-items: center;
......@@ -2412,18 +2412,18 @@ iframe {
//scss-lint:disable all
&