Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Adjust margin for multi select tiles #34025

Merged
merged 7 commits into from
Jan 31, 2024
Merged

Adjust margin for multi select tiles #34025

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
1763be3
increase margin for multi select
MartinRiese Jan 23, 2024
529fb76
typo fix
MartinRiese Jan 24, 2024
18b02f4
Adjust margin only for multi select
MartinRiese Jan 24, 2024
18752fb
Merge branch 'master' into riese/multi-select-margin
MartinRiese Jan 31, 2024
fec3360
Add margin back in for single select case
MartinRiese Jan 31, 2024
922a696
Merge branch 'master' into riese/multi-select-margin
MartinRiese Jan 31, 2024
709b9b6
Add case for persistent tiles
MartinRiese Jan 31, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 5 additions & 4 deletions corehq/apps/cloudcare/static/cloudcare/js/formplayer/menus/views.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -180,7 +180,7 @@ hqDefine("cloudcare/js/formplayer/menus/views", function () {

// Dynamically generate the CSS style for the grid polyfill to use for the case tile
// useUniformUnits - true if the grid's cells should have the same height as width
const buildCellGridStyle = function (numRows, numColumns, useUniformUnits, prefix) {
const buildCellGridStyle = function (numRows, numColumns, useUniformUnits, prefix, isMultiSelect) {
let heightString;

if (useUniformUnits) {
Expand All @@ -195,6 +195,7 @@ hqDefine("cloudcare/js/formplayer/menus/views", function () {
numColumns: numColumns,
heightString: heightString,
prefix: prefix,
isMultiSelect: isMultiSelect,
};
const templateString = $("#cell-grid-style-template").html();
const template = _.template(templateString);
Expand Down Expand Up @@ -486,7 +487,7 @@ hqDefine("cloudcare/js/formplayer/menus/views", function () {
const useUniformUnits = options.useUniformUnits;

const caseTileStyles = buildCaseTileStyles(options.tiles, options.styles, numRows, numColumns,
numEntitiesPerRow, useUniformUnits, 'list');
numEntitiesPerRow, useUniformUnits, 'list', options.isMultiSelect);

const gridPolyfillPath = FormplayerFrontend.getChannel().request('gridPolyfillPath');

Expand Down Expand Up @@ -1095,10 +1096,10 @@ hqDefine("cloudcare/js/formplayer/menus/views", function () {
// - shape and size of the tile's layout grid
// - the tile's visual style and its outer boundary
// - layout of the case tiles on the outer, visible grid
const buildCaseTileStyles = function (tiles, styles, numRows, numColumns, numEntitiesPerRow, useUniformUnits, prefix) {
const buildCaseTileStyles = function (tiles, styles, numRows, numColumns, numEntitiesPerRow, useUniformUnits, prefix, isMultiSelect) {
const caseTileStyles = {};
caseTileStyles.cellLayoutStyle = buildCellLayout(tiles, styles, prefix);
caseTileStyles.cellGridStyle = buildCellGridStyle(numRows, numColumns, useUniformUnits, prefix);
caseTileStyles.cellGridStyle = buildCellGridStyle(numRows, numColumns, useUniformUnits, prefix, isMultiSelect);
if (numEntitiesPerRow > 1) {
caseTileStyles.cellContainerStyle = buildCellContainerStyle(numEntitiesPerRow);
caseTileStyles.cellWrapperStyle = $("#cell-wrapper-style-template");
Expand Down
8 changes: 7 additions & 1 deletion corehq/apps/cloudcare/templates/formplayer/case_list.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -289,7 +289,13 @@ <h1 aria-label="<%- title %>" tabindex="0" class="page-title"><%- title %></h1>
background-color: transparent;
color: #685c53;
justify-items: left;
padding: 20px 20px 10px 20px;
<% if (model.prefix === "persistent") { %>
margin: 20px 20px 10px 20px;
<% } else if (model.isMultiSelect) { %>
margin: 10px 30px 0 10px;
<% } else { %>
margin: 10px 20px 0 20px;
<% } %>
}
</script>

Expand Down
3 changes: 1 addition & 2 deletions corehq/apps/hqwebapp/static/cloudcare/less/formplayer-webapp/content.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,8 +76,7 @@ body {
}

.select-row-checkbox-div {
padding-top: 10px;
padding-left: 10px;
margin: 10px 10px 10px 10px;
float: left;
}

Expand Down
4 changes: 2 additions & 2 deletions corehq/toggles/__init__.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1031,11 +1031,11 @@ def _ensure_valid_randomness(randomness):

GEOCODER_USER_PROXIMITY = StaticToggle(
"geocoder_user_proximity",
"USH: Adjust geo coder result to be more relevant to user and project.",
"USH: Adjust geocoder result to be more relevant to user and project.",
TAG_CUSTOM,
namespaces=[NAMESPACE_DOMAIN],
description="""
This has two effects on getting geo coder search results:
This has two effects on getting geocoder search results:
1. Based on the bounding box of the project default location all result falling outside of it
will be filtered out when used in the case search.
2. Proximity to the users location will be taken into account for the results order.
Expand Down
Loading