notebook-ts
Version:
Prevent Sybil attacks with the click of a button.
22 lines (21 loc) • 1.69 kB
JavaScript
;
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 });
var jsx_runtime_1 = require("react/jsx-runtime");
var googleLogo = require("./googleLogo.svg");
function SignInButton(_a) {
var onClick = _a.onClick;
var css = "\n .sign-in-button {\n background: #FFFFFF;\n border-radius: 16px;\n padding: 12px;\n border: none;\n box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.08), 0px 4px 6px rgba(0, 0, 0, 0.12);;\n font-style: normal;\n font-weight: 500;\n font-size: 18px;\n color: #222;\n display: flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n }\n\n .sign-in-button:hover{\n background: #fafafa;\n box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.08), 0px 4px 6px rgba(0, 0, 0, 0.12);\n }\n\n .sign-in-button:active {\n background: #fff;\n }\n\n .google-logo {\n height: 24px;\n }\n ";
return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("style", { children: css }), (0, jsx_runtime_1.jsxs)("button", __assign({ className: "sign-in-button", onClick: onClick ? onClick : null }, { children: [(0, jsx_runtime_1.jsx)("img", { src: googleLogo, className: "google-logo", alt: "google-logo" }), "Sign In with Google"] }))] }));
}
exports.default = SignInButton;