merchi_product_editor
Version:
A React component for editing product images using Fabric.js
31 lines (30 loc) • 1.94 kB
JavaScript
"use strict";
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.customStyles = void 0;
var isMobile = function () {
if (typeof window !== 'undefined') {
return window.innerWidth < 480;
}
return false;
};
exports.customStyles = {
option: function (provided, state) { return (__assign(__assign({}, provided), { fontFamily: state.data.value, padding: '10px 15px', fontSize: '16px', backgroundColor: state.isFocused ? '#eee' : state.isSelected ? '#ddd' : 'white', color: '#333', cursor: 'pointer', transition: 'background-color 0.1s ease' })); },
control: function (provided) { return (__assign(__assign({}, provided), { minWidth: isMobile() ? 160 : 180, minHeight: 38, border: '1px solid #ccc', borderRadius: '4px', boxShadow: 'none', backgroundColor: 'white', '&:hover': {
borderColor: '#aaa'
} })); },
singleValue: function (provided, state) { return (__assign(__assign({}, provided), { fontFamily: state.data.value, color: '#333', fontSize: isMobile() ? '13px' : '14px' })); },
input: function (provided) { return (__assign(__assign({}, provided), { margin: '0 2px', paddingTop: '1px', paddingBottom: '1px', fontFamily: 'sans-serif', color: '#333' })); },
placeholder: function (provided) { return (__assign(__assign({}, provided), { color: '#888', fontFamily: 'sans-serif' })); },
menu: function (provided) { return (__assign(__assign({}, provided), { marginTop: '4px', border: '1px solid #ccc', boxShadow: '0 4px 10px rgba(0,0,0,0.1)', borderRadius: '4px' })); },
};