@eduzz/apps-toolbar-react - npm Package Compare versions

Comparing version 1.1.5 to 1.1.6

components/Apps/Advanced/styles.js

@@ -6,3 +6,3 @@ "use strict";
 var theme_1 = require("../../../assets/theme");
-exports.default = (function (Component) { return (0, styled_1.default)(Component)(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  width: 100%;\n  height: calc(100vh - ", "px);\n  top: ", "px;\n  left: 0;\n  position: absolute;\n  background: white;\n  padding: ", "px;\n  overflow: scroll;\n  box-sizing: border-box;\n  opacity: 0;\n  visibility: hidden;\n  user-select: none;\n  z-index: 1099;\n  transition: ", ";\n\n  ", " {\n    padding: ", "px;\n  }\n\n  &.--active {\n    opacity: 1;\n    visibility: visible;\n    user-select: auto;\n  }\n\n  .eduzz-toolbar-advanced-apps-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    width: 100%;\n\n    .eduzz-toolbar-advanced-apps-title {\n      color: #37474f;\n      font-weight: 500;\n    }\n\n    .eduzz-toolbar-advanced-apps-button-close {\n      color: ", ";\n      font-weight: 500;\n      display: flex;\n      align-items: center;\n      padding: ", "px ", "px;\n      border-radius: ", "px;\n      transition: ", ";\n      cursor: pointer;\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.05);\n      }\n\n      span.houston-icon {\n        margin-left: ", "px;\n      }\n    }\n  }\n\n  .eduzz-toolbar-advanced-apps-list-apps {\n    display: flex;\n    flex-wrap: wrap;\n    flex-direction: row;\n    margin-top: ", "px;\n\n    .eduzz-toolbar-advanced-apps-list-apps-item {\n      width: calc(25% - ", "px);\n      transition: ", ";\n      border-radius: ", "px;\n      margin: ", "px;\n      cursor: pointer;\n      height: auto;\n\n      ", " {\n        width: calc(50% - ", "px);\n      }\n\n      ", " {\n        width: 100%;\n        margin: ", "px 0;\n        padding: ", "px ", "px;\n      }\n\n      &.--active {\n        background: rgba(0, 0, 0, 0.04);\n\n        a {\n          cursor: no-drop;\n\n          .eduzz-toolbar-label {\n            color: ", ";\n          }\n        }\n      }\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n\n      a {\n        padding: ", "px;\n        display: block;\n        text-decoration: none;\n\n        ", " {\n          padding: ", "px 0;\n        }\n      }\n\n      .eduzz-toolbar-icon {\n        margin-bottom: ", "px;\n        text-align: center;\n\n        svg {\n          max-width: 80px;\n        }\n      }\n\n      .eduzz-toolbar-label {\n        margin-bottom: ", "px;\n        color: #37474f;\n        font-weight: 500;\n        font-size: 15px;\n      }\n\n      .eduzz-toolbar-description {\n        font-size: 14px;\n        color: #7c7c7c;\n      }\n    }\n  }\n"], ["\n  width: 100%;\n  height: calc(100vh - ", "px);\n  top: ", "px;\n  left: 0;\n  position: absolute;\n  background: white;\n  padding: ", "px;\n  overflow: scroll;\n  box-sizing: border-box;\n  opacity: 0;\n  visibility: hidden;\n  user-select: none;\n  z-index: 1099;\n  transition: ", ";\n\n  ", " {\n    padding: ", "px;\n  }\n\n  &.--active {\n    opacity: 1;\n    visibility: visible;\n    user-select: auto;\n  }\n\n  .eduzz-toolbar-advanced-apps-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    width: 100%;\n\n    .eduzz-toolbar-advanced-apps-title {\n      color: #37474f;\n      font-weight: 500;\n    }\n\n    .eduzz-toolbar-advanced-apps-button-close {\n      color: ", ";\n      font-weight: 500;\n      display: flex;\n      align-items: center;\n      padding: ", "px ", "px;\n      border-radius: ", "px;\n      transition: ", ";\n      cursor: pointer;\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.05);\n      }\n\n      span.houston-icon {\n        margin-left: ", "px;\n      }\n    }\n  }\n\n  .eduzz-toolbar-advanced-apps-list-apps {\n    display: flex;\n    flex-wrap: wrap;\n    flex-direction: row;\n    margin-top: ", "px;\n\n    .eduzz-toolbar-advanced-apps-list-apps-item {\n      width: calc(25% - ", "px);\n      transition: ", ";\n      border-radius: ", "px;\n      margin: ", "px;\n      cursor: pointer;\n      height: auto;\n\n      ", " {\n        width: calc(50% - ", "px);\n      }\n\n      ", " {\n        width: 100%;\n        margin: ", "px 0;\n        padding: ", "px ", "px;\n      }\n\n      &.--active {\n        background: rgba(0, 0, 0, 0.04);\n\n        a {\n          cursor: no-drop;\n\n          .eduzz-toolbar-label {\n            color: ", ";\n          }\n        }\n      }\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n\n      a {\n        padding: ", "px;\n        display: block;\n        text-decoration: none;\n\n        ", " {\n          padding: ", "px 0;\n        }\n      }\n\n      .eduzz-toolbar-icon {\n        margin-bottom: ", "px;\n        text-align: center;\n\n        svg {\n          max-width: 80px;\n        }\n      }\n\n      .eduzz-toolbar-label {\n        margin-bottom: ", "px;\n        color: #37474f;\n        font-weight: 500;\n        font-size: 15px;\n      }\n\n      .eduzz-toolbar-description {\n        font-size: 14px;\n        color: #7c7c7c;\n      }\n    }\n  }\n"])), theme_1.TOOLBAR_HEIGHT, theme_1.TOOLBAR_HEIGHT, function (_a) {
+exports.default = (function (Component) { return (0, styled_1.default)(Component)(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  width: 100%;\n  height: calc(100vh - ", "px);\n  top: ", "px;\n  left: 0;\n  position: absolute;\n  background: white;\n  padding: ", "px;\n  overflow-y: scroll;\n  opacity: 0;\n  visibility: hidden;\n  user-select: none;\n  z-index: 1099;\n  transition: ", ";\n\n  ", " {\n    padding: ", "px;\n  }\n\n  &.--active {\n    opacity: 1;\n    visibility: visible;\n    user-select: auto;\n  }\n\n  .eduzz-toolbar-advanced-apps-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    width: 100%;\n\n    .eduzz-toolbar-advanced-apps-title {\n      color: #37474f;\n      font-weight: 500;\n    }\n\n    .eduzz-toolbar-advanced-apps-button-close {\n      color: ", ";\n      font-weight: 500;\n      display: flex;\n      align-items: center;\n      padding: ", "px ", "px;\n      border-radius: ", "px;\n      transition: ", ";\n      cursor: pointer;\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.05);\n      }\n\n      span.houston-icon {\n        margin-left: ", "px;\n      }\n    }\n  }\n\n  .eduzz-toolbar-advanced-apps-list-apps {\n    display: flex;\n    flex-wrap: wrap;\n    flex-direction: row;\n    margin-top: ", "px;\n\n    .eduzz-toolbar-advanced-apps-list-apps-item {\n      width: calc(25% - ", "px);\n      transition: ", ";\n      border-radius: ", "px;\n      margin: ", "px;\n      cursor: pointer;\n      height: auto;\n\n      ", " {\n        width: calc(50% - ", "px);\n      }\n\n      ", " {\n        width: 100%;\n        margin: ", "px 0;\n        padding: ", "px ", "px;\n      }\n\n      &.--active {\n        background: rgba(0, 0, 0, 0.04);\n\n        a {\n          cursor: no-drop;\n\n          .eduzz-toolbar-label {\n            color: ", ";\n          }\n        }\n      }\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n\n      a {\n        padding: ", "px;\n        display: block;\n        text-decoration: none;\n\n        ", " {\n          padding: ", "px 0;\n        }\n      }\n\n      .eduzz-toolbar-icon {\n        margin-bottom: ", "px;\n        text-align: center;\n\n        svg {\n          max-width: 80px;\n        }\n      }\n\n      .eduzz-toolbar-label {\n        margin-bottom: ", "px;\n        color: #37474f;\n        font-weight: 500;\n        font-size: 15px;\n      }\n\n      .eduzz-toolbar-description {\n        font-size: 14px;\n        color: #7c7c7c;\n      }\n    }\n  }\n"], ["\n  width: 100%;\n  height: calc(100vh - ", "px);\n  top: ", "px;\n  left: 0;\n  position: absolute;\n  background: white;\n  padding: ", "px;\n  overflow-y: scroll;\n  opacity: 0;\n  visibility: hidden;\n  user-select: none;\n  z-index: 1099;\n  transition: ", ";\n\n  ", " {\n    padding: ", "px;\n  }\n\n  &.--active {\n    opacity: 1;\n    visibility: visible;\n    user-select: auto;\n  }\n\n  .eduzz-toolbar-advanced-apps-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    width: 100%;\n\n    .eduzz-toolbar-advanced-apps-title {\n      color: #37474f;\n      font-weight: 500;\n    }\n\n    .eduzz-toolbar-advanced-apps-button-close {\n      color: ", ";\n      font-weight: 500;\n      display: flex;\n      align-items: center;\n      padding: ", "px ", "px;\n      border-radius: ", "px;\n      transition: ", ";\n      cursor: pointer;\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.05);\n      }\n\n      span.houston-icon {\n        margin-left: ", "px;\n      }\n    }\n  }\n\n  .eduzz-toolbar-advanced-apps-list-apps {\n    display: flex;\n    flex-wrap: wrap;\n    flex-direction: row;\n    margin-top: ", "px;\n\n    .eduzz-toolbar-advanced-apps-list-apps-item {\n      width: calc(25% - ", "px);\n      transition: ", ";\n      border-radius: ", "px;\n      margin: ", "px;\n      cursor: pointer;\n      height: auto;\n\n      ", " {\n        width: calc(50% - ", "px);\n      }\n\n      ", " {\n        width: 100%;\n        margin: ", "px 0;\n        padding: ", "px ", "px;\n      }\n\n      &.--active {\n        background: rgba(0, 0, 0, 0.04);\n\n        a {\n          cursor: no-drop;\n\n          .eduzz-toolbar-label {\n            color: ", ";\n          }\n        }\n      }\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n\n      a {\n        padding: ", "px;\n        display: block;\n        text-decoration: none;\n\n        ", " {\n          padding: ", "px 0;\n        }\n      }\n\n      .eduzz-toolbar-icon {\n        margin-bottom: ", "px;\n        text-align: center;\n\n        svg {\n          max-width: 80px;\n        }\n      }\n\n      .eduzz-toolbar-label {\n        margin-bottom: ", "px;\n        color: #37474f;\n        font-weight: 500;\n        font-size: 15px;\n      }\n\n      .eduzz-toolbar-description {\n        font-size: 14px;\n        color: #7c7c7c;\n      }\n    }\n  }\n"])), theme_1.TOOLBAR_HEIGHT, theme_1.TOOLBAR_HEIGHT, function (_a) {
     var theme = _a.theme;
@@ -9,0 +9,0 @@ return theme.spacing(10);

components/Apps/Dropdown/index.js

@@ -33,4 +33,4 @@ "use strict";
         }
-        var top = dropdown.getBoundingClientRect().top;
-        setPosition({ top: theme_1.TOOLBAR_HEIGHT + top, right: 0 });
+        var _a = dropdown.getBoundingClientRect(), top = _a.top, right = _a.right;
+        setPosition({ top: theme_1.TOOLBAR_HEIGHT + top, right: right - theme_1.DROPDOWN_WIDTH });
     }, [dropdown]);
@@ -44,3 +44,3 @@ (0, react_1.useEffect)(function () {
     }, [dropdown, handleCalculatePosition]);
-    return ((0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: (0, className_1.default)('eduzz-toolbar-apps-dropdown', className, dropdown && '--opened'), style: position ? { top: position === null || position === void 0 ? void 0 : position.top, right: position === null || position === void 0 ? void 0 : position.right } : {} }, { children: [(0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-apps-dropdown-list-apps' }, { children: applications === null || applications === void 0 ? void 0 : applications.map(function (app) {
+    return ((0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: (0, className_1.default)('eduzz-toolbar-apps-dropdown', className, dropdown && '--opened'), style: position ? { top: position === null || position === void 0 ? void 0 : position.top, left: position === null || position === void 0 ? void 0 : position.right } : {} }, { children: [(0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-apps-dropdown-list-apps' }, { children: applications === null || applications === void 0 ? void 0 : applications.map(function (app) {
                     var isActive = app.application === application;
@@ -47,0 +47,0 @@ return ((0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: (0, className_1.default)('eduzz-toolbar-apps-dropdown-item', isActive && '--active') }, { children: (0, jsx_runtime_1.jsxs)("a", (0, tslib_1.__assign)({ href: (0, url_1.buildUrl)(app.application, application), rel: 'noopener noreferrer', target: '_blank', onClick: function () { return handleClickApplication(app.application); } }, { children: [(0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-icon' }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: app.icon }, void 0) }), void 0), (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-label' }, { children: app.label }), void 0)] }), app.application) }), app.application));

components/Apps/Dropdown/styles.js

@@ -6,3 +6,3 @@ "use strict";
 var theme_1 = require("../../../assets/theme");
-exports.default = (function (Component) { return (0, styled_1.default)(Component)(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  width: ", "px;\n  position: absolute;\n  padding: ", "px ", "px;\n  background: #fff;\n  box-shadow: ", ";\n  top: 0;\n  right: 0;\n  border-radius: 0 0 ", "px ", "px;\n  z-index: 1099;\n  transition: opacity ", ";\n  opacity: 0;\n  visibility: hidden;\n  user-select: none;\n  box-sizing: border-box;\n\n  ", " {\n    width: calc(100% - ", "px);\n    margin: 0 ", "px;\n    left: auto !important;\n  }\n\n  &.--opened {\n    opacity: 1;\n    visibility: visible;\n    user-select: initial;\n  }\n\n  .eduzz-toolbar-apps-dropdown-list-apps {\n    display: flex;\n    flex-wrap: wrap;\n    justify-items: center;\n    box-sizing: border-box;\n\n    .eduzz-toolbar-apps-dropdown-item {\n      width: calc(33% - ", "px);\n      text-align: center;\n      transition: ", ";\n      border-radius: ", "px;\n      margin: ", "px;\n      text-decoration: none;\n      cursor: pointer;\n\n      a {\n        text-decoration: none;\n        padding: ", "px ", "px;\n        display: block;\n\n        .eduzz-toolbar-icon {\n          svg {\n            width: ", "px;\n          }\n        }\n\n        .eduzz-toolbar-label {\n          display: block;\n          font-size: 13px;\n          margin-top: ", "px;\n          color: ", ";\n          font-weight: 500;\n          line-height: 1;\n\n          &::selection {\n            background: none;\n          }\n        }\n      }\n\n      &.--active {\n        background: rgba(0, 0, 0, 0.04);\n\n        a {\n          cursor: no-drop;\n\n          .eduzz-toolbar-label {\n            color: ", ";\n          }\n        }\n      }\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n    }\n  }\n\n  .eduzz-toolbar-apps-dropdown-expand {\n    text-align: center;\n\n    span:not(.houston-icon) {\n      display: flex;\n      align-items: center;\n      font-size: 13px;\n      cursor: pointer;\n      color: ", ";\n      justify-content: center;\n      transition: ", ";\n      border-radius: ", "px;\n      padding: ", "px 0;\n      font-weight: 500;\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n\n      .houston-icon {\n        margin-right: ", "px;\n      }\n    }\n  }\n"], ["\n  width: ", "px;\n  position: absolute;\n  padding: ", "px ", "px;\n  background: #fff;\n  box-shadow: ", ";\n  top: 0;\n  right: 0;\n  border-radius: 0 0 ", "px ", "px;\n  z-index: 1099;\n  transition: opacity ", ";\n  opacity: 0;\n  visibility: hidden;\n  user-select: none;\n  box-sizing: border-box;\n\n  ", " {\n    width: calc(100% - ", "px);\n    margin: 0 ", "px;\n    left: auto !important;\n  }\n\n  &.--opened {\n    opacity: 1;\n    visibility: visible;\n    user-select: initial;\n  }\n\n  .eduzz-toolbar-apps-dropdown-list-apps {\n    display: flex;\n    flex-wrap: wrap;\n    justify-items: center;\n    box-sizing: border-box;\n\n    .eduzz-toolbar-apps-dropdown-item {\n      width: calc(33% - ", "px);\n      text-align: center;\n      transition: ", ";\n      border-radius: ", "px;\n      margin: ", "px;\n      text-decoration: none;\n      cursor: pointer;\n\n      a {\n        text-decoration: none;\n        padding: ", "px ", "px;\n        display: block;\n\n        .eduzz-toolbar-icon {\n          svg {\n            width: ", "px;\n          }\n        }\n\n        .eduzz-toolbar-label {\n          display: block;\n          font-size: 13px;\n          margin-top: ", "px;\n          color: ", ";\n          font-weight: 500;\n          line-height: 1;\n\n          &::selection {\n            background: none;\n          }\n        }\n      }\n\n      &.--active {\n        background: rgba(0, 0, 0, 0.04);\n\n        a {\n          cursor: no-drop;\n\n          .eduzz-toolbar-label {\n            color: ", ";\n          }\n        }\n      }\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n    }\n  }\n\n  .eduzz-toolbar-apps-dropdown-expand {\n    text-align: center;\n\n    span:not(.houston-icon) {\n      display: flex;\n      align-items: center;\n      font-size: 13px;\n      cursor: pointer;\n      color: ", ";\n      justify-content: center;\n      transition: ", ";\n      border-radius: ", "px;\n      padding: ", "px 0;\n      font-weight: 500;\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n\n      .houston-icon {\n        margin-right: ", "px;\n      }\n    }\n  }\n"])), theme_1.DROPDOWN_WIDTH, function (_a) {
+exports.default = (function (Component) { return (0, styled_1.default)(Component)(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  width: ", "px;\n  position: absolute;\n  padding: ", "px ", "px;\n  background: #fff;\n  box-shadow: ", ";\n  top: 0;\n  right: 0;\n  border-radius: 0 0 ", "px ", "px;\n  z-index: 1099;\n  transition: opacity ", ";\n  opacity: 0;\n  visibility: hidden;\n  user-select: none;\n  box-sizing: border-box;\n\n  ", " {\n    width: calc(100% - ", "px);\n    margin: 0 ", "px;\n    left: 0 !important;\n  }\n\n  &.--opened {\n    opacity: 1;\n    visibility: visible;\n    user-select: initial;\n  }\n\n  .eduzz-toolbar-apps-dropdown-list-apps {\n    display: flex;\n    flex-wrap: wrap;\n    justify-items: center;\n    box-sizing: border-box;\n\n    .eduzz-toolbar-apps-dropdown-item {\n      width: calc(33% - ", "px);\n      text-align: center;\n      transition: ", ";\n      border-radius: ", "px;\n      margin: ", "px;\n      text-decoration: none;\n      cursor: pointer;\n\n      a {\n        text-decoration: none;\n        padding: ", "px ", "px;\n        display: block;\n\n        .eduzz-toolbar-icon {\n          svg {\n            width: ", "px;\n          }\n        }\n\n        .eduzz-toolbar-label {\n          display: block;\n          font-size: 13px;\n          margin-top: ", "px;\n          color: ", ";\n          font-weight: 500;\n          line-height: 1;\n\n          &::selection {\n            background: none;\n          }\n        }\n      }\n\n      &.--active {\n        background: rgba(0, 0, 0, 0.04);\n\n        a {\n          cursor: no-drop;\n\n          .eduzz-toolbar-label {\n            color: ", ";\n          }\n        }\n      }\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n    }\n  }\n\n  .eduzz-toolbar-apps-dropdown-expand {\n    text-align: center;\n\n    span:not(.houston-icon) {\n      display: flex;\n      align-items: center;\n      font-size: 13px;\n      cursor: pointer;\n      color: ", ";\n      justify-content: center;\n      transition: ", ";\n      border-radius: ", "px;\n      padding: ", "px 0;\n      font-weight: 500;\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n\n      .houston-icon {\n        margin-right: ", "px;\n      }\n    }\n  }\n"], ["\n  width: ", "px;\n  position: absolute;\n  padding: ", "px ", "px;\n  background: #fff;\n  box-shadow: ", ";\n  top: 0;\n  right: 0;\n  border-radius: 0 0 ", "px ", "px;\n  z-index: 1099;\n  transition: opacity ", ";\n  opacity: 0;\n  visibility: hidden;\n  user-select: none;\n  box-sizing: border-box;\n\n  ", " {\n    width: calc(100% - ", "px);\n    margin: 0 ", "px;\n    left: 0 !important;\n  }\n\n  &.--opened {\n    opacity: 1;\n    visibility: visible;\n    user-select: initial;\n  }\n\n  .eduzz-toolbar-apps-dropdown-list-apps {\n    display: flex;\n    flex-wrap: wrap;\n    justify-items: center;\n    box-sizing: border-box;\n\n    .eduzz-toolbar-apps-dropdown-item {\n      width: calc(33% - ", "px);\n      text-align: center;\n      transition: ", ";\n      border-radius: ", "px;\n      margin: ", "px;\n      text-decoration: none;\n      cursor: pointer;\n\n      a {\n        text-decoration: none;\n        padding: ", "px ", "px;\n        display: block;\n\n        .eduzz-toolbar-icon {\n          svg {\n            width: ", "px;\n          }\n        }\n\n        .eduzz-toolbar-label {\n          display: block;\n          font-size: 13px;\n          margin-top: ", "px;\n          color: ", ";\n          font-weight: 500;\n          line-height: 1;\n\n          &::selection {\n            background: none;\n          }\n        }\n      }\n\n      &.--active {\n        background: rgba(0, 0, 0, 0.04);\n\n        a {\n          cursor: no-drop;\n\n          .eduzz-toolbar-label {\n            color: ", ";\n          }\n        }\n      }\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n    }\n  }\n\n  .eduzz-toolbar-apps-dropdown-expand {\n    text-align: center;\n\n    span:not(.houston-icon) {\n      display: flex;\n      align-items: center;\n      font-size: 13px;\n      cursor: pointer;\n      color: ", ";\n      justify-content: center;\n      transition: ", ";\n      border-radius: ", "px;\n      padding: ", "px 0;\n      font-weight: 500;\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n\n      .houston-icon {\n        margin-right: ", "px;\n      }\n    }\n  }\n"])), theme_1.DROPDOWN_WIDTH, function (_a) {
     var theme = _a.theme;
@@ -9,0 +9,0 @@ return theme.spacing(2);

components/Apps/index.js

@@ -57,4 +57,4 @@ "use strict";
     (0, useEscapeKey_1.useEscapeKey)(handlePressEscapeKey);
-    return ((0, jsx_runtime_1.jsxs)(context_2.default.Provider, (0, tslib_1.__assign)({ value: { applications: listApplications, opened: opened, setOpenDropdown: setOpenDropdown, setOpenedAdvanced: setOpenedAdvanced } }, { children: [(0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ ref: wrapperDropdownRef, className: (0, className_1.default)('eduzz-toolbar-apps', className) }, { children: [(0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: (0, className_1.default)('eduzz-toolbar-apps-button', isActiveButton && '--active'), onClick: handleClickOpenDropdown }, { children: [(0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-apps-icon' }, { children: (0, jsx_runtime_1.jsx)(Apps_1.default, { size: 24 }, void 0) }), void 0), (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-apps-label' }, { children: "Apps" }), void 0)] }), void 0), (0, jsx_runtime_1.jsx)(Dropdown_1.default, {}, void 0)] }), void 0), (0, jsx_runtime_1.jsx)(Advanced_1.default, {}, void 0)] }), void 0));
+    return ((0, jsx_runtime_1.jsxs)(context_2.default.Provider, (0, tslib_1.__assign)({ value: { applications: listApplications, opened: opened, setOpenDropdown: setOpenDropdown, setOpenedAdvanced: setOpenedAdvanced } }, { children: [(0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ ref: wrapperDropdownRef, className: (0, className_1.default)('eduzz-toolbar-apps', className) }, { children: (0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: (0, className_1.default)('eduzz-toolbar-apps-button', isActiveButton && '--active'), onClick: handleClickOpenDropdown }, { children: [(0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-apps-icon' }, { children: (0, jsx_runtime_1.jsx)(Apps_1.default, { size: 24 }, void 0) }), void 0), (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-apps-label' }, { children: "Apps" }), void 0)] }), void 0) }), void 0), (0, jsx_runtime_1.jsx)(Dropdown_1.default, {}, void 0), (0, jsx_runtime_1.jsx)(Advanced_1.default, {}, void 0)] }), void 0));
 };
 exports.default = (0, styles_1.default)((0, react_1.memo)(Apps));

components/CustomAction/index.js

@@ -13,3 +13,3 @@ "use strict";
 };
-exports.default = (0, styled_1.default)((0, react_1.memo)(ToolbarCustomAction))(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  position: relative;\n\n  .eduzz-toolbar-action-button {\n    display: flex;\n    align-items: center;\n    padding: 0 ", "px;\n    transition: ", ";\n    height: ", "px;\n    cursor: pointer;\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n\n    &.--has-icon {\n      .eduzz-toolbar-action-label {\n        margin-left: ", "px;\n\n        ", " {\n          display: none;\n        }\n      }\n    }\n\n    .eduzz-toolbar-action-icon {\n      line-height: 0;\n\n      svg {\n        width: 24px;\n        height: 24px;\n      }\n    }\n\n    .eduzz-toolbar-action-label {\n      font-size: 14px;\n\n      &::selection {\n        background: transparent;\n      }\n    }\n  }\n"], ["\n  position: relative;\n\n  .eduzz-toolbar-action-button {\n    display: flex;\n    align-items: center;\n    padding: 0 ", "px;\n    transition: ", ";\n    height: ", "px;\n    cursor: pointer;\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n\n    &.--has-icon {\n      .eduzz-toolbar-action-label {\n        margin-left: ", "px;\n\n        ", " {\n          display: none;\n        }\n      }\n    }\n\n    .eduzz-toolbar-action-icon {\n      line-height: 0;\n\n      svg {\n        width: 24px;\n        height: 24px;\n      }\n    }\n\n    .eduzz-toolbar-action-label {\n      font-size: 14px;\n\n      &::selection {\n        background: transparent;\n      }\n    }\n  }\n"])), function (_a) {
+exports.default = (0, styled_1.default)((0, react_1.memo)(ToolbarCustomAction))(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  position: relative;\n\n  .eduzz-toolbar-action-button {\n    display: flex;\n    align-items: center;\n    padding: 0 ", "px;\n    transition: ", ";\n    height: ", "px;\n    cursor: pointer;\n\n    ", " {\n      padding: 0 ", "px;\n    }\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n\n    &.--has-icon {\n      .eduzz-toolbar-action-label {\n        margin-left: ", "px;\n\n        ", " {\n          display: none;\n        }\n      }\n    }\n\n    .eduzz-toolbar-action-icon {\n      line-height: 0;\n\n      svg {\n        width: 24px;\n        height: 24px;\n      }\n    }\n\n    .eduzz-toolbar-action-label {\n      font-size: 14px;\n\n      &::selection {\n        background: transparent;\n      }\n    }\n  }\n"], ["\n  position: relative;\n\n  .eduzz-toolbar-action-button {\n    display: flex;\n    align-items: center;\n    padding: 0 ", "px;\n    transition: ", ";\n    height: ", "px;\n    cursor: pointer;\n\n    ", " {\n      padding: 0 ", "px;\n    }\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n\n    &.--has-icon {\n      .eduzz-toolbar-action-label {\n        margin-left: ", "px;\n\n        ", " {\n          display: none;\n        }\n      }\n    }\n\n    .eduzz-toolbar-action-icon {\n      line-height: 0;\n\n      svg {\n        width: 24px;\n        height: 24px;\n      }\n    }\n\n    .eduzz-toolbar-action-label {\n      font-size: 14px;\n\n      &::selection {\n        background: transparent;\n      }\n    }\n  }\n"])), function (_a) {
     var theme = _a.theme;
@@ -22,7 +22,13 @@ return theme.spacing(3);
     var theme = _a.theme;
+    return theme.breakpoints.mobile;
+}, function (_a) {
+    var theme = _a.theme;
     return theme.spacing(2);
 }, function (_a) {
     var theme = _a.theme;
+    return theme.spacing(2);
+}, function (_a) {
+    var theme = _a.theme;
     return theme.breakpoints.mobile;
 });
 var templateObject_1;

components/EduzzLogo/index.d.ts

@@ -1,6 +0,5 @@
-/// <reference types="react" />
-interface IProps {
-    className?: string;
-}
-declare const EduzzLogo: import("react").NamedExoticComponent<IProps>;
-export default EduzzLogo;
+import { IStylesProps } from '../../interfaces/styles';
+declare const _default: import("@emotion/styled").StyledComponent<IStylesProps & {
+    theme?: import("@emotion/react").Theme;
+}, {}, {}>;
+export default _default;

components/EduzzLogo/index.js

@@ -7,5 +7,14 @@ "use strict";
 var react_1 = require("react");
-var EduzzLogo = (0, react_1.memo)(function (props) {
-    return ((0, jsx_runtime_1.jsxs)("svg", (0, tslib_1.__assign)({ viewBox: '0 0 88 28', fill: 'none', xmlns: 'http://www.w3.org/2000/svg' }, props, { children: [(0, jsx_runtime_1.jsx)("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M41.7443 17.25C42.5943 17.25 42.8443 17 42.9443 16.15C42.9443 15.9808 42.9559 15.8117 42.968 15.6369C42.9809 15.45 42.9943 15.2567 42.9943 15.05C42.9943 11.85 41.2943 10.2 37.9943 10.2C34.4943 10.2 32.7443 11.9 32.7443 15.3V17.35C32.7443 20.9 34.5943 22.4 38.5443 22.4C39.6443 22.4 40.6443 22.3 41.5943 22.05C42.3943 21.85 42.5443 21.65 42.5443 20.9V20.6C42.5443 19.8 42.3443 19.6 41.5943 19.8C40.5443 20.05 39.4943 20.15 38.5443 20.15C36.1943 20.15 35.1943 19.45 35.1943 17.75V17.25H41.7443ZM40.6943 14.65V15.25H35.1943L35.2443 14.65C35.2443 13.05 36.1443 12.3 37.9443 12.3C39.7943 12.3 40.6943 13.1 40.6943 14.65Z', fill: 'white', className: 'logo-letter' }, void 0), (0, jsx_runtime_1.jsx)("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M49.5443 22.45C52.8943 22.45 54.8943 20.75 54.8943 17.4L54.9443 6.8C54.9443 5.95 54.7443 5.75 53.8943 5.75H53.5943C52.7443 5.75 52.5443 5.95 52.5443 6.8V11.8C51.8943 10.75 50.7443 10.25 49.0943 10.25C45.7943 10.25 44.1443 12 44.1443 15.4V17.4C44.1443 20.8 45.9443 22.45 49.5443 22.45ZM49.4943 20.15C47.1443 20.15 46.5443 19.35 46.5443 17.35V15.35C46.5443 13.4 47.1943 12.55 49.4943 12.55C51.7943 12.55 52.4943 13.35 52.4943 15.35V17.35C52.4943 19.3 51.8443 20.15 49.4943 20.15Z', fill: 'white', className: 'logo-letter' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M61.4443 20.15C59.3443 20.15 58.7443 19.45 58.7443 17.85L58.6443 11.55C58.6443 10.7 58.4443 10.5 57.5943 10.5H57.2943C56.4443 10.5 56.2443 10.7 56.2443 11.55V17.85C56.2443 20.9 57.9943 22.45 61.3943 22.45C64.9443 22.45 66.4943 20.9 66.4943 17.85V11.55C66.4943 10.7 66.2943 10.5 65.4443 10.5H65.1443C64.2943 10.5 64.0943 10.7 64.0943 11.55V17.85C64.0943 19.45 63.5443 20.15 61.4443 20.15Z', fill: 'white', className: 'logo-letter' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M69.2443 10.5C68.4943 10.5 68.2943 10.7 68.2943 11.45L68.2443 11.75C68.2443 12.5 68.4443 12.7 69.1943 12.7H74.3943C74.8943 12.7 75.1443 12.85 75.1443 13.1C75.1443 13.3 74.9443 13.5 74.5943 13.75L69.3943 16.95C68.1943 17.65 67.5943 18.6 67.5943 19.75C67.5943 21.35 68.4943 22.15 70.2943 22.15H76.3943C77.1443 22.15 77.3443 21.95 77.3443 21.2V20.9C77.3443 20.15 77.1443 19.95 76.3943 19.95H70.5443C70.0443 19.95 69.7943 19.85 69.7943 19.55C69.7943 19.3 69.9443 19.1 70.2943 18.9L75.5443 15.7C76.9943 14.8 77.3443 14.15 77.3443 12.9C77.3443 11.15 76.6443 10.5 74.6443 10.5H69.2443Z', fill: 'white', className: 'logo-letter' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M79.6443 10.5C78.8943 10.5 78.6943 10.7 78.6943 11.45L78.6443 11.75C78.6443 12.5 78.8443 12.7 79.5943 12.7H84.7943C85.2943 12.7 85.5443 12.85 85.5443 13.1C85.5443 13.3 85.3443 13.5 84.9943 13.75L79.7943 16.95C78.5943 17.65 77.9943 18.6 77.9943 19.75C77.9943 21.35 78.8943 22.15 80.6943 22.15H86.7943C87.5443 22.15 87.7443 21.95 87.7443 21.2V20.9C87.7443 20.15 87.5443 19.95 86.7943 19.95H80.9443C80.4443 19.95 80.1943 19.85 80.1943 19.55C80.1943 19.3 80.3443 19.1 80.6943 18.9L85.9443 15.7C87.3943 14.8 87.7443 14.15 87.7443 12.9C87.7443 11.15 87.0443 10.5 85.0443 10.5H79.6443Z', fill: 'white', className: 'logo-letter' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M27.9186 13.9593C27.9186 21.6868 21.6369 27.9186 13.9593 27.9186C6.23184 27.9186 0 21.6369 0 13.9593C0 6.23183 6.28169 0 13.9593 0C21.6868 0 27.9186 6.23183 27.9186 13.9593Z', fill: '#FFBC01' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M0.77186 9.37264C1.45652 7.40631 2.56876 5.64148 3.99551 4.18774H12.015C13.4109 4.18774 14.6074 5.33441 14.6074 6.78019C14.6074 8.22598 13.4608 9.37264 12.015 9.37264H0.77186Z', fill: 'white' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M0.205179 16.3523C0.0702838 15.5743 0 14.7747 0 13.9593C0 13.0028 0.0962533 12.0691 0.279493 11.1674H7.57793C8.97386 11.1674 10.1205 12.3141 10.1205 13.7598C10.1205 15.2056 8.97386 16.3523 7.52808 16.3523H0.205179Z', fill: 'white' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M3.57453 23.2821C2.24607 21.8027 1.22913 20.0394 0.625629 18.0972H12.015C13.4109 18.0972 14.6074 19.2937 14.6074 20.6896C14.6074 22.1354 13.4608 23.2821 12.015 23.2821H3.57453Z', fill: 'white' }, void 0)] }), void 0));
+var styled_1 = (0, tslib_1.__importDefault)(require("@emotion/styled"));
+var EduzzLogo = (0, react_1.memo)(function (_a) {
+    var className = _a.className;
+    return ((0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: className }, { children: [(0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'desktop' }, { children: (0, jsx_runtime_1.jsxs)("svg", (0, tslib_1.__assign)({ viewBox: '10 0 70 28', fill: 'none', xmlns: 'http://www.w3.org/2000/svg' }, { children: [(0, jsx_runtime_1.jsx)("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M41.7443 17.25C42.5943 17.25 42.8443 17 42.9443 16.15C42.9443 15.9808 42.9559 15.8117 42.968 15.6369C42.9809 15.45 42.9943 15.2567 42.9943 15.05C42.9943 11.85 41.2943 10.2 37.9943 10.2C34.4943 10.2 32.7443 11.9 32.7443 15.3V17.35C32.7443 20.9 34.5943 22.4 38.5443 22.4C39.6443 22.4 40.6443 22.3 41.5943 22.05C42.3943 21.85 42.5443 21.65 42.5443 20.9V20.6C42.5443 19.8 42.3443 19.6 41.5943 19.8C40.5443 20.05 39.4943 20.15 38.5443 20.15C36.1943 20.15 35.1943 19.45 35.1943 17.75V17.25H41.7443ZM40.6943 14.65V15.25H35.1943L35.2443 14.65C35.2443 13.05 36.1443 12.3 37.9443 12.3C39.7943 12.3 40.6943 13.1 40.6943 14.65Z', fill: 'white', className: 'logo-letter' }, void 0), (0, jsx_runtime_1.jsx)("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M49.5443 22.45C52.8943 22.45 54.8943 20.75 54.8943 17.4L54.9443 6.8C54.9443 5.95 54.7443 5.75 53.8943 5.75H53.5943C52.7443 5.75 52.5443 5.95 52.5443 6.8V11.8C51.8943 10.75 50.7443 10.25 49.0943 10.25C45.7943 10.25 44.1443 12 44.1443 15.4V17.4C44.1443 20.8 45.9443 22.45 49.5443 22.45ZM49.4943 20.15C47.1443 20.15 46.5443 19.35 46.5443 17.35V15.35C46.5443 13.4 47.1943 12.55 49.4943 12.55C51.7943 12.55 52.4943 13.35 52.4943 15.35V17.35C52.4943 19.3 51.8443 20.15 49.4943 20.15Z', fill: 'white', className: 'logo-letter' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M61.4443 20.15C59.3443 20.15 58.7443 19.45 58.7443 17.85L58.6443 11.55C58.6443 10.7 58.4443 10.5 57.5943 10.5H57.2943C56.4443 10.5 56.2443 10.7 56.2443 11.55V17.85C56.2443 20.9 57.9943 22.45 61.3943 22.45C64.9443 22.45 66.4943 20.9 66.4943 17.85V11.55C66.4943 10.7 66.2943 10.5 65.4443 10.5H65.1443C64.2943 10.5 64.0943 10.7 64.0943 11.55V17.85C64.0943 19.45 63.5443 20.15 61.4443 20.15Z', fill: 'white', className: 'logo-letter' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M69.2443 10.5C68.4943 10.5 68.2943 10.7 68.2943 11.45L68.2443 11.75C68.2443 12.5 68.4443 12.7 69.1943 12.7H74.3943C74.8943 12.7 75.1443 12.85 75.1443 13.1C75.1443 13.3 74.9443 13.5 74.5943 13.75L69.3943 16.95C68.1943 17.65 67.5943 18.6 67.5943 19.75C67.5943 21.35 68.4943 22.15 70.2943 22.15H76.3943C77.1443 22.15 77.3443 21.95 77.3443 21.2V20.9C77.3443 20.15 77.1443 19.95 76.3943 19.95H70.5443C70.0443 19.95 69.7943 19.85 69.7943 19.55C69.7943 19.3 69.9443 19.1 70.2943 18.9L75.5443 15.7C76.9943 14.8 77.3443 14.15 77.3443 12.9C77.3443 11.15 76.6443 10.5 74.6443 10.5H69.2443Z', fill: 'white', className: 'logo-letter' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M79.6443 10.5C78.8943 10.5 78.6943 10.7 78.6943 11.45L78.6443 11.75C78.6443 12.5 78.8443 12.7 79.5943 12.7H84.7943C85.2943 12.7 85.5443 12.85 85.5443 13.1C85.5443 13.3 85.3443 13.5 84.9943 13.75L79.7943 16.95C78.5943 17.65 77.9943 18.6 77.9943 19.75C77.9943 21.35 78.8943 22.15 80.6943 22.15H86.7943C87.5443 22.15 87.7443 21.95 87.7443 21.2V20.9C87.7443 20.15 87.5443 19.95 86.7943 19.95H80.9443C80.4443 19.95 80.1943 19.85 80.1943 19.55C80.1943 19.3 80.3443 19.1 80.6943 18.9L85.9443 15.7C87.3943 14.8 87.7443 14.15 87.7443 12.9C87.7443 11.15 87.0443 10.5 85.0443 10.5H79.6443Z', fill: 'white', className: 'logo-letter' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M27.9186 13.9593C27.9186 21.6868 21.6369 27.9186 13.9593 27.9186C6.23184 27.9186 0 21.6369 0 13.9593C0 6.23183 6.28169 0 13.9593 0C21.6868 0 27.9186 6.23183 27.9186 13.9593Z', fill: '#FFBC01' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M0.77186 9.37264C1.45652 7.40631 2.56876 5.64148 3.99551 4.18774H12.015C13.4109 4.18774 14.6074 5.33441 14.6074 6.78019C14.6074 8.22598 13.4608 9.37264 12.015 9.37264H0.77186Z', fill: 'white' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M0.205179 16.3523C0.0702838 15.5743 0 14.7747 0 13.9593C0 13.0028 0.0962533 12.0691 0.279493 11.1674H7.57793C8.97386 11.1674 10.1205 12.3141 10.1205 13.7598C10.1205 15.2056 8.97386 16.3523 7.52808 16.3523H0.205179Z', fill: 'white' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M3.57453 23.2821C2.24607 21.8027 1.22913 20.0394 0.625629 18.0972H12.015C13.4109 18.0972 14.6074 19.2937 14.6074 20.6896C14.6074 22.1354 13.4608 23.2821 12.015 23.2821H3.57453Z', fill: 'white' }, void 0)] }), void 0) }), void 0), (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'mobile' }, { children: (0, jsx_runtime_1.jsxs)("svg", (0, tslib_1.__assign)({ viewBox: '2 0 24 28', fill: 'none', xmlns: 'http://www.w3.org/2000/svg' }, { children: [(0, jsx_runtime_1.jsx)("path", { d: 'M27.9186 13.9593C27.9186 21.6868 21.6369 27.9186 13.9593 27.9186C6.23184 27.9186 0 21.6369 0 13.9593C0 6.23183 6.28169 0 13.9593 0C21.6868 0 27.9186 6.23183 27.9186 13.9593Z', fill: '#FFBC01' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M0.77186 9.37264C1.45652 7.40631 2.56876 5.64148 3.99551 4.18774H12.015C13.4109 4.18774 14.6074 5.33441 14.6074 6.78019C14.6074 8.22598 13.4608 9.37264 12.015 9.37264H0.77186Z', fill: 'white' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M0.205179 16.3523C0.0702838 15.5743 0 14.7747 0 13.9593C0 13.0028 0.0962533 12.0691 0.279493 11.1674H7.57793C8.97386 11.1674 10.1205 12.3141 10.1205 13.7598C10.1205 15.2056 8.97386 16.3523 7.52808 16.3523H0.205179Z', fill: 'white' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M3.57453 23.2821C2.24607 21.8027 1.22913 20.0394 0.625629 18.0972H12.015C13.4109 18.0972 14.6074 19.2937 14.6074 20.6896C14.6074 22.1354 13.4608 23.2821 12.015 23.2821H3.57453Z', fill: 'white' }, void 0)] }), void 0) }), void 0)] }), void 0));
 });
-exports.default = EduzzLogo;
+exports.default = (0, styled_1.default)(EduzzLogo)(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  .desktop {\n    ", " {\n      display: none;\n    }\n  }\n\n  .mobile {\n    display: none;\n\n    ", " {\n      display: block;\n    }\n  }\n"], ["\n  .desktop {\n    ", " {\n      display: none;\n    }\n  }\n\n  .mobile {\n    display: none;\n\n    ", " {\n      display: block;\n    }\n  }\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.breakpoints.mobile;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.breakpoints.mobile;
+});
+var templateObject_1;

components/Toolbar/styles.js

@@ -6,3 +6,3 @@ "use strict";
 var theme_1 = require("../../assets/theme");
-exports.default = (function (Component) { return (0, styled_1.default)(Component)(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  font-family: 'Open Sans', Roboto, Arial, sans-serif;\n  background-color: ", ";\n  color: ", ";\n  position: relative;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ", "px;\n  display: flex;\n  justify-content: space-between;\n  z-index: 1101;\n  transition: ", ";\n\n  .eduzz-toolbar-logo {\n    width: 200px;\n    display: flex;\n    align-items: center;\n    padding-left: ", "px;\n\n    ", " {\n      width: 110px;\n    }\n\n    svg {\n      width: 100%;\n      max-width: 90px;\n      margin-right: ", "px;\n\n      ", " {\n        margin-right: ", "px;\n        max-width: 200px;\n      }\n\n      .logo-letter {\n        ", " {\n          display: none;\n        }\n      }\n    }\n\n    .eduzz-toolbar-support {\n      font-size: 12px;\n      font-weight: 600;\n      color: ", ";\n      position: relative;\n      top: 2px;\n    }\n  }\n\n  .eduzz-toolbar-quick-access {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n"], ["\n  font-family: 'Open Sans', Roboto, Arial, sans-serif;\n  background-color: ", ";\n  color: ", ";\n  position: relative;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ", "px;\n  display: flex;\n  justify-content: space-between;\n  z-index: 1101;\n  transition: ", ";\n\n  .eduzz-toolbar-logo {\n    width: 200px;\n    display: flex;\n    align-items: center;\n    padding-left: ", "px;\n\n    ", " {\n      width: 110px;\n    }\n\n    svg {\n      width: 100%;\n      max-width: 90px;\n      margin-right: ", "px;\n\n      ", " {\n        margin-right: ", "px;\n        max-width: 200px;\n      }\n\n      .logo-letter {\n        ", " {\n          display: none;\n        }\n      }\n    }\n\n    .eduzz-toolbar-support {\n      font-size: 12px;\n      font-weight: 600;\n      color: ", ";\n      position: relative;\n      top: 2px;\n    }\n  }\n\n  .eduzz-toolbar-quick-access {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n"])), function (_a) {
+exports.default = (function (Component) { return (0, styled_1.default)(Component)(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  font-family: 'Open Sans', Roboto, Arial, sans-serif;\n  background-color: ", ";\n  color: ", ";\n  position: relative;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ", "px;\n  display: flex;\n  justify-content: space-between;\n  z-index: 1101;\n  transition: ", ";\n\n  .eduzz-toolbar-logo {\n    width: 116px;\n    display: flex;\n    align-items: center;\n    padding-left: ", "px;\n\n    ", " {\n      width: 44px;\n      min-width: 40px;\n    }\n\n    svg {\n      width: 100%;\n      max-height: calc(", "px - 16px);\n      margin-right: ", "px;\n\n      ", " {\n        margin-right: ", "px;\n      }\n    }\n\n    .eduzz-toolbar-support {\n      font-size: 12px;\n      font-weight: 600;\n      color: ", ";\n      position: relative;\n      top: 2px;\n    }\n  }\n\n  .eduzz-toolbar-quick-access {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n"], ["\n  font-family: 'Open Sans', Roboto, Arial, sans-serif;\n  background-color: ", ";\n  color: ", ";\n  position: relative;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ", "px;\n  display: flex;\n  justify-content: space-between;\n  z-index: 1101;\n  transition: ", ";\n\n  .eduzz-toolbar-logo {\n    width: 116px;\n    display: flex;\n    align-items: center;\n    padding-left: ", "px;\n\n    ", " {\n      width: 44px;\n      min-width: 40px;\n    }\n\n    svg {\n      width: 100%;\n      max-height: calc(", "px - 16px);\n      margin-right: ", "px;\n\n      ", " {\n        margin-right: ", "px;\n      }\n    }\n\n    .eduzz-toolbar-support {\n      font-size: 12px;\n      font-weight: 600;\n      color: ", ";\n      position: relative;\n      top: 2px;\n    }\n  }\n\n  .eduzz-toolbar-quick-access {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n"])), function (_a) {
     var theme = _a.theme;
@@ -22,3 +22,3 @@ return theme.colors.barBackground;
     return theme.breakpoints.mobile;
-}, function (_a) {
+}, theme_1.TOOLBAR_HEIGHT, function (_a) {
     var theme = _a.theme;
@@ -31,10 +31,7 @@ return theme.spacing(6);
     var theme = _a.theme;
-    return theme.spacing(1);
+    return theme.spacing(2);
 }, function (_a) {
     var theme = _a.theme;
-    return theme.breakpoints.mobile;
-}, function (_a) {
-    var theme = _a.theme;
     return theme.colors.suport;
 }); });
 var templateObject_1;

components/User/index.js

@@ -41,3 +41,3 @@ "use strict";
 };
-exports.default = (0, styled_1.default)((0, react_1.memo)(User))(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  position: relative;\n  z-index: 1100;\n\n  &.--has-menu {\n    cursor: pointer;\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n\n    &:focus {\n      background: none;\n    }\n  }\n\n  .eduzz-toolbar-user-label {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 0 ", "px;\n    height: ", "px;\n\n    .eduzz-toolbar-avatar {\n      width: ", "px;\n      height: ", "px;\n      border-radius: 100%;\n      background: #fff;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: ", ";\n      font-weight: 600;\n      margin-right: ", "px;\n      font-size: 14px;\n      line-height: 0;\n      background-size: cover;\n      background-position: center;\n      background-repeat: no-repeat;\n\n      &::selection {\n        background: none;\n      }\n    }\n\n    .eduzz-toolbar-user-name {\n      font-size: 14px;\n      font-weight: 500;\n\n      ", " {\n        display: none;\n      }\n\n      &::selection {\n        background: none;\n      }\n    }\n\n    .eduzz-toolbar-user-menu-arrow {\n      margin-left: ", "px;\n      transition: ", ";\n\n      ", " {\n        margin-left: 0;\n      }\n\n      &.--open {\n        transform: rotate(-180deg);\n      }\n\n      span.houston-icon {\n        line-height: 0;\n        position: relative;\n        top: 2px;\n      }\n    }\n  }\n"], ["\n  position: relative;\n  z-index: 1100;\n\n  &.--has-menu {\n    cursor: pointer;\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n\n    &:focus {\n      background: none;\n    }\n  }\n\n  .eduzz-toolbar-user-label {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 0 ", "px;\n    height: ", "px;\n\n    .eduzz-toolbar-avatar {\n      width: ", "px;\n      height: ", "px;\n      border-radius: 100%;\n      background: #fff;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: ", ";\n      font-weight: 600;\n      margin-right: ", "px;\n      font-size: 14px;\n      line-height: 0;\n      background-size: cover;\n      background-position: center;\n      background-repeat: no-repeat;\n\n      &::selection {\n        background: none;\n      }\n    }\n\n    .eduzz-toolbar-user-name {\n      font-size: 14px;\n      font-weight: 500;\n\n      ", " {\n        display: none;\n      }\n\n      &::selection {\n        background: none;\n      }\n    }\n\n    .eduzz-toolbar-user-menu-arrow {\n      margin-left: ", "px;\n      transition: ", ";\n\n      ", " {\n        margin-left: 0;\n      }\n\n      &.--open {\n        transform: rotate(-180deg);\n      }\n\n      span.houston-icon {\n        line-height: 0;\n        position: relative;\n        top: 2px;\n      }\n    }\n  }\n"])), function (_a) {
+exports.default = (0, styled_1.default)((0, react_1.memo)(User))(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  position: relative;\n  z-index: 1100;\n\n  &.--has-menu {\n    cursor: pointer;\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n\n    &:focus {\n      background: none;\n    }\n  }\n\n  .eduzz-toolbar-user-label {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 0 ", "px;\n    height: ", "px;\n\n    ", " {\n      padding: 0 ", "px;\n    }\n\n    .eduzz-toolbar-avatar {\n      width: ", "px;\n      height: ", "px;\n      border-radius: 100%;\n      background: #fff;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: ", ";\n      font-weight: 600;\n      margin-right: ", "px;\n      font-size: 14px;\n      line-height: 0;\n      background-size: cover;\n      background-position: center;\n      background-repeat: no-repeat;\n\n      &::selection {\n        background: none;\n      }\n    }\n\n    .eduzz-toolbar-user-name {\n      font-size: 14px;\n      font-weight: 500;\n\n      ", " {\n        display: none;\n      }\n\n      &::selection {\n        background: none;\n      }\n    }\n\n    .eduzz-toolbar-user-menu-arrow {\n      margin-left: ", "px;\n      transition: ", ";\n\n      ", " {\n        margin-left: 0;\n      }\n\n      &.--open {\n        transform: rotate(-180deg);\n      }\n\n      span.houston-icon {\n        line-height: 0;\n        position: relative;\n        top: 2px;\n      }\n    }\n  }\n"], ["\n  position: relative;\n  z-index: 1100;\n\n  &.--has-menu {\n    cursor: pointer;\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n\n    &:focus {\n      background: none;\n    }\n  }\n\n  .eduzz-toolbar-user-label {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 0 ", "px;\n    height: ", "px;\n\n    ", " {\n      padding: 0 ", "px;\n    }\n\n    .eduzz-toolbar-avatar {\n      width: ", "px;\n      height: ", "px;\n      border-radius: 100%;\n      background: #fff;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: ", ";\n      font-weight: 600;\n      margin-right: ", "px;\n      font-size: 14px;\n      line-height: 0;\n      background-size: cover;\n      background-position: center;\n      background-repeat: no-repeat;\n\n      &::selection {\n        background: none;\n      }\n    }\n\n    .eduzz-toolbar-user-name {\n      font-size: 14px;\n      font-weight: 500;\n\n      ", " {\n        display: none;\n      }\n\n      &::selection {\n        background: none;\n      }\n    }\n\n    .eduzz-toolbar-user-menu-arrow {\n      margin-left: ", "px;\n      transition: ", ";\n\n      ", " {\n        margin-left: 0;\n      }\n\n      &.--open {\n        transform: rotate(-180deg);\n      }\n\n      span.houston-icon {\n        line-height: 0;\n        position: relative;\n        top: 2px;\n      }\n    }\n  }\n"])), function (_a) {
     var theme = _a.theme;
@@ -47,2 +47,8 @@ return theme.spacing(3);
     var theme = _a.theme;
+    return theme.breakpoints.mobile;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(2);
+}, function (_a) {
+    var theme = _a.theme;
     return theme.spacing(7);
@@ -49,0 +55,0 @@ }, function (_a) {

package.json

 {
   "name": "@eduzz/apps-toolbar-react",
-  "version": "1.1.5",
+  "version": "1.1.6",
   "private": false,
@@ -5,0 +5,0 @@ "author": "Eduzz Team",

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

123270

increased by2.06%

Lines of code

1801

increased by1.24%

No dependency changes