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

Comparing version 1.1.6 to 1.1.7

components/Belt/index.js

@@ -37,3 +37,3 @@ "use strict";
 };
-exports.default = (0, styled_1.default)((0, react_1.memo)(Belt))(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  color: white;\n  height: ", "px;\n  display: flex;\n  align-items: center;\n  position: relative;\n  padding: 0 ", "px;\n\n  &.none {\n    display: none;\n  }\n\n  &.white {\n    background-color: ", ";\n    color: ", ";\n\n    & > .eduzz-toolbar-badge {\n      color: ", ";\n\n      & > svg > path {\n        fill: ", ";\n      }\n    }\n  }\n\n  &.red {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.orange {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.green {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.black {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.golden {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  .eduzz-toolbar-badge {\n    color: white;\n    display: flex;\n    align-items: center;\n\n    & > span {\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      max-width: 250px;\n      font-size: 14px;\n\n      ", " {\n        display: none;\n      }\n    }\n  }\n\n  .eduzz-toolbar-icon-elite {\n    height: 18px;\n    min-width: 43px;\n    margin-right: 4px;\n  }\n\n  .eduzz-toolbar-icon-avatar {\n    width: 30px;\n    height: 30px;\n  }\n"], ["\n  color: white;\n  height: ", "px;\n  display: flex;\n  align-items: center;\n  position: relative;\n  padding: 0 ", "px;\n\n  &.none {\n    display: none;\n  }\n\n  &.white {\n    background-color: ", ";\n    color: ", ";\n\n    & > .eduzz-toolbar-badge {\n      color: ", ";\n\n      & > svg > path {\n        fill: ", ";\n      }\n    }\n  }\n\n  &.red {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.orange {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.green {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.black {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.golden {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  .eduzz-toolbar-badge {\n    color: white;\n    display: flex;\n    align-items: center;\n\n    & > span {\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      max-width: 250px;\n      font-size: 14px;\n\n      ", " {\n        display: none;\n      }\n    }\n  }\n\n  .eduzz-toolbar-icon-elite {\n    height: 18px;\n    min-width: 43px;\n    margin-right: 4px;\n  }\n\n  .eduzz-toolbar-icon-avatar {\n    width: 30px;\n    height: 30px;\n  }\n"])), theme_1.TOOLBAR_HEIGHT, function (_a) {
+exports.default = (0, styled_1.default)((0, react_1.memo)(Belt))(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  color: white;\n  height: ", "px;\n  display: flex;\n  align-items: center;\n  position: relative;\n  padding: 0 ", "px;\n\n  ", " {\n    display: none;\n  }\n\n  &.none {\n    display: none;\n  }\n\n  &.white {\n    background-color: ", ";\n    color: ", ";\n\n    & > .eduzz-toolbar-badge {\n      color: ", ";\n\n      & > svg > path {\n        fill: ", ";\n      }\n    }\n  }\n\n  &.red {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.orange {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.green {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.black {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.golden {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  .eduzz-toolbar-badge {\n    color: white;\n    display: flex;\n    align-items: center;\n\n    & > span {\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      max-width: 250px;\n      font-size: 14px;\n\n      ", " {\n        display: none;\n      }\n    }\n  }\n\n  .eduzz-toolbar-icon-elite {\n    height: 18px;\n    min-width: 43px;\n    margin-right: 4px;\n  }\n\n  .eduzz-toolbar-icon-avatar {\n    width: 30px;\n    height: 30px;\n  }\n"], ["\n  color: white;\n  height: ", "px;\n  display: flex;\n  align-items: center;\n  position: relative;\n  padding: 0 ", "px;\n\n  ", " {\n    display: none;\n  }\n\n  &.none {\n    display: none;\n  }\n\n  &.white {\n    background-color: ", ";\n    color: ", ";\n\n    & > .eduzz-toolbar-badge {\n      color: ", ";\n\n      & > svg > path {\n        fill: ", ";\n      }\n    }\n  }\n\n  &.red {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.orange {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.green {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.black {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.golden {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  .eduzz-toolbar-badge {\n    color: white;\n    display: flex;\n    align-items: center;\n\n    & > span {\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      max-width: 250px;\n      font-size: 14px;\n\n      ", " {\n        display: none;\n      }\n    }\n  }\n\n  .eduzz-toolbar-icon-elite {\n    height: 18px;\n    min-width: 43px;\n    margin-right: 4px;\n  }\n\n  .eduzz-toolbar-icon-avatar {\n    width: 30px;\n    height: 30px;\n  }\n"])), theme_1.TOOLBAR_HEIGHT, function (_a) {
     var theme = _a.theme;
@@ -43,2 +43,5 @@ return theme.spacing(3);
     var theme = _a.theme;
+    return theme.breakpoints.mobile;
+}, function (_a) {
+    var theme = _a.theme;
     return theme.colors.belts.white;
@@ -45,0 +48,0 @@ }, function (_a) {

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    ", " {\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) {
+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\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\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;
@@ -16,0 +16,0 @@ return theme.spacing(3);

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    ", " {\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) {
+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        display: none;\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        display: none;\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;
@@ -44,0 +44,0 @@ return theme.spacing(3);

package.json

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

No alert changes

Improved metrics

Total package byte prevSize

123286

increased by0.01%

Lines of code

1804

increased by0.17%

No dependency changes