9 Common CSS style case sharing

Base on customer requirement, the style could be changed flexible

For the current template only --> write in the code block

Only valid for all nodes of the current workflow --> written on the workflow basic settings - Custom page (CSS file)

Take effect on all system workflows-> write in application settings-global custom page (CSS file)

Note: if you write in a code block, you need to wrap a layer of style label, no need in CSS file

1 Detail add delete button to display on the left

scenarios: detail add delete button, always right display, how to achieve left display Insert style to code block :

<style>
.detailButtonDiv{float：left}
</style>

No label is required if edit in css file

.detailButtonDiv{float：left}

2 Image in cell align center, adaptive scaling

Scenario: inserts images in cell, always tiled from top left, how to center, how to scale adaptively

Minimum Version Requirements: KB900190901 Add custom attributes class identification to the cell where the picture is located:

imageCell

The cell width is larger than the picture size, aligen picture in centere, add below style:

.imageCell_swap{background-position：center}

The width of the cell is smaller than the size of the picture, image adaptive zoom display with cell, adding style:

.imageCell_swap{background-size：100%100%}

3 Control Browse button link color

Scenario: Browse button link color is not controlled by cell color, how to modify browse button link color

Option 1: KB900190901 or more required Access the following link through the sysadmin account, to start configuration, after opening the browse button link color completely take the cell set color

api/workflow/index/updateWfConfig?name=browser_color_controlByCell&value=1 (value parameter 0 closes ,1 turns on, default closes)

Option 2: No system version limitation

Add custom attributes class identification to the cell where the Browse button is located:

browserColorCell

Added style

.browserColorCell a{color：red! important}// force a link to the browse button to appear in red

4 Control the minimum width of the main table selection box field

Scenario: main table selection box field, minimum width requirement 100 px, when the selected item is only "yes / no ", how to reduce the width again Add a custom attribute class identification to the cell where the selection box is located:

selectCell

Added style

.selectCell .wea-select{min-width：50px! important}