instantjob-recruiter-client/dist/common/styles.js

a set of tools for creating an instantjob recruiter react client

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.rotate = exports.acceleration = exports.desceleration = exports.ease = exports.ellipsis = exports.input = exports.card = exports.circle = exports.disabled_link = exports.link = undefined;

var _taggedTemplateLiteral2 = require('babel-runtime/helpers/taggedTemplateLiteral');

var _taggedTemplateLiteral3 = _interopRequireDefault(_taggedTemplateLiteral2);

var _templateObject = (0, _taggedTemplateLiteral3.default)(['\n  &:hover {\n    cursor: pointer;\n    opacity: 0.54;\n  }\n\n  &:active {\n    opacity: 0.36;\n  }\n'], ['\n  &:hover {\n    cursor: pointer;\n    opacity: 0.54;\n  }\n\n  &:active {\n    opacity: 0.36;\n  }\n']),
    _templateObject2 = (0, _taggedTemplateLiteral3.default)(['\n  &:hover {\n    cursor: not-allowed;\n    opacity: 1;\n  }\n\n  &:active {\n    opacity: 1;\n  }\n'], ['\n  &:hover {\n    cursor: not-allowed;\n    opacity: 1;\n  }\n\n  &:active {\n    opacity: 1;\n  }\n']),
    _templateObject3 = (0, _taggedTemplateLiteral3.default)(['\n  width: ', 'px;\n  height: ', 'px;\n  border-radius: ', 'px;\n'], ['\n  width: ', 'px;\n  height: ', 'px;\n  border-radius: ', 'px;\n']),
    _templateObject4 = (0, _taggedTemplateLiteral3.default)(['\n  border-radius: 2px;\n  background-color: white;\n  box-shadow: 0 1px 2px 1px ', ';\n  padding: 20px;\n  margin-bottom: 2px;\n'], ['\n  border-radius: 2px;\n  background-color: white;\n  box-shadow: 0 1px 2px 1px ', ';\n  padding: 20px;\n  margin-bottom: 2px;\n']),
    _templateObject5 = (0, _taggedTemplateLiteral3.default)(['\n  background-color: transparent;\n  border-style: none;\n  padding-left: 0;\n\n  &:focus {\n    outline-color: transparent;\n    outline-style: none;\n  }\n'], ['\n  background-color: transparent;\n  border-style: none;\n  padding-left: 0;\n\n  &:focus {\n    outline-color: transparent;\n    outline-style: none;\n  }\n']),
    _templateObject6 = (0, _taggedTemplateLiteral3.default)(['\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  max-width: ', ';\n'], ['\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  max-width: ', ';\n']),
    _templateObject7 = (0, _taggedTemplateLiteral3.default)(['\n  animation: ', ' 1s linear infinite;\n'], ['\n  animation: ', ' 1s linear infinite;\n']),
    _templateObject8 = (0, _taggedTemplateLiteral3.default)(['\n  \tfrom {\n  \t\ttransform: rotate(360deg);\n  \t}\n\n  \tto {\n  \t\ttransform: rotate(0deg);\n  \t}\n  '], ['\n  \tfrom {\n  \t\ttransform: rotate(360deg);\n  \t}\n\n  \tto {\n  \t\ttransform: rotate(0deg);\n  \t}\n  ']);

exports.color = color;

var _styledComponents = require('styled-components');

var _styledComponents2 = _interopRequireDefault(_styledComponents);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function color(name) {
  var opacity = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'normal';
  var alpha = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;

  var opacity500 = {
    'thick': 850,
    'normal': 500,
    'intense': 400,
    'light': 250,
    'bright': 135,
    'pale': 67,
    'translucent': 20
  }[opacity] || opacity;
  var rgb = {
    'primary': [0, 150, 136],
    'primary_dark': [33, 93, 85],
    'action': [241, 121, 73],
    'important': [255, 82, 82],
    'attention': [255, 196, 0],
    'black': [0, 0, 0],
    'white': [255, 255, 255],
    'info': [3, 169, 244]
  }[name] || [0, 0, 0];
  var opacified_tint = function opacified_tint(tint) {
    var result = 255 - (255 - tint) * opacity500 / 500;
    if (result < 0) {
      result = 0;
    }
    return Math.floor(result);
  };
  return 'rgba(' + rgb.map(function (tint) {
    return opacified_tint(tint);
  }).join(', ') + ', ' + alpha + ')';
}

var link = exports.link = (0, _styledComponents.css)(_templateObject);

var disabled_link = exports.disabled_link = (0, _styledComponents.css)(_templateObject2);

var circle = exports.circle = function circle(radius) {
  return (0, _styledComponents.css)(_templateObject3, radius, radius, radius);
};

var card = exports.card = (0, _styledComponents.css)(_templateObject4, color('black', 'normal', 0.25));

var input = exports.input = (0, _styledComponents.css)(_templateObject5);
var ellipsis = exports.ellipsis = function ellipsis(max_width) {
  return (0, _styledComponents.css)(_templateObject6, max_width);
};
var ease = exports.ease = 'cubic-bezier(0.4, 0, 0.2, 1)';
var desceleration = exports.desceleration = 'cubic-bezier(0, 0, 0.2, 1)';
var acceleration = exports.acceleration = 'cubic-bezier(0.4, 0, 1, 1)';

var rotate = exports.rotate = (0, _styledComponents.css)(_templateObject7, (0, _styledComponents.keyframes)(_templateObject8));