Commit 724d63d0 authored by Ernst van Nierop's avatar Ernst van Nierop

Merge branch '910-move-calculator' into 'master'

Resolve "Make a "move" calculator"

Closes #910

See merge request !3914
parents 4d904934 97a9d5f0
Pipeline #5237369 passed with stages
in 8 minutes and 39 seconds
- current_page.data.extra_css ||= []
- current_page.data.extra_css |= ['salary-calculator.css']
- current_page.data.extra_js ||= []
- current_page.data.extra_js |= ['move-calculator.js']
.move-container.col-xs-12
%h2#move Move
.col-sm-12
%h4.title Current Contract
.col-sm-4
.dropdown.current-country
%button.dropdown-menu-toggle.btn{ type: 'button', 'data-toggle' => 'dropdown' }
%span.label Country
%span.title --
%i.fa.fa-chevron-down
%ul.dropdown-menu.dropdown-scroll
%li.filter-container
%input.filter-input.js-country-filter{ type: 'search', placeholder: 'Search country' }
%i.fa.fa-search
- data.numbeo.uniq(&:country).sort_by(&:country).each do |p|
%li
%span.key= p.country
.col-sm-4
.dropdown.current-city
%button.dropdown-menu-toggle.disabled.btn{ type: 'button', 'data-toggle' => 'dropdown' }
%span.label City
%span.title --
%span.subtitle
%i.fa.fa-chevron-down
%ul.dropdown-menu.dropdown-scroll
%li.filter-container
%input.filter-input.js-city-filter{ type: 'search', placeholder: 'Search city' }
%i.fa.fa-search
- data.numbeo.sort_by(&:city).each do |p|
%li.hidden{'data-current-country' => p.country}
%span.key= p.city
%span.display-value= sprintf('%0.2f', (p.rentIndex*0.01).round(2))
.col-sm-4
.form-group.input-container.current-salary
%label.input-label{ for: 'current-salary' } Current Compensation
%span.input-prefix $
%input#current-salary.form-control.input-sm.input-field{ placeholder: 'Enter your compensation', maxlength: "6" }
.col-sm-12
%h4.title New Contract
.col-sm-4
.dropdown.new-country
%button.dropdown-menu-toggle.btn{ type: 'button', 'data-toggle' => 'dropdown' }
%span.label Country
%span.title --
%i.fa.fa-chevron-down
%ul.dropdown-menu.dropdown-scroll
%li.filter-container
%input.filter-input.js-country-filter{ type: 'search', placeholder: 'Search country' }
%i.fa.fa-search
- data.numbeo.uniq(&:country).sort_by(&:country).each do |p|
%li
%span.key= p.country
.col-sm-4
.dropdown.new-city
%button.dropdown-menu-toggle.disabled.btn{ type: 'button', 'data-toggle' => 'dropdown' }
%span.label City
%span.title --
%span.subtitle
%i.fa.fa-chevron-down
%ul.dropdown-menu.dropdown-scroll
%li.filter-container
%input.filter-input.js-city-filter{ type: 'search', placeholder: 'Search city' }
%i.fa.fa-search
- data.numbeo.sort_by(&:city).each do |p|
%li.hidden{'data-new-country' => p.country}
%span.key= p.city
%span.display-value= sprintf('%0.2f', (p.rentIndex*0.01).round(2))
.col-sm-4
.compensation
.title New Compensation
.amount --
.col-sm-12.formula-container
%h4 How did we calculate your compensation?
.formula
.variable-group
.variable.currentSalary
%span.name Current Salary
%span.value $
.symbol.multiplication x
.variable-group
.symbol (
.variable.newRentIndex
%span.name New Rent Index
%span.value --
.symbol +
.constant 0.25
.symbol )
.symbol.division /
.variable-group
.symbol (
.variable.currentRentIndex
%span.name Current Rent Index
%span.value --
.symbol +
.constant 0.25
.symbol )
.symbol.multiplication x
.variable-group
.symbol (
.variable.newContractTypeFactor
%span.name New Contract Type Factor
%span.value --
.symbol /
.variable.currentContractTypeFactor
%span.name Current Contract Type Factor
%span.value --
.symbol )
.explanation
Find out
= succeed '.' do
%a{href: '/handbook/people-operations/global-compensation-framework#compensation-calculator'} how our calculator works
You are also eligible for
%a{href: '/handbook/stock-options/'} stock options
and
= succeed '.' do
%a{href: '/handbook/benefits/'} other benefits
%span.contract-type-container.hidden
Based on the information provided, we expect you will be
%span.grammer a
%strong.contract-type contractor
at GitLab
%span.company-type BV.
This diff is collapsed.
---
layout: job_page
title: "Move"
---
<%= partial "includes/move_calculator" %>
@import "variables";
.salary-container {
.salary-container,
.move-container {
padding: 0 0 45px;
.col-sm-4,
......@@ -118,6 +119,54 @@
}
}
.move-container {
.title {
margin-top: 15px;
}
@media (min-width: 767px) {
.col-sm-4,
.updated-compensation {
padding: 0 5px;
}
}
.col-sm-12 .col-sm-4 {
&:first-of-type {
padding-left: 0;
}
&:last-of-type {
padding-right: 0;
}
}
.compensation {
position: relative;
min-height: 45px;
.title,
.amount {
position: absolute;
}
.title {
top: 4px;
margin-top: 0;
padding: 0;
font-size: 13px;
border: 0;
}
.amount {
bottom: 4px;
font-size: 15px;
}
}
}
.filter-container {
.filter-input {
padding: 0 7px;
......@@ -146,3 +195,58 @@
color: $dropdown-fa-color;
}
}
.input-container {
position: relative;
min-height: 45px;
margin: 0;
padding: 6px 20px 6px 10px;
border: 1px solid $dropdown-border-color;
border-radius: 3px;
&:hover {
border-color: $dropdown-focus-color;
}
.input-label,
.input-prefix,
.input-field {
position: absolute;
}
.input-label {
top: 4px;
font-size: 13px;
color: $color-gray-light;
font-weight: normal;
}
.input-prefix {
left: 10;
bottom: 3px;
color: $color-gray-light;
}
.input-field {
bottom: 4px;
left: 20px;
padding: 0;
width: 90%;
height: 18px;
font-size: 15px;
outline: 0;
border: 0;
box-shadow: none;
&:hover,
&:focus {
outline: 0;
box-shadow: none;
border-color: $dropdown-focus-color;
}
}
&.has-value .input-prefix {
color: $dropdown-fa-focus-color;
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment