@pinuts/bsr-uikit-relaunch 0.2.47 → 0.2.50

package/dist/items/eventWizardItems/EventDatePicker/CalendarToolbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CalendarToolbar.d.ts","sourceRoot":"","sources":["../../../../src/items/eventWizardItems/EventDatePicker/CalendarToolbar.jsx"],"names":[],"mappings":";AAKA;;;sBA0BC;;;;;;;kBA9BkC,OAAO;sBADpB,YAAY"}
+{"version":3,"file":"CalendarToolbar.d.ts","sourceRoot":"","sources":["../../../../src/items/eventWizardItems/EventDatePicker/CalendarToolbar.jsx"],"names":[],"mappings":";AAMA;;;sBAwCC;;;;;;;kBA7CkC,OAAO;sBADpB,YAAY"}

package/dist/items/eventWizardItems/EventDatePicker/CalendarToolbar.js

@@ -8,6 +8,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _react = _interopRequireWildcard(require("react"));
 var _reactBigCalendar = require("react-big-calendar");
 var _reactBootstrap = require("react-bootstrap");
+var _Icon = _interopRequireDefault(require("../../Icon/Icon.jsx"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -22,16 +23,26 @@ const CalendarToolbar = _ref => {
     className: "rbc-toolbar"
   }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
     variant: "secondary",
-    onClick: navigatePrevious
-  }, /*#__PURE__*/_react.default.createElement("i", {
-    className: "pi-icon pi-arrow-left-primary mr-2"
-  }), /*#__PURE__*/_react.default.createElement("b", null, "zur\xFCck")), /*#__PURE__*/_react.default.createElement("h4", {
+    onClick: navigatePrevious,
+    className: "d-flex align-items-center"
+  }, /*#__PURE__*/_react.default.createElement(_Icon.default, {
+    icon: "ChevronLeft",
+    className: "mr-2",
+    width: 16,
+    height: 16,
+    stroke: "currentColor"
+  }), /*#__PURE__*/_react.default.createElement("span", null, "zur\xFCck")), /*#__PURE__*/_react.default.createElement("h4", {
     className: "rbc-toolbar-label"
   }, label), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
     variant: "secondary",
-    onClick: navigateNext
-  }, /*#__PURE__*/_react.default.createElement("b", null, "weiter"), /*#__PURE__*/_react.default.createElement("i", {
-    className: "pi-icon pi-arrow-right-primary ml-2"
+    onClick: navigateNext,
+    className: "ml-auto d-flex align-items-center"
+  }, /*#__PURE__*/_react.default.createElement("span", null, "weiter"), /*#__PURE__*/_react.default.createElement(_Icon.default, {
+    icon: "ChevronRight",
+    className: "ml-2",
+    width: 16,
+    height: 16,
+    stroke: "currentColor"
   })));
 };
 CalendarToolbar.propTypes = {

package/dist/items/eventWizardItems/EventPicker/Components/CheckboxField.js

@@ -61,7 +61,7 @@ const CheckboxField = props => {
   const hasDescription = !!infobadge || !!subtitle;
   const descriptionId = hasDescription ? `desc-${inputProps.id}` : null;
   return /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement("div", {
-    className: "pi-checkbox custom-control custom-checkbox border mb-1 w-100"
+    className: "pi-checkbox custom-control custom-checkbox border mb-1 w-100 d-flex align-items-center justify-content-between"
   }, /*#__PURE__*/_react.default.createElement("input", _extends({
     className: "custom-control-input"
   }, field, inputProps, {
@@ -73,12 +73,12 @@ const CheckboxField = props => {
     className: "custom-control-label d-sm-flex align-items-center p-3 pl-4",
     htmlFor: inputProps.id
   }, /*#__PURE__*/_react.default.createElement(_HTMLParserSanitized.HTMLParserSanitized, null, header)), hasDescription && /*#__PURE__*/_react.default.createElement("div", {
-    className: "h5",
+    className: "h5 mr-4",
     id: descriptionId
   }, subtitle && /*#__PURE__*/_react.default.createElement("div", {
     className: "small mt-1"
   }, subtitle), infobadge && /*#__PURE__*/_react.default.createElement("div", {
-    className: "badge badge-secondary rounded-pill ml-auto mt-2 mt-sm-0"
+    className: "badge badge-info rounded-pill ml-auto mt-2 mt-sm-0m"
   }, infobadge), required && /*#__PURE__*/_react.default.createElement("span", {
     className: "pi-required text-primary mr-1"
   }, "*"))));

package/dist/items/eventWizardItems/EventPicker/Components/RadioField.js

@@ -41,7 +41,7 @@ const RadioField = _ref => {
   const hasDescription = !!infobadge || !!usedSubtitle;
   const descriptionId = hasDescription ? `desc-${inputProps.id}` : null;
   return /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement("div", {
-    className: "pi-radio custom-control custom-radio border mb-1 w-100"
+    className: "pi-radio custom-control custom-radio border mb-1 w-100 d-flex align-items-center justify-content-between"
   }, /*#__PURE__*/_react.default.createElement("input", _extends({
     className: "custom-control-input"
   }, field, inputProps, {
@@ -52,12 +52,12 @@ const RadioField = _ref => {
     className: "custom-control-label d-sm-flex align-items-center p-3 pl-4",
     htmlFor: inputProps.id
   }, /*#__PURE__*/_react.default.createElement(_HTMLParserSanitized.HTMLParserSanitized, null, header)), hasDescription && /*#__PURE__*/_react.default.createElement("div", {
-    className: "h5",
+    className: "h5 mr-4",
     id: descriptionId
   }, infoLine1, usedSubtitle && /*#__PURE__*/_react.default.createElement("div", {
     className: "small mt-1"
   }, usedSubtitle), infobadge && /*#__PURE__*/_react.default.createElement("div", {
-    className: "badge badge-secondary rounded-pill ml-auto mt-2 mt-sm-0"
+    className: "badge badge-info rounded-pill ml-auto mt-2 mt-sm-0"
   }, infobadge), required && /*#__PURE__*/_react.default.createElement("span", {
     className: "pi-required text-primary mr-1"
   }, "*"))));

package/dist/items/eventWizardItems/EventPicker/EventPicker.js

@@ -100,7 +100,7 @@ const EventPicker = _ref => {
     "aria-labelledby": `selectGroup-${groupName}`
   }, /*#__PURE__*/_react.default.createElement("ul", {
     className: "checkboxes picker-list"
-  }, renderedEvents)) : /*#__PURE__*/_react.default.createElement("h2", null, "Keine Veranstaltungen an diesem Termin w\xE4hlbar"));
+  }, renderedEvents)) : /*#__PURE__*/_react.default.createElement("h4", null, "Keine Veranstaltungen an diesem Termin w\xE4hlbar"));
 };
 EventPicker.propTypes = {
   config: PropTypes.object

package/dist/items/eventWizardItems/FormTitle/FormTitle.js

@@ -39,13 +39,13 @@ const FormTitle = _ref => {
     if (current <= 0) return;
     if (!total) {
       return /*#__PURE__*/_react.default.createElement("div", {
-        className: "step-line bg-primary rounded-pill flex-fill"
+        className: "step-line bg-brick rounded-pill flex-fill"
       });
     }
     const stepper = [];
     for (let i = 0; i < total; i++) {
       let cssClasses = 'step-line rounded-pill flex-fill ';
-      cssClasses += i < current ? 'bg-primary' : 'bg-secondary';
+      cssClasses += i < current ? 'bg-brick' : 'bg-secondary';
       cssClasses += i + 1 !== total ? ' mr-2' : '';
       stepper.push(/*#__PURE__*/_react.default.createElement("div", {
         key: `${i}_${current}`,
@@ -64,7 +64,7 @@ const FormTitle = _ref => {
   }, /*#__PURE__*/_react.default.createElement("small", {
     className: "mr-1 mr-sm-0"
   }, "Schritt"), steps.current > 0 && /*#__PURE__*/_react.default.createElement("span", {
-    className: "h4 d-inline d-sm-block"
+    className: "h4 d-inline d-sm-block mt-0"
   }, `${steps.current} ${steps.total ? `von ${steps.total}` : ''}`))), steps && /*#__PURE__*/_react.default.createElement("div", {
     className: "pi-step-indicator d-flex mb-4"
   }, stepCreator(steps)), errorMsg && /*#__PURE__*/_react.default.createElement(_Alert.default, {

package/dist/items/eventWizardItems/Intro/Intro.js

@@ -16,10 +16,12 @@ const Intro = props => {
   } = props.config;
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "pi-intro my-5"
-  }, /*#__PURE__*/_react.default.createElement("h4", null, /*#__PURE__*/_react.default.createElement("span", {
+  }, /*#__PURE__*/_react.default.createElement("h4", {
+    className: "d-flex align-items-center justify-content-between"
+  }, /*#__PURE__*/_react.default.createElement("span", {
     className: "mr-2 mr-sm-0"
   }, headline), infobadge && /*#__PURE__*/_react.default.createElement("span", {
-    className: "badge badge-secondary rounded-pill ml-sm-3 mt-2 mt-sm-0"
+    className: "badge badge-info rounded-pill ml-sm-3 mt-2 mt-sm-0"
   }, infobadge)), /*#__PURE__*/_react.default.createElement("p", null, description));
 };
 Intro.propTypes = {

package/dist/shared/LocationPicker/LocationPicker.js

@@ -9,8 +9,8 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
 //FIXME sr-only oder aria-hidden="true"  setzen
 const LocationPicker = () => {
   return /*#__PURE__*/_react.default.createElement("a", {
-    className: "ml-auto",
-    href: "https://www.bsr.de/recyclinghoefe-20503.php",
+    className: "ml-auto location-picker-text",
+    href: "/recyclinghoefe-berlin",
     rel: "noopener noreferrer",
     target: "_blank"
   }, /*#__PURE__*/_react.default.createElement("span", {

package/dist/styles/_form.scss

@@ -559,7 +559,15 @@ form input[type="checkbox"] + label:before {
   }
 }
 
-.event-picker {
+.selectGroup-events, .event-picker {
+
+  .location-picker-text {
+    font-family: $fontfamily-base;
+    font-size: $inputField-font-size;
+    line-height: $inputField-line-height;
+    color: $bsr-black-90;
+    font-weight: $fontweight-normal;
+  }
   legend {
     display: flex;
     align-items: center;
@@ -573,7 +581,7 @@ form input[type="checkbox"] + label:before {
     gap: 0;
     padding-left: 0;
 
-    li:before {
+    li:before, li::marker {
       display: none;
     }
   }

package/dist/styles/main.scss

@@ -18,3 +18,73 @@
     background: $bsr-black-10;
   }
 }
+
+body {
+    font-family: $fontfamily-base;
+    font-size: $defaultBrowserFontSize;
+}
+
+p, span {
+    font-family: $fontfamily-base;
+}
+
+h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
+    font-family: $fontfamily-heading;
+    font-weight: $fontweight-bold;
+    scroll-margin-top: $base-gap * 18;
+}
+
+h1, .h1 {
+    font-size: $h1-fontsize;
+    line-height: $h1-lineheight;
+    letter-spacing: $letter-spacing-lg;
+    margin-bottom: $base-gap * 10;
+
+    @media screen and (max-width: $screen-sm-max) {
+        font-size: $h1-fontsize-sm;
+        line-height: $h1-lineheight-sm;
+        letter-spacing: $letter-spacing-sm;
+        margin-bottom: $base-gap * 3;
+    }
+}
+
+h2, .h2 {
+    font-size: $h2-fontsize;
+    line-height: $h2-lineheight;
+    letter-spacing: $letter-spacing-md;
+    margin-bottom: $base-gap * 5;
+
+    @media screen and (max-width: $screen-sm-max) {
+        font-size: $h2-fontsize-sm;
+        line-height: $h2-lineheight-sm;
+        margin-bottom: $base-gap * 3;
+    }
+}
+
+h3, .h3, h4, .h4,  h5, .h5, h6, .h6 {
+    margin-bottom: $base-gap * 5;
+    margin-top: $base-gap * 10;
+
+    @media screen and (max-width: $screen-sm-max) {
+        font-size: $h3-fontsize-sm;
+        line-height: $h3-lineheight-sm;
+        margin-bottom: $base-gap * 3;
+        margin-top: $base-gap * 8;
+    }
+}
+
+q {
+    font-family: $fontfamily-heading;
+}
+
+footer {
+    font-family: $fontfamily-heading;
+}
+
+.rbc-wrapper {
+    min-height: 590px;
+}
+
+.rbc-wrapper .rbc-calendar {
+    font-family: $fontfamily-base;
+}

package/dist/styles/variables/_buttons.scss

@@ -157,3 +157,50 @@ $btn-padding-y: calc($base-gap * 2 - 1px);
     cursor: not-allowed;
   }
 }
+
+button[type="button"].btn.btn-primary, button[type="button"].btn.btn-secondary {
+    padding: $base-gap * 1.5 $base-gap * 6;
+    border-radius: $btn-border-radius;
+    background: none;
+    font-size: $fontsize-base;
+    line-height: $lineheight-base;
+    background-image: none !important;
+
+    &:hover,
+    &:focus-visible {
+        text-decoration-color: currentColor;
+    }
+    
+    &:focus,
+    &:focus-visible {
+        outline: none;
+    }
+}
+
+button[type="button"].btn.btn-primary {
+    background-color: $bsr-brick-100;
+    color: $bsr-white-100;
+    border: $bsr-border-width-m solid $bsr-brick-100;
+
+    &:hover,
+    &:focus-visible {
+        background-color: $bsr-white-100;
+        color: $bsr-brick-100;
+    }
+}
+
+button[type="button"].btn.btn-secondary {
+    background-color: $bsr-white-100;
+    color: $bsr-brick-100;
+    border: $bsr-border-width-m solid $bsr-brick-100;
+    
+    &:hover,
+    &:focus-visible {
+        background-color: $bsr-brick-100 !important;
+        color:  $bsr-white-100 !important;
+
+        & i {
+            color: $bsr-white-100 !important;
+        }
+    }
+}

package/dist/styles/variables/_fonts.scss

@@ -44,6 +44,7 @@
      src: local(""), url("../../assets/fonts/TradeGothicNextLT/TradeGothicNextCondensed_normal_condensed.woff2") format("woff2");
  }
 */
+$defaultBrowserFontSize: 16px;
 $fontsize-base: to-rem(18px);
 
 $fontfamily-base: "TradeGothicNext", sans-serif;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pinuts/bsr-uikit-relaunch",
-  "version": "0.2.47",
+  "version": "0.2.50",
   "private": false,
   "description": "BSR UI-KIT Relaunch",
   "main": "dist/index.js",