Settings Menu Malfunctions in Flowtime When Upgrading from Cora SeQuence v8.3 to v8.4 or v8.5

Description

When you upgrade from Cora SeQuence v8.3 to v8.4 or v8.5 with the old Flowtime portal that contains custom CSS, the Settings menu options display outside of the drop-down menu. Custom CSS refers to a case that you copied the original Sequence8 theme and changed the folder name and the Theme key in the web.config file.

Cause

The portal Theme requires special keys.

Affected Versions

v8.4-8.5

Solution

Add the following code to the bottom of the Portal.min.css file, located in SharedResources\Themes\CustomTheme\Flowtime in Portal.css.

.sqpt-header-container .sqpt-header .sqpt-user .sqpt-dropdown-container .sqpt-dropdown {
  position: relative;
}
.sqpt-header-container .sqpt-header .sqpt-user .sqpt-dropdown-container .sqpt-dropdown:after {
  content: "▼";
  position: absolute;
  right: 5px;
  font-size: 60%;
  line-height: 24px;
  color: white;
}
.sqpt-header-container .sqpt-header .sqpt-user .sqpt-dropdown-container .sqpt-dropdown:hover .sqpt-dropdown-content {
  display: block;
}
.sqpt-header-container .sqpt-header .sqpt-user .sqpt-dropdown-container .sqpt-dropdown .sqpt-dropdown-content {
  display: none;
  position: absolute;
  background-color: #FFFFFF;
  min-width: 160px;
  top: 30px;
  border: 1px solid #dcdce0;
  z-index: 1;
  border-radius: 1px;
  right: 1px;
}
.sqpt-header-container .sqpt-header .sqpt-user .sqpt-dropdown-container .sqpt-dropdown .sqpt-dropdown-content a {
  color: black;
  padding-top: 4px;
  padding-bottom: 6px;
  padding-left: 10px;
  padding-right: 10px;
  text-decoration: none;
  display: block;
  text-align: left;
}
.sqpt-header-container .sqpt-header .sqpt-user .sqpt-dropdown-container .sqpt-dropdown .sqpt-dropdown-content a:hover {
  background-color: #d4eaf5;
}
.sqpt-header-container .sqpt-header .sqpt-user .sqpt-dropdown-container .sqpt-dropdown.sqpt-user-menu {
  margin-top: 10px;
}
.sqpt-header-container .sqpt-header .sqpt-user .sqpt-dropdown-container .sqpt-dropdown.sqpt-user-menu:after {
  content: " ";
}
.sqpt-header-container .sqpt-header .sqpt-user .sqpt-user-settings {
  background-image: url("../../../images/Portal/settings.png");
  background-repeat: no-repeat;
  width: 21px;
  height: 21px;
  margin: 0px 10px 0px 10px;
  cursor: pointer;
  padding-bottom: 10px;
}
.sqpt-header-container .sqpt-header .sqpt-user .sqpt-user-settings:hover {
  opacity: 0.8;
}
.sqpt-header-container .sqpt-header .sqpt-user .sqpt-username {
  margin: 0 20px 0 0;
  padding-bottom: 10px;
  cursor: default;
}