id-components
Version:
id components
46 lines (45 loc) • 4.39 kB
JavaScript
"use strict";
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
return cooked;
};
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
result["default"] = mod;
return result;
};
Object.defineProperty(exports, "__esModule", { value: true });
var styled_components_1 = __importStar(require("styled-components"));
var animations_1 = require("../../animations");
exports.Wrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n justify-content: center;\n"], ["\n display: flex;\n justify-content: center;\n"])));
exports.BaseBar = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n position: fixed;\n padding: 0 18px;\n height: 50px;\n background-color: #ffffff;\n display: flex;\n box-shadow: 0 2px 60px 0px RGBA(86, 96, 128, 0.4);\n ", ";\n"], ["\n position: fixed;\n padding: 0 18px;\n height: 50px;\n background-color: #ffffff;\n display: flex;\n box-shadow: 0 2px 60px 0px RGBA(86, 96, 128, 0.4);\n ",
";\n"])), function (props) {
if (props.isMobile) {
return styled_components_1.css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n width: 100vw;\n bottom: 0;\n "], ["\n width: 100vw;\n bottom: 0;\n "])));
}
else {
return styled_components_1.css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n border-radius: 50px;\n width: 400px;\n bottom: 0;\n right: 0;\n margin-right: 12px;\n margin-bottom: 12px;\n "], ["\n border-radius: 50px;\n width: 400px;\n bottom: 0;\n right: 0;\n margin-right: 12px;\n margin-bottom: 12px;\n "])));
}
});
exports.OptionWrapper = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n vertical-align: middle;\n display: flex;\n flex-flow: column;\n align-content: center;\n -webkit-flex: 1;\n -ms-flex: 1;\n flex: 1;\n justify-content: center;\n align-items: center;\n :hover {\n cursor: pointer;\n }\n"], ["\n vertical-align: middle;\n display: flex;\n flex-flow: column;\n align-content: center;\n -webkit-flex: 1;\n -ms-flex: 1;\n flex: 1;\n justify-content: center;\n align-items: center;\n :hover {\n cursor: pointer;\n }\n"])));
exports.IconPart = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n transition: 0.3s;\n ", ";\n"], ["\n transition: 0.3s;\n ",
";\n"])), function (props) {
if (props.isSelected) {
return styled_components_1.css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n transform: scale(1.02);\n "], ["\n transform: scale(1.02);\n "])));
}
else {
return styled_components_1.css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n transform: scale(1);\n "], ["\n transform: scale(1);\n "])));
}
});
exports.NamePart = styled_components_1.default.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n transition: 0.3s;\n font-size: 0.65em;\n color: #6c63ff;\n ", ";\n"], ["\n transition: 0.3s;\n font-size: 0.65em;\n color: #6c63ff;\n ",
";\n"])), function (props) {
if (props.isSelected) {
return styled_components_1.css(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n animation: ", " ease-in;\n display: block;\n "], ["\n animation: ", " ease-in;\n display: block;\n "])), animations_1.opacityEffect);
}
else {
return styled_components_1.css(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n display: none;\n "], ["\n display: none;\n "])));
}
});
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11;