@sapui5/sap.ushell 1.124.1 → 1.125.0

package/src/main/js/sap/ushell/themes/sap_belize_base/ActionMode.less

@@ -0,0 +1,107 @@
+/* ========================================================== */
+/* CSS for "sap.ushell.components.homepage.ActionMode" (base) */
+/* ========================================================== */
+
+.sapUshellTileActionLayerDiv {
+  width: inherit;
+  height: inherit;
+  position: absolute;
+  z-index: 2;
+  border-radius: 0.25rem;
+}
+
+.sapUshellTileActionLayerDivSelected {
+  opacity: 1;
+  border-radius: 0;
+}
+
+.sapUshellTileActionIconDivBottom {
+  position: absolute;
+  left: 2px;
+  right: 0.25rem;
+  bottom: 0.125rem;
+  font-size: 1.5rem;
+  text-align: right;
+  background: transparent;
+  border-radius: @sapUiTileBorderCornerRadius;
+  height: 2rem;
+
+  .sapUshellTileActionIconDivBottomInnerDiv {
+    height: 100%;
+    position: relative;
+  }
+}
+
+html[dir=rtl] .sapUshellTileActionIconDivBottom {
+  text-align: left;
+}
+
+.sapUshellTileDeleteClickArea {
+  text-align: right;
+  vertical-align: middle;
+  height : 2rem;
+  width : 2rem;
+  margin-right: 1px;
+  position: absolute;
+  top: -0.375rem;
+  right: -0.375rem;
+  z-index: 1;
+}
+
+html[dir=rtl] .sapUshellTileDeleteClickArea {
+  text-align: left;
+}
+
+.sapUshellTileDeleteIconOuterClass {
+  display: inline-block;
+  box-sizing: border-box;
+  text-align: center;
+  border-radius: 50%;
+  border : 2px solid white;
+  cursor: pointer;
+  z-index: 1;
+  opacity: 1;
+  width: 1.375rem;
+  height: 1.375rem;
+}
+
+.sapUshellTileActionDivCenter {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  opacity: 0.7;
+  border-bottom-left-radius: @sapUiTileBorderCornerRadius;
+  border-bottom-right-radius: @sapUiTileBorderCornerRadius;
+}
+
+.sapUshellTileDeleteIconInnerClass {
+  font-size: 0.75rem;
+  line-height: 1.25rem;
+  cursor: pointer;
+  z-index: 1;
+  opacity: 1;
+  width: 100%;
+  height: 100%;
+  display: block;
+}
+
+.sapUshellVizInstanceEdit {
+  /* Hide more icon for GenericTile in Action mode - The vizInstance renders its own icon */
+  .sapMGTMoreIcon {
+    display: none !important;
+  }
+}
+
+html[dir=rtl] .sapUshellTileActionDivCenter {
+  text-align: left;
+}
+
+.sapUshellTileActionIconDivBottomInner {
+  margin-right: 1.2rem;
+  font-size: 1rem;
+  z-index: 1;
+  position: relative;
+  color: @sapUiButtonIconColor;
+}

package/src/main/js/sap/ushell/themes/sap_belize_base/AddBookmarkButton.less

@@ -0,0 +1,37 @@
+
+/* ============================================= */
+/* CSS for control sap.ushell/AddBookmarkButton.control theme base */
+/* ============================================= */
+
+.sapUshellAddBookmarkForm{
+    padding: 0.5rem;
+    #saveAsTileHBox, .sapUshellSaveAsTileHBox {
+        position: relative;
+        padding-top: 2rem;
+        padding-bottom: 2rem;
+        &:after {
+            content: " ";
+            position: absolute;
+            top:0;
+            left:0;
+            right: 0;
+            bottom: 0;
+        }
+    }
+    label ~ label {
+        padding-top: 0.5rem;
+    }
+
+    .sapMInputBase, .sapMSlt{
+        margin: 0;
+    }
+
+    .sapUshellTileBase {
+        position: relative;
+    }
+
+    .sapUshellTile {
+        float: none;
+        list-style-type: none;
+    }
+}

package/src/main/js/sap/ushell/themes/sap_belize_base/AnchorItem.less

@@ -0,0 +1,81 @@
+/* ============================================= */
+/* CSS for control sap.ushell/AnchorItem.control */
+/* ============================================= */
+
+.sapUshellAnchorItem {
+  display: inline-block;
+  padding-right: 2rem;
+  padding-left: 0.25rem;
+  box-sizing: border-box;
+  min-width: 5rem;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  user-select: none;
+
+  &.sapUshellShellHidden { display: none; }
+}
+
+.sapUshellAnchorItem:hover {
+  cursor: pointer;
+}
+
+.sapUshellAnchorItemSelected .sapUshellAnchorItemInner:not(.sapUshellAnchorInnerMarker) {
+  border-bottom: 2px solid @sapUiShellTextColor;
+}
+
+.sapUshellAnchorItemDropCollision {
+  border-bottom: 1px solid @sapUiShellTextColor;
+  border-top: 1px solid @sapUiShellTextColor;
+  border-left: 1px solid @sapUiShellTextColor;
+  border-right: 1px solid @sapUiShellTextColor;
+}
+
+.sapUshellAnchorItemInner {
+  font-size: 1.125rem;
+  line-height: 2.875rem;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+
+.sapUshellAnchorItemDisabled {
+  opacity: 0.5;
+  text-shadow: none;
+}
+
+
+.sap-tablet, .sap-desktop {
+  .sapUshellAnchorPopoverContainer {
+    max-height: 20rem;
+  }
+
+  .sapUshellAnchorItemsPopover {
+    .sapMList {
+      overflow: auto;
+      min-width: 10rem;
+      max-width: 40rem;
+      text-overflow: ellipsis;
+    }
+  }
+}
+
+.sap-phone {
+  .sapUshellAnchorItemsPopover {
+    .sapMBarMiddle .sapMBarPH {
+      position: absolute;
+      left: 1rem;
+    }
+  }
+
+  .sapMDialogSection {
+    overflow-y: auto;
+  }
+}
+
+@-webkit-keyframes slidetounlock {
+  0% { background-position: -7rem 0; }
+  100% { background-position: 1rem 0; }
+}

package/src/main/js/sap/ushell/themes/sap_belize_base/AnchorNavigationBar.less

@@ -0,0 +1,86 @@
+/* ==================================================================== */
+/* CSS for control "sap.ushell.ui.launchpad.AnchorNavigationBar" (base) */
+/* ==================================================================== */
+
+.sapUshellAnchorNavigationBar {
+  height: 3rem;
+  box-sizing: border-box;
+
+  &.sapMPageHeader::before {
+    border-top: none;
+  }
+}
+
+.sapUiMedia-StdExt-Phone .sapUshellAnchorNavigationBar { padding: 0 1rem; }
+.sapUiMedia-StdExt-Tablet .sapUshellAnchorNavigationBar,
+.sapUiMedia-StdExt-Desktop .sapUshellAnchorNavigationBar { padding: 0 2rem; }
+.sapUiMedia-StdExt-LargeDesktop .sapUshellAnchorNavigationBar { padding: 0 3rem; }
+
+.sapUshellAnchorNavigationBarInner {
+  position: relative;
+  display: flex;
+  height: 100%;
+  color: @sapUiShellTextColor;
+}
+
+.sapUshellAnchorNavigationBarItems {
+  display: inline-block;
+  white-space: nowrap;
+  width: 100%;
+  overflow: hidden;
+  height: 100%;
+}
+
+.sap-tablet .sapUshellAnchorNavigationBarItemsScroll {
+  overflow-x: auto;
+  overflow-y: hidden;
+  height: 100%;
+  width: 100%;
+  padding-bottom: 1.5rem;
+}
+
+.sapUshellAnchorNavigationBarItemsScroll {
+  outline: none;
+  padding: 0;
+  margin: 0;
+}
+
+.sapUshellAnchorNavigationBarItemsScroll {
+  outline: none;
+  padding: 0;
+}
+
+.sapUshellAnchorNavigationBar .sapUshellAnchorNavigationBarInner .sapMBtn {
+  height: 100%; // fixed height for all form factors
+}
+
+.sapUshellTabBarOverflowButton {
+  visibility: visible !important;
+}
+
+.sap-desktop {
+  .sapUshellAnchorRightOverFlowButton {
+    visibility: visible;
+  }
+  .sapUshellAnchorLeftOverFlowButton {
+    visibility: visible;
+  }
+}
+
+.sap-tablet {
+  .sapUshellAnchorRightOverFlowButton, .sapUshellAnchorLeftOverFlowButton {
+    visibility: visible;
+  }
+}
+
+.sapUshellAnchorNavigationBarInvisible {
+  display: none;
+}
+
+// TODO: refactor and remove !important
+#sapUshellAnchorBarOverflowPopover{
+  top: 5.85rem !important;
+}
+#sapUshellAnchorBarOverflowPopover-cont{
+  height: 100% !important;
+}

package/src/main/js/sap/ushell/themes/sap_belize_base/AppearanceView.less

@@ -0,0 +1,213 @@
+/* =================================================================================== */
+/* CSS for control "sap.ushell.components.shell.Settings.appearance.Appearance" (base) */
+/* =================================================================================== */
+
+.sapUshellAppearanceItemViewLeft {
+  margin-left: 2rem;
+  height: 5rem;
+  padding-top: 1rem;
+  padding-bottom: 1rem;
+}
+
+.sapUshellAppearanceItemViewRight {
+  position: absolute;
+  right: 0rem;
+  margin-top: 1.5rem;
+}
+
+.sapUshellBlueCrystalIconStyle {
+  background-image: -webkit-linear-gradient(top, #2ca9b2 0, #178299 100%);
+  background-image: linear-gradient(to top, #2ca9b2 0, #178299 100%);
+  background-image: -moz-linear-gradient(top, #2ca9b2 0, #178299 100%);
+  background-image: -o-linear-gradient(top, #2ca9b2 0, #178299 100%);
+  border-radius: 100%;
+}
+
+.sapUshellBaseIconStyle {
+  background-image: -webkit-linear-gradient(top, #a9c6de 0, #e7ecf0 100%);
+  background-image: linear-gradient(to top, #a9c6de 0, #e7ecf0 100%);
+  background-image: -moz-linear-gradient(top, #a9c6de 0, #e7ecf0 100%);
+  background-image: -o-linear-gradient(top, #a9c6de 0, #e7ecf0 100%);
+  border-radius: 100%;
+}
+
+.sapUshellHCBIconStyle,
+.sapUshellQuartzHCBIconStyle,
+.sapUshellHorizonHCBIconStyle {
+  background-image: -webkit-linear-gradient(top, #000000 0, #000000 100%);
+  background-image: linear-gradient(to top, #000000 0, #000000 100%);
+  background-image: -moz-linear-gradient(top, #000000 0, #000000 100%);
+  background-image: -o-linear-gradient(top, #000000 0, #000000 100%);
+  border-radius: 100%;
+}
+
+.sapUshellHCBIconStyleOnHCB {
+  border: 1px solid #FFFFFF;
+}
+
+.sapUshellHCWIconStyle,
+.sapUshellQuartzHCWIconStyle,
+.sapUshellHorizonHCWIconStyle {
+  background-image: -webkit-linear-gradient(top, #ffffff 0, #ffffff 100%);
+  background-image: linear-gradient(to top, #ffffff 0, #ffffff 100%);
+  background-image: -moz-linear-gradient(top, #ffffff 0, #ffffff 100%);
+  background-image: -o-linear-gradient(top, #ffffff 0, #ffffff 100%);
+  border-radius: 100%;
+}
+
+.sapUshellHCWIconStyleOnHCW {
+  border: 1px solid #000000;
+}
+
+.sapUshellDarkMode.sapUshellQuartzHCBIconStyle,
+.sapUshellDarkMode.sapUshellQuartzHCWIconStyle {
+  border: 1px solid #334558;
+  box-shadow: inset 0 0 2px #334558;
+  background: linear-gradient(135deg, #000 45%, #fff 55%);
+  border-radius: 100%;
+}
+
+.sapUshellDarkMode.sapUshellHorizonHCBIconStyle,
+.sapUshellDarkMode.sapUshellHorizonHCWIconStyle {
+  border: 1px solid #334558;
+  box-shadow: inset 0 0 2px #334558;
+  background: linear-gradient(135deg, #000 45%, #fff 55%);
+  border-radius: 100%;
+}
+
+.sapUshellBelizeIconStyle {
+  background-image: -webkit-linear-gradient(top, #a9c6de 0, #e7ecf0 100%);
+  background-image: linear-gradient(to top, #a9c6de 0, #e7ecf0 100%);
+  background-image: -moz-linear-gradient(top, #a9c6de 0, #e7ecf0 100%);
+  background-image: -o-linear-gradient(top, #a9c6de 0, #e7ecf0 100%);
+  border-radius: 100%;
+}
+
+.sapUshellPlusIconStyle {
+  background-image: -webkit-linear-gradient(top, #2c4e6c 0, #9ec7d8 100%);
+  background-image: linear-gradient(to top, #2c4e6c 0, #9ec7d8 100%);
+  background-image: -moz-linear-gradient(top, #2c4e6c 0, #9ec7d8 100%);
+  background-image: -o-linear-gradient(top, #2c4e6c 0, #9ec7d8 100%);
+  border-radius: 100%;
+}
+
+.sapUshellQuartzLightIconStyle {
+  background-color: white;
+  border-radius: 100%;
+  border: 1px solid #334558;
+  box-shadow: inset 0 0 4px #334558;
+}
+
+.sapUshellQuartzDarkIconStyle {
+  background-color: #334558;
+  border-radius: 100%;
+  border: 1px solid white;
+  box-shadow: inset 0 0 4px white;
+}
+
+.sapUshellDarkMode.sapUshellQuartzLightIconStyle,
+.sapUshellDarkMode.sapUshellQuartzDarkIconStyle {
+  border: 1px solid #334558;
+  box-shadow: inset 0 0 4px white;
+  background: linear-gradient(135deg, #334558 45%, #edeff0 55%);
+}
+
+.sapUshellHorizonLightIconStyle {
+  background-color: #EBF8FF;
+  border: 1px solid #758ca4;
+  box-shadow: inset 0 0 2px #758ca4;
+  border-radius: 100%;
+}
+
+.sapUshellHorizonDarkIconStyle {
+  background-color: #1D2D3E;
+  border: 1px solid #1D2D3E;
+  box-shadow: inset 0 0 2px #a9b4be;
+  border-radius: 100%;
+}
+
+.sapUshellDarkMode.sapUshellHorizonLightIconStyle,
+.sapUshellDarkMode.sapUshellHorizonDarkIconStyle {
+  border: 1px solid #1D2D3E;
+  box-shadow: inset 0 0 2px #1d2d3e;
+  background: linear-gradient(135deg, #1D2D3E 45%, #EBF8FF 55%);
+}
+
+.sapUshellAppearanceSelectedIcon {
+  position: absolute;
+  right: 1rem;
+}
+
+.sapUshellAppearanceIcon {
+  width: 3rem;
+  height: 3rem;
+}
+
+.sapUshellAppearanceBox {
+  padding: 1rem;
+}
+
+.sapUshellAppearanceLabel {
+  line-height: 3rem;
+  margin-right: 0.5rem;
+  white-space: normal;
+}
+
+.sapUiSizeCompact .sapUshellAppearanceLabel {
+  line-height: 1.875rem;
+}
+
+.sapUshellAppearanceDisplaySettingSection {
+  padding-top: 3rem;
+}
+
+.sapUshellAppearanceConfigBox {
+  padding-left: 2rem;
+}
+
+#userPrefThemeSelector .sapMFlexItem.sapUshellAppearanceFlexItemText {
+  align-self: center;
+}
+
+.sapUshellAppearanceAnimation {
+  padding-left: 4.8rem;
+}
+
+.sapUshellAppearanceContentDensityText .sapUshellFlpSettingsDescription,
+.sapUshellAppearanceTileSizeText .sapUshellFlpSettingsDescription {
+  border-top: solid 0.125rem #ebebeb;
+  margin-top: 1rem;
+  padding-top: 0.625rem;
+}
+
+.sap-phone .sapUshellAppearanceAnimation {
+  padding-left: 0;
+}
+
+#userPrefThemeSelector .sapMFlexItem {
+  padding-right: 1rem;
+}
+
+#userPrefThemeSelector .sapMLIBActionable .sapMText {
+  padding-top: 0.5rem;
+}
+
+.sapUshellAppearanceItemText {
+  padding-right: 1rem;
+}
+
+.sapUshellAppearanceCustomListItem {
+  border: none;
+}
+
+.sapUshellAppearanceCustomListItem:hover {
+  background-color: transparent;
+}
+
+.sapUshellAppearanceTable .sapMListTblHeaderCell {
+  background-color: transparent;
+}
+
+#userPrefThemeSelector--ObjectPageLayout-spacer {
+  background-color: transparent;
+}

package/src/main/js/sap/ushell/themes/sap_belize_base/ApplicationContainer.less

@@ -0,0 +1,37 @@
+/* ============================================= */
+/* CSS for control sap.ushell/ApplicationContainer.control theme base */
+/* ============================================= */
+@media (min-width: 80rem) {
+  .sapUiMedia-Std-Desktop .sapUShellApplicationContainer.sapUShellApplicationContainerLimitedWidth {
+    width: 80rem !important;
+    margin-right: auto;
+    margin-left: auto;
+    max-width: 100%;
+  }
+}
+
+@media (min-width: 106.4rem) {
+  .sapUiMedia-Std-Desktop .sapUShellApplicationContainer.sapUShellDockingContainer {
+    width: 80rem !important;
+    margin-right: auto;
+    margin-left: auto;
+    max-width: 100%;
+  }
+}
+
+.sapUShellApplicationContainer {
+  border: none;
+  display: block;
+  white-space: normal;
+}
+
+.sapUShellApplicationContainerShiftedIframe {
+}
+
+.sapUShellApplicationContainerIframeHidden {
+  position: absolute;
+  top: -99999px;
+  left: -99999px;
+  visibility: hidden;
+  pointer-events: none;
+}