@openedx/paragon 22.15.1 → 22.15.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/Form/_index.scss
CHANGED
|
@@ -380,6 +380,7 @@ select.form-control {
|
|
|
380
380
|
appearance: none;
|
|
381
381
|
height: $custom-control-indicator-size;
|
|
382
382
|
width: $custom-control-indicator-size;
|
|
383
|
+
min-width: $custom-control-indicator-size;
|
|
383
384
|
background-color: $custom-control-indicator-bg;
|
|
384
385
|
border: solid $custom-control-indicator-border-width $custom-control-indicator-border-color;
|
|
385
386
|
border-radius: $custom-checkbox-indicator-border-radius;
|
|
@@ -437,6 +438,7 @@ select.form-control {
|
|
|
437
438
|
|
|
438
439
|
.pgn__form-switch-input {
|
|
439
440
|
width: $custom-switch-width;
|
|
441
|
+
min-width: $custom-switch-width;
|
|
440
442
|
border-radius: $custom-switch-indicator-border-radius;
|
|
441
443
|
background-image: escape-svg($custom-switch-indicator-icon-off);
|
|
442
444
|
background-position: left center;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AlertModal.js","names":["React","PropTypes","classNames","requiredWhenNot","Icon","ModalDialog","AlertModal","_ref","children","footerNode","icon","props","createElement","className","Header","Title","src","title","Body","Footer","propTypes","node","isRequired","string","isOpen","bool","isBlocking","hasCloseButton","onClose","func","size","oneOf","variant","closeLabel","isFullscreenScroll","elementType","defaultProps","undefined"],"sources":["../../src/Modal/AlertModal.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\n\nimport { requiredWhenNot } from '../utils/propTypes';\nimport Icon from '../Icon';\nimport ModalDialog from './ModalDialog';\n\nfunction AlertModal({\n children,\n footerNode,\n icon,\n ...props\n}) {\n return (\n <ModalDialog\n {...props}\n className={classNames('pgn__alert-modal', props.className)}\n >\n <ModalDialog.Header>\n <ModalDialog.Title>\n {icon && (\n
|
|
1
|
+
{"version":3,"file":"AlertModal.js","names":["React","PropTypes","classNames","requiredWhenNot","Icon","ModalDialog","AlertModal","_ref","children","footerNode","icon","props","createElement","className","Header","Title","src","title","Body","Footer","propTypes","node","isRequired","string","isOpen","bool","isBlocking","hasCloseButton","onClose","func","size","oneOf","variant","closeLabel","isFullscreenScroll","elementType","defaultProps","undefined"],"sources":["../../src/Modal/AlertModal.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\n\nimport { requiredWhenNot } from '../utils/propTypes';\nimport Icon from '../Icon';\nimport ModalDialog from './ModalDialog';\n\nfunction AlertModal({\n children,\n footerNode,\n icon,\n ...props\n}) {\n return (\n <ModalDialog\n {...props}\n className={classNames('pgn__alert-modal', props.className)}\n >\n <ModalDialog.Header>\n <ModalDialog.Title>\n {icon && (\n <Icon\n data-testid=\"title-icon\"\n src={icon}\n className={classNames('pgn__alert-modal__title_icon')}\n />\n )}\n {props.title}\n </ModalDialog.Title>\n </ModalDialog.Header>\n <ModalDialog.Body>{children}</ModalDialog.Body>\n {footerNode && <ModalDialog.Footer>{footerNode}</ModalDialog.Footer>}\n </ModalDialog>\n );\n}\n\nAlertModal.propTypes = {\n children: PropTypes.node.isRequired,\n /** The aria-label of the dialog */\n title: PropTypes.string.isRequired,\n /** Is the modal dialog open or closed */\n isOpen: PropTypes.bool,\n /** Prevent clicking on the backdrop or pressing Esc to close the modal */\n isBlocking: PropTypes.bool,\n /** Specifies whether the dialog box should contain 'x' icon button in the top right */\n hasCloseButton: PropTypes.bool,\n /** A callback to close the modal dialog */\n onClose: requiredWhenNot(PropTypes.func, 'isBlocking'),\n /** Sizes determine the maximum width of the dialog box */\n size: PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'fullscreen']),\n /** The visual style of the dialog box */\n variant: PropTypes.oneOf(['default', 'warning', 'danger', 'success']),\n /** The label supplied to the close icon button if one is rendered */\n closeLabel: PropTypes.string,\n /** Specifies class name to append to the base element */\n className: PropTypes.string,\n /**\n * Determines where a scrollbar should appear if a modal is too large for the\n * viewport. When false, the ModalDialog.Body receives a scrollbar, when true\n * the browser window itself receives the scrollbar.\n */\n isFullscreenScroll: PropTypes.bool,\n /** Specifies what should be displayed in the footer of the dialog box */\n footerNode: PropTypes.node,\n /** Icon that will be shown in the header of modal */\n icon: PropTypes.elementType,\n};\n\nAlertModal.defaultProps = {\n isOpen: false,\n isBlocking: false,\n hasCloseButton: false,\n onClose: () => {},\n size: 'md',\n variant: 'default',\n closeLabel: 'Close',\n className: undefined,\n isFullscreenScroll: false,\n footerNode: null,\n icon: undefined,\n};\n\nexport default AlertModal;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,UAAU,MAAM,YAAY;AAEnC,SAASC,eAAe,QAAQ,oBAAoB;AACpD,OAAOC,IAAI,MAAM,SAAS;AAC1B,OAAOC,WAAW,MAAM,eAAe;AAEvC,SAASC,UAAUA,CAAAC,IAAA,EAKhB;EAAA,IALiB;IAClBC,QAAQ;IACRC,UAAU;IACVC,IAAI;IACJ,GAAGC;EACL,CAAC,GAAAJ,IAAA;EACC,oBACEP,KAAA,CAAAY,aAAA,CAACP,WAAW;IAAA,GACNM,KAAK;IACTE,SAAS,EAAEX,UAAU,CAAC,kBAAkB,EAAES,KAAK,CAACE,SAAS;EAAE,gBAE3Db,KAAA,CAAAY,aAAA,CAACP,WAAW,CAACS,MAAM,qBACjBd,KAAA,CAAAY,aAAA,CAACP,WAAW,CAACU,KAAK,QACfL,IAAI,iBACHV,KAAA,CAAAY,aAAA,CAACR,IAAI;IACH,eAAY,YAAY;IACxBY,GAAG,EAAEN,IAAK;IACVG,SAAS,EAAEX,UAAU,CAAC,8BAA8B;EAAE,CACvD,CACF,EACAS,KAAK,CAACM,KACU,CACD,CAAC,eACrBjB,KAAA,CAAAY,aAAA,CAACP,WAAW,CAACa,IAAI,QAAEV,QAA2B,CAAC,EAC9CC,UAAU,iBAAIT,KAAA,CAAAY,aAAA,CAACP,WAAW,CAACc,MAAM,QAAEV,UAA+B,CACxD,CAAC;AAElB;AAEAH,UAAU,CAACc,SAAS,GAAG;EACrBZ,QAAQ,EAAEP,SAAS,CAACoB,IAAI,CAACC,UAAU;EACnC;EACAL,KAAK,EAAEhB,SAAS,CAACsB,MAAM,CAACD,UAAU;EAClC;EACAE,MAAM,EAAEvB,SAAS,CAACwB,IAAI;EACtB;EACAC,UAAU,EAAEzB,SAAS,CAACwB,IAAI;EAC1B;EACAE,cAAc,EAAE1B,SAAS,CAACwB,IAAI;EAC9B;EACAG,OAAO,EAAEzB,eAAe,CAACF,SAAS,CAAC4B,IAAI,EAAE,YAAY,CAAC;EACtD;EACAC,IAAI,EAAE7B,SAAS,CAAC8B,KAAK,CAAC,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,YAAY,CAAC,CAAC;EAC7D;EACAC,OAAO,EAAE/B,SAAS,CAAC8B,KAAK,CAAC,CAAC,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC;EACrE;EACAE,UAAU,EAAEhC,SAAS,CAACsB,MAAM;EAC5B;EACAV,SAAS,EAAEZ,SAAS,CAACsB,MAAM;EAC3B;AACF;AACA;AACA;AACA;EACEW,kBAAkB,EAAEjC,SAAS,CAACwB,IAAI;EAClC;EACAhB,UAAU,EAAER,SAAS,CAACoB,IAAI;EAC1B;EACAX,IAAI,EAAET,SAAS,CAACkC;AAClB,CAAC;AAED7B,UAAU,CAAC8B,YAAY,GAAG;EACxBZ,MAAM,EAAE,KAAK;EACbE,UAAU,EAAE,KAAK;EACjBC,cAAc,EAAE,KAAK;EACrBC,OAAO,EAAEA,CAAA,KAAM,CAAC,CAAC;EACjBE,IAAI,EAAE,IAAI;EACVE,OAAO,EAAE,SAAS;EAClBC,UAAU,EAAE,OAAO;EACnBpB,SAAS,EAAEwB,SAAS;EACpBH,kBAAkB,EAAE,KAAK;EACzBzB,UAAU,EAAE,IAAI;EAChBC,IAAI,EAAE2B;AACR,CAAC;AAED,eAAe/B,UAAU","ignoreList":[]}
|
|
@@ -125,6 +125,7 @@
|
|
|
125
125
|
|
|
126
126
|
.pgn__modal-title {
|
|
127
127
|
font-size: $h3-font-size;
|
|
128
|
+
line-height: $h3-font-size * $headings-line-height;
|
|
128
129
|
margin-inline-end: 3rem; // roughly accomodate the width of the close buttonn
|
|
129
130
|
text-align: start;
|
|
130
131
|
}
|
|
@@ -310,7 +311,6 @@
|
|
|
310
311
|
}
|
|
311
312
|
|
|
312
313
|
.pgn__modal-title {
|
|
313
|
-
font-size: $h4-font-size;
|
|
314
314
|
display: flex;
|
|
315
315
|
flex-grow: 1;
|
|
316
316
|
align-items: center;
|