react-ts-popup - npm Package Compare versions

Comparing version 0.0.27 to 0.0.28

dist/cjs/components/popup/index.js

@@ -11,3 +11,3 @@ "use strict";
         return null;
-    return (react_1["default"].createElement(index_styled_1.Area, { color: 'white' },
+    return (react_1["default"].createElement(index_styled_1.Area, { color: 'black' },
         react_1["default"].createElement(index_styled_1.Background, { onClick: function () { return props.close(); } }),
@@ -14,0 +14,0 @@ react_1["default"].createElement("div", { className: 'content' },

dist/cjs/components/popup/index.styled.js

@@ -7,3 +7,3 @@ "use strict";
 var prop_types_1 = tslib_1.__importDefault(require("prop-types"));
-exports.Area = styled_components_1["default"].div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n  background-color: ", ";\n  backdrop-filter: blur(6px);\n  z-index: 1;\n\n  .content {\n    position: relative;\n    width: 600px;\n    padding: 2rem;\n    border-radius: 1rem;\n    background-color: #000000c4;\n    border: 2px solid var(--white-color);\n    box-shadow: 0 0.3rem 0 0 var(--plain-shadow);\n    font-size: 1.4rem;\n    font-weight: 500;\n    color: var(--plain-dark);\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n\n    @media (max-width: 768px) {\n      width: 90vw;\n    }\n  }\n\n  .title {\n    font-family: 'Secular One', sans-serif;\n    font-size: 3rem;\n    font-weight: 400;\n    margin-bottom: 1rem;\n    color: white;\n  }\n"], ["\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n  background-color: ", ";\n  backdrop-filter: blur(6px);\n  z-index: 1;\n\n  .content {\n    position: relative;\n    width: 600px;\n    padding: 2rem;\n    border-radius: 1rem;\n    background-color: #000000c4;\n    border: 2px solid var(--white-color);\n    box-shadow: 0 0.3rem 0 0 var(--plain-shadow);\n    font-size: 1.4rem;\n    font-weight: 500;\n    color: var(--plain-dark);\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n\n    @media (max-width: 768px) {\n      width: 90vw;\n    }\n  }\n\n  .title {\n    font-family: 'Secular One', sans-serif;\n    font-size: 3rem;\n    font-weight: 400;\n    margin-bottom: 1rem;\n    color: white;\n  }\n"])), function (props) { return props.color; });
+exports.Area = styled_components_1["default"].div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n  background-color: ", ";\n  backdrop-filter: blur(6px);\n  z-index: 1;\n\n  .content {\n    position: relative;\n    width: 600px;\n    padding: 2rem;\n    border-radius: 1rem;\n    background-color: #000000c4;\n    border: 2px solid var(--white-color);\n    box-shadow: 0 0.3rem 0 0 var(--plain-shadow);\n    font-size: 1.4rem;\n    font-weight: 500;\n    color: var(--plain-dark);\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n\n    @media (max-width: 768px) {\n      width: 90vw;\n    }\n  }\n\n  .title {\n    font-family: 'Secular One', sans-serif;\n    font-size: 3rem;\n    font-weight: 400;\n    margin-bottom: 1rem;\n    color: white;\n  }\n"], ["\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n  background-color: ", ";\n  backdrop-filter: blur(6px);\n  z-index: 1;\n\n  .content {\n    position: relative;\n    width: 600px;\n    padding: 2rem;\n    border-radius: 1rem;\n    background-color: #000000c4;\n    border: 2px solid var(--white-color);\n    box-shadow: 0 0.3rem 0 0 var(--plain-shadow);\n    font-size: 1.4rem;\n    font-weight: 500;\n    color: var(--plain-dark);\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n\n    @media (max-width: 768px) {\n      width: 90vw;\n    }\n  }\n\n  .title {\n    font-family: 'Secular One', sans-serif;\n    font-size: 3rem;\n    font-weight: 400;\n    margin-bottom: 1rem;\n    color: white;\n  }\n"])), function (props) { return (props.color ? 'black' : 'white'); });
 exports.Background = styled_components_1["default"].div(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n"], ["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n"])));
@@ -10,0 +10,0 @@ exports.Area.propTypes = {

dist/esm/components/popup/index.js

@@ -8,3 +8,3 @@ import React from 'react';
         return null;
-    return (React.createElement(Area, { color: 'white' },
+    return (React.createElement(Area, { color: 'black' },
         React.createElement(Background, { onClick: function () { return props.close(); } }),
@@ -11,0 +11,0 @@ React.createElement("div", { className: 'content' },

dist/esm/components/popup/index.styled.js

 import { __makeTemplateObject } from "tslib";
 import styled from 'styled-components';
 import PropTypes from 'prop-types';
-export var Area = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n  background-color: ", ";\n  backdrop-filter: blur(6px);\n  z-index: 1;\n\n  .content {\n    position: relative;\n    width: 600px;\n    padding: 2rem;\n    border-radius: 1rem;\n    background-color: #000000c4;\n    border: 2px solid var(--white-color);\n    box-shadow: 0 0.3rem 0 0 var(--plain-shadow);\n    font-size: 1.4rem;\n    font-weight: 500;\n    color: var(--plain-dark);\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n\n    @media (max-width: 768px) {\n      width: 90vw;\n    }\n  }\n\n  .title {\n    font-family: 'Secular One', sans-serif;\n    font-size: 3rem;\n    font-weight: 400;\n    margin-bottom: 1rem;\n    color: white;\n  }\n"], ["\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n  background-color: ", ";\n  backdrop-filter: blur(6px);\n  z-index: 1;\n\n  .content {\n    position: relative;\n    width: 600px;\n    padding: 2rem;\n    border-radius: 1rem;\n    background-color: #000000c4;\n    border: 2px solid var(--white-color);\n    box-shadow: 0 0.3rem 0 0 var(--plain-shadow);\n    font-size: 1.4rem;\n    font-weight: 500;\n    color: var(--plain-dark);\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n\n    @media (max-width: 768px) {\n      width: 90vw;\n    }\n  }\n\n  .title {\n    font-family: 'Secular One', sans-serif;\n    font-size: 3rem;\n    font-weight: 400;\n    margin-bottom: 1rem;\n    color: white;\n  }\n"])), function (props) { return props.color; });
+export var Area = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n  background-color: ", ";\n  backdrop-filter: blur(6px);\n  z-index: 1;\n\n  .content {\n    position: relative;\n    width: 600px;\n    padding: 2rem;\n    border-radius: 1rem;\n    background-color: #000000c4;\n    border: 2px solid var(--white-color);\n    box-shadow: 0 0.3rem 0 0 var(--plain-shadow);\n    font-size: 1.4rem;\n    font-weight: 500;\n    color: var(--plain-dark);\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n\n    @media (max-width: 768px) {\n      width: 90vw;\n    }\n  }\n\n  .title {\n    font-family: 'Secular One', sans-serif;\n    font-size: 3rem;\n    font-weight: 400;\n    margin-bottom: 1rem;\n    color: white;\n  }\n"], ["\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n  background-color: ", ";\n  backdrop-filter: blur(6px);\n  z-index: 1;\n\n  .content {\n    position: relative;\n    width: 600px;\n    padding: 2rem;\n    border-radius: 1rem;\n    background-color: #000000c4;\n    border: 2px solid var(--white-color);\n    box-shadow: 0 0.3rem 0 0 var(--plain-shadow);\n    font-size: 1.4rem;\n    font-weight: 500;\n    color: var(--plain-dark);\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n\n    @media (max-width: 768px) {\n      width: 90vw;\n    }\n  }\n\n  .title {\n    font-family: 'Secular One', sans-serif;\n    font-size: 3rem;\n    font-weight: 400;\n    margin-bottom: 1rem;\n    color: white;\n  }\n"])), function (props) { return (props.color ? 'black' : 'white'); });
 export var Background = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n"], ["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n"])));
@@ -6,0 +6,0 @@ Area.propTypes = {

package.json

 {
   "name": "react-ts-popup",
-  "version": "0.0.27",
+  "version": "0.0.28",
   "description": "React popup component that helps you create simple and complex Modals, tooltips, and Menus for your next React App.",
@@ -5,0 +5,0 @@ "homepage": "",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

19749

increased by0.76%

No dependency changes