K2BFlat Compact Theme

Introduction

K2BFlat Compact themes were introduced in K2BTools 8.0.14 in order to have themes in responsive web design that uses less space.

This theme has four variations: K2BFlatCompact (orange), K2BFlatCompactBlue, K2BFlatCompactBordeaux, K2BFlatCompactGreen. The difference between these versions is the key color used.

 

K2BFlatVersions
K2B Flat Versions

 

This page contains the history of these themes so that a manual update can be made when upgrading a KB from one version of K2BTools to a newer one.

When using the stock theme provided by K2BTools with no modifications, the download links corresponding to the version can be used to upgrade automatically. In this case, please import the XML file using the "Theme Import Behavior" set to "Overwrite".

K2BFlatImport
K2B Flat Import

 

 

 

K2BTools 11.1

K2BFlatCompact_11.1GX15

New Classes

Type Name Changes
Custom

.K2BToolsTable_ComponentContainer .K2BToolsTable_RoundedBorder
  1. border-stype:none

 

K2BTools 11

K2BFlatCompact_11.0GX15

New Classes

Type Name Changes
Table

K2BToolsImage_ComponentIcon
  1. height:25px
Table K2BToolsTable_LinkListContainer
  1. margin-top:15px
  2. margin-left:15px
  3. margin-bottom:15px
  4. margin-right:15px
Custom K2BToolsTable_ComponentContainer.Table_Basic_Widht100Percent.K2BToolsTable_ComponentTitleWithIcon td:first-child
  1. width:auto
Custom K2BToolsTable_GridSettingsContent td:last-child .gx-attribute
  1. float:right

Changelog

 

Type Name Changes
Image Image_Action
  1. margin-top:0px
  2. margin-bottom:1px
Table WWOrderByLabel
  1. background-image:OrderBy
Calendar Calendar
  1. custom-properties
    1. z-index:200 !important
ErrorViewer gx-error-message
  1. background-image:ErrorIcon

 

K2BTools 10.4.0

K2BFlatCompact_10.4.0GX15

New Classes

Type Name Changes
Table

K2BToolsTable_ComponentContainer
  1. border-color:K2BToolsBorder
  2. border-style:solid
  3. border-width:1px
  4. top-left-radious:2px
  5. top-right-radious:2px
  6. bottom-left-radious:2px
  7. bottom-right-radious:2px
  8. margin-bottom:8px
Table K2BToolsTable_CollapsedComponentContainer (?)
  1. custom-properties
    1. border-bottom:none;
Table K2BToolsTable_ModalWindow_Inner
  1. max-height:80vh
  2. custom-properties
    1. overflow-y:auto
    2. overflow-x:hidden
Table K2BToolsTable_LoadingMessageContainer
  1. font-size:24px
  2. font-family: SourceSansPro-Bold
  3. height:199px
  4. width:100%
  5. text-align:center
Table K2BToolsTable_ModalWindow
  1. padding-top:5px
  2. padding-left:5px
  3. padding-bottom:5px
  4. padding-right:5px
  5. background-color:#FFF
  6. top-left-radius:5px
  7. top-right-radius:5px
  8. bottom-left-radius:5px
  9. bottom-right-radius:5px
  10. max-width:90vw
  11. min-width:50%
  12. custom-properties
    1. margin:0 auto;
Table Table_Condition
  1. forecolor:#009688
Custom Class K2BToolsTable_CollapsedComponentContainer > .row:nth-child(2)
  1. display:none
Custom Class K2BToolsTable_ComponentContainer .Table_Basic_Widht100Percent td:first-child
  1. width:100%
Custom Class K2BToolsTable_ModalWindow .PopupHeaderButton
  1. margin-right:15px
Custom Class .K2BToolsTable_ModalWindow .PopupTitle
  1. Cursor:default
Custom Class K2BToolsTable_ComponentContainer .TextBlock_Subtitle A
  1. font-size:22px:
  2. text-decoration:none;
  3. FontFamily:"SourceSansPro-Regular"
    1. Forecolor:"#333"
Custom Class K2BToolsTable_ComponentContainer .TextBlock_Subtitle
  1. Margin-Top:0px
  2. Margin-Left:8px
Custom Class K2BToolsTable_ComponentContainer > .row:first-child
  1. background-color:#EEEBEB
  2. border-bottom:1px solid
  3. border-botom-color: K2BToolsBorder
  4. margin-top: 0px
  5. margin-left: 0px
  6. margin-bottom:0px
  7. margin-right:0px
  8. overflow:hidden

Changelog

 

Type Name Changes
Table K2BToolsTable_MainContentTable
  1. padding-right:15px
Section Section_Grid
  1. margin-right:-15px
  2. padding-right:15px
  3. custom-properties
    1. overflow-x:auto
Table Table_ConditionalConfirm
  1. Custom-Properties
    1. x-index:100
TextBlock WWOrderByLabel
  1. Background-image:"OrderBy"
Custom Class A.change-action
  1. z-index:2;
Custom Class .ErrorViewerBullet.gx-error-message
  1. background-image:ErrorIcon
Custom Class .ErrorViewerBullet.gx-warning-message
  1. Background-Image:"ErrorIcon"

K2BTools 10.3.0

K2BFlatCompact_10.2.0Evo3

K2BFlatCompact_10.3.0GX15

New Classes(GX15 only)

Type Name Changes
GridColumn

Column_BlueWithBackground
  1. background-color:#E3F2FD
GridColumn Column_GreenWithBackground
  1. background-color:#E0F2F1
GridColumn Column_RedWithBackground
  1. background-color: #FFEBEE
GridColumn Column_YellowWithBackground
  1. background-color: #FFFDE7
Custom Class Column_BlueWithBackground > p > span, .Column_Blue > p > span
  1. forecolor: #2196F3
Custom Class Column_GreenWithBackground > p > span, .Column_Green > p > span
  1. forecolor:#009688
Custom Class Column_RedWithBackground > p > span, .Column_Red > p > span
  1. forecolor:#F44336
Custom Class Column_YellowWithBackground > p > span, .Column_Yellow > p > span
  1. forecolor:#F9A825
Custom Class TextBlock_LineSeparatorClose > a, .TextBlock_LineSeparatorOpen > a
  1. padding-left:28px
  2. font-size:18px
  3. text-decoration:none
  4. font-family:SourceSansPro-Bold
  5. forecolor:#666

K2BTools 10.2.0

 

K2BFlatCompact_10.2.0Evo3

K2BFlatCompact_10.2.0GX15

ChangeLog(GX15 only)

Type Name Changes
Attribute PromptAdvancedBarCell (Extra small)
  1. Position:absolute
  2. Top:0px
Switch Switch
  1. Switch-On-Background-color:#E7722B
  2. Switch-Off-Backgrond-Color:#E1DDD7
  3. forecolor:#666
Table K2BToolsTableCell_ActionContainer
  1. Height:50px;
Label WWOrderByLabel
  1. Background-Image:OrderBy
Custom Class gx-error-message
  1. Backgrond-Image="ErrorIcon"
CustomClass gx-warning-message
  1. BackgroundImage:WarningIcon

New Classes (GX15 only)

Type Name Changes
Custom Class bootstrap-switch-focused
  1. CustomProperties
    1. border-color:#bb4917 !important
    2. box-shadow:0 1px 1px rgba(0,0,0,.075) inset, 0 0 6px #e7722b !important;"

 

 

 

Changelog (GXEv3 and GX15)

 

Type Name Changes
Attribute K2BToolsEnchancedCombo
  1. Height:auto;
GridColumn K2BToolsCheckBoxColumn
  1. PaddingTop:1px
  2. PaddingRight:5px
  3. PaddingBottom:1px
  4. PaddingLeft:15px;
    1. CustomProperties:"width:48px !important;
Image Image_Action
  1. Margin-Top:5px
Section K2BToolsTable_GridSettingsContainer
  1. Padding-Bottom: 7px;
  2. Padding-Top: 7px;
  3. Padding-Left: 0px
  4. Padding-Right:0px;
Section K2BToolsTable_MyAccountContainer
  1. Padding-Bottom: 7px;
  2. Padding-Top: 7px;
  3. Padding-Left: 0px
  4. Padding-Right:0px;
Section K2BToolsMyAccountTable
  1. Margin-Left:15px;
Table K2BToolsTable_GridSettings

 

  1. Left: set value to default
  2. width: set value to default
Table K2BToolsTableCell_ActionsContainer
  • Height:50px

New Classes (GXEv3 and GX15)

Type Name

Properties
Attribute K2BTools_CheckAllGrid
  1. Left:16px;
  2. Position:absolute;
  3. Top:15px;
Table K2BToolsCell_CheckboxFreeStyle
  1. PaddingTop: 1px;
  2. PaddingRight:5px;
  3. PaddingBottom:1px;
  4. PaddingLeft:15px;
  5. Width:48px;
  6. VerticalAlign:Top;
Table K2BToolsTable_GridContainer
  1. Width:100%
  2. CustomProperties: border-collapse:collapse;
Custom Class GridColumnAscending >*::after
  1. Custom Properties
    1. content:"   ▲"
Custom Class GridColumnDescending >*::after
  1. Custom Properties
    1. content: "   ▼""
Custom Class K2BToolsSection_PromptImageAndFieldContainerFocus A
  1. Border-Color="#BB4917"
  2. Border Style="solid"
  3. Border Width="1px"
  4. Custom Properties:
    1. "outline:0 none; box-shadow:0 1px 1px rgba(0,0,0,.075) inset, 0 0 6px #e7722b;"
Custom Class K2BToolsSection_PromptImageContainer A
  1. padding-top: 5px
  2. padding-bottom:5px;
  3. FontSize: 14px
Custom Class K2BToolsTable_GridContainer > tbody > tr > td
  1. Width:0px
  2. VerticalAlign:top
  3. Custom Properties:
    1. padding:0px !important;"
Custom Class K2BToolsTextBlock_GridSettingsTitle > a
  1. Padding-Top:7px
  2. Padding-Right:16px
  3. Padding-Bottom:6px
  4. Padding-Left:16px
Custom Class K2BToolsTextBlock_MyAccount > a
  1. Padding-Top:7px
  2. Padding-Right:16px
  3. Padding-Bottom:6px
  4. Padding-Left:16px
Custom Class TH.K2BToolsSortableColumn:hover
  1. Background-color:#D9D5CF
  2. Custom Properties
    1. "cursor: pointer;"
Custom Class K2BToolsMultipleSelectionButtons > div > div
  1. TextAlign="center"

K2BTools 10.1.0

Download

 

K2BFlatCompact_10.1.0Evo3

K2BFlatCompact_10.1.0GX15

 

Changelog

 

Type Name Changes
Attribute Table_ConditionalConfirm
  1. z-index:700

New Classes

Type Name

Properties
Attribute K2BToolsSimpleImageListImage
  1. Height:auto
  2. Width:200px
Attribute K2BToolsSimpleImageListText
  1. FontWeight:bold
  2. FontSize:16px;
  3. ForeColor:#333
Attribute K2BToolsSimpleImageListSecondaryAttributesTable
  1. margin-left:20px
  2. width:230px
Attribute K2BToolsSimpleImageListTable
  1. margin-top:20px
  2. margin-left:20px
  3. padding-right:20px
  4. padding-bottom:20px
  5. padding-left:20px
  6. background-color:#F3F3F3
  7. Height:230px
  8. Width:230px

 

K2BTools 10.0.4 (GX15 Only)

K2BFlatCompact_10.0.4GX15

Changelog

Type Name Changes
Section PromptAdvancedBarCell
  1. position:relative
  2. top:-76px
  3. background-color: transparent

K2BTools 10.0.0

Download

 

K2BFlatCompact Evo3

Changelog

 

Type Name Changes
Attribute K2BTools_SearchResultImage
  1. margin-top:0px
  2. margin-right: 0px
  3. margin-bottom: 0px
  4. margin-left: 0px
  5. Custom-properties: object-fit:conver;
Attribute

ReadonlyK2BTools_SearchResultImage
  1. width:100%
Buttom K2BToolsButton_FlatAction
  • font-size: 14px
FreeStyleGrid K2BTools_SearchGrid
  1. padding-right: 3px
  2. padding-top: 3px;
  3. padding-bottom: ""
    1. padding-left: 3px
Messages ErrorMessages
  • padding-top:2px
  • padding-right:2px
  • padding-bottom:2px
  • padding-left:2px
  • font-size:12px
Section PromptAdvancedBarCellCompact(extra small)
  • Delete all properties.
Section K2BToolsMenuContainerInvisibleCompact (extra small)
  • Delete all properties
Section K2BToolsMenuContainerVisibleCompact
  • Delete all properties
Section K2BToolsSection_Card
  1. margin-top:0px
  2. margin-rigth:-5px
  3. margin-left:-5px
  4. Height:""
  5. min-height:210px
  6. width:""
Section  
  1. Set property position to default value.
Table  
  1. min-width:30px
    1. Set property width to default value.
Custom Class  
  1. background-color: #F4EFEA

New Classes

Type Name

Properties
Attribute AttributeInMultipleCombo_Filter
  1. Position:absolute;
  2. Top:11px;
Attribute K2BTools_FilterAttributeInCombo
  1. width:150px;
Attribute K2BToolsAttribute_BorderlessFilter
  1. background-color:transparent;
  2. border-style:none;
  3. height: auto
  4. width: 100px
  5. Custom-properties: "box-shadow: none; height: 19px !important;"
Attribute K2BToolsAttribute_BorderlessFilter(ExtraSmall)
  1. Width: 90px
Attribute K2BToolsAttribute_Invisible
  1. display:none;
Attribute K2BToolsAttribute_TagDescription
  1. position:relative;
  2. top:-3px;
Image Image_Action_OnSectionHover
  1. visibility:hidden
  2. custom-properties:
    1. opacity: 0;
    2.  transition: visibility 0s linear 0s, opacity 400ms;
Image K2BToolsTwoPane_Action
  1. margin-right: 6px
Image K2BToolsTagAction_Remove
  1. width:12px
Section K2BToolsTable_MultipleComboContainer
  1. background-color: white
  2. border-top-color:K2BToolsBorder
  3. border-right-color:K2BToolsBorder
  4. border-left-color: K2BToolsBorder
  5. border-bottom-color:K2BToolsBorder
  6. border-style:solid
  7. bordre-widht:1px
  8. top-left-radius:4px
  9. bottom-left-radius:4px
  10. bottom-right-radious:4px;
  11. bottom-top-radious: 4px;
  12. margin-top:2px
  13. padding-top:""
  14. padding-right: 8px
  15. padding-bottom:""
  16. padding-left:8px
  17. position:relative
  18. z-index:2
  19. whitespace:nowrap
  20. fontstyle:normal
  21. fontsize:11pt
  22. fontfamily:SourceSansPro-Semibold
  23. forecolor:#333
  24. custom-properties: text-decoration:none;
Section K2BToolsTable_RightBorder
  1. custom-properties:"border-right:1px solid #cccccc; border-top:0px;"
Section K2BToolsMultipleFilterListContainer
  1. horizontal: 4px
  2. vertical: 3px
  3. blur:3px
  4. spred:""
  5. color:#3333334"
  6. Inset:""
  7. Left:-6px
  8. position:absolute
  9. top:1px
  10. z-index:5
  11. background-color:#fff
  12. border-top-color:#ccc
  13. border-bottom-color: #ccc
  14. border-left-color:#ccc
  15. border-right-color:#ccc
  16. border-style:solid
  17. border-widht:1px
  18. width:150px
Section K2BToolsSection_SquareCard
  1. overflow:hidden
  2. padding-top:0px
  3. padding-bottom:0px
  4. padding-right:0px
  5. padding-left:0px
Section K2BToolsSecton_CompactCard
  1. margin-bottom:5px
  2. background-color:#fff
  3. border-top-color:#ccc
  4. border-bottom-color:#ccc
  5. border-left-color:#ccc
  6. border-right-color:#ccc
  7. border-style:solid
  8. border-width:1px
Section K2BToolsSection_VerticalCard
  1. margin-top:5px
  2. margin-rigth:5px
  3. margin-bottom:5px
  4. margin-left:5px
  5. background-color:#fff
  6. border-top-color:#ccc
  7. border-right-color:#ccc
  8. border-bottom-color:#ccc
  9. border-left-color:#ccc
  10. border-style:solid
  11. border-width:1px
Table K2BToolsTable_FieldBorder
  1. horizontal:"0px"
  2. vertical:1px;
  3. blur:1px
  4. spread:""
  5. color:#00000013
  6. inset:inset
  7. padding-right:5px
  8. position:relative
  9. top:2px
  10. border-top-color:#ccc
  11. border-right-color:#ccc
  12. border-bottom-color:#ccc
  13. border-left-color:#ccc
  14. border-style:solid
  15. border-width:1px
  16. top-left-radius:1px
  17. bottom-left-radius:1px
  18. bottom-right-radious:1px
  19. height:24px
  20. custom-properties:
    1. width:auto !important;
    2. border-spacing:0px
Table K2BtoolsTable_FieldBorderFocus
  1. Custom-properties: "box-shadow: 0 1px 1px rgba(0,0,0,.075) inset,0 0 6px #e7722b !important; border-bottom-color:#bb4917 !important; border-left-color:#bb4917 !important; border-right-color: #bb4917 !important; border-top-color:#bb4917 !important;"
Table

K2BToolsTable_FilterTag
  1. margin-top:2px;
  2. margin-rigth:2px
  3. margin-bottom:2px
  4. margin-left:2px
  5. overflow:hidden
  6. display:block
  7. whitespace:nowrap
  8. background-color:#EEEBEB"
  9. border-color:#EEEBEB"
  10. border-style:solid
  11. border-width:1px
  12. radius:4px
  13. width:110px
  14. text-overflow:ellipsis
  15. Custom Properties="border-collapse: separate !important;"
Table K2BToolsTable_FilterTag(ExtraSmall)
  1. width:100px;
Table

K2BToolsTable_GreyBackground
  1. background-color:#EEEBEB
  2. border-color:#ccc
  3. border-style:solid
  4. border-width:1px
  5. radius:4px;
Table K2BToolsTable_MultipleComboMainTable
  1. custom-properties:"border-collapse: collapse;"
Table K2BToolsTable_MultipleFilterContainer
  1. width:100%
  2. text-align:left
Table K2BToolsTwoPaneNoItemSelectedTable
  1. border-style:none;
Table K2BToolsTable_PhotoCardContent
  1. min-height:210px; 
  2. width:100%
Table K2BToolsTable_TwoPaneActionsContainer
  1. float:right;
  2. custom-properties: "border-collapse:collapse;"
Table K2BToolsTable_TwoPaneActionsFixedSize
  • float:right
  • min-height:49px
  • custom-properties: "border-collapse: collapse";
Table K2BToolsTable_TwoPaneContainer
  • padding-left:14px
  • margin-left:4px
  • padding-top:10px
  • padding-right:""
  • padding-bottom:10px
  • border-radius:4px
  • custom-properties: "border-top:1px solid #cccccc; border-bottom:1px solid #cccccc; border-left:1px solid #cccccc; border-right:1px solid #cccccc;"
Table K2BToolsTable_TwoPaneActonsFixedSize
  • float:right
  • min-height:49px
  • custom-properties: "border-collapse: collapse";
Table K2BToolsTable_TwoPaneContainer
  • margin-left:-15px
  • padding-top: 10px
  • padding-right:14px
  • padding-bottom:10px
  • padding-left:14px;
  • radius:4px
  • Custom Properties:"border-top:1px solid #cccccc; border-bottom:1px solid #cccccc; border-left:1px solid #cccccc; border-right:1px solid #cccccc;"
TextBlock K2BTools_MoreInformationText
  • float:right
  • margin-right:15px
TextBlock K2BToolsTextBlock_MultipleComboTitle
  • Custom Properties="text-decoration:none;
TextBlock K2BToolsTwoPaneNoItemSelectedText
  • font-size:20px
  • font-family: SourceSansPro-Bold
  • Forecolor="#A1A1A1"
  • text-align:center
TextBlock TextBlock_Subtitle
  • font-size:20px
TextBlock TextBlock_Subtitle(extra-small)
  • font-size:16px
Custom Class gx-grid
  • custom-properties:""
Custom Class K2BToolsAttribute_BorderlessFilter:focus
  • border-style:none;
  • custom-properties: "outline:none; box-shadow:none;"
Custom Class K2BToolsAttribute_TagDescription A
  • font-size:15px;
  • forecolor:#666
  • custom-properties:text-decoration:initial;
Custom Class K2BToolsTableMultipleFilterListContainer .gxgrid
  • border-style:none;
  • margin-top:0px
  • margin-rigth:0px
  • margin-bottom:0px
  • margin-left:0px
  • max-height:300px
  • custom-properties: overflow-x:hidden;
Custom Class K2BToolsTableMultipleFilterListContainer Table
  • custom-properties:border-collapse:collapse;
Custom Class K2BToolsTable_FieldBorder Table
  • padding-top:0px
  • padding-right:10px
  • padding-bottom:0px
  • padding-left:5px
Custom Class K2BToolsTable_FieldBorder TD
  • padding-top: 0px
  • padding-right: 0px
  • padding-bottom:0px
  • padding-left:0px
  • custom-properties: border-collapse:collapse;  
Custom Class K2BToolsTable_FilterTag .form-control-static
  • padding: 0px
  • min-height:0px
Custom Class K2BToolsTable_FilterTag .gx-tab-padding-fix-1
  • paddign-top:0px
  • padding-right:2px
  • padding-bottom:0px
  • padding-left:0px
Custom Class K2BToolsTable_MultipleComboContainer:focus
  • border-color:#BBB"
  • Custom Properties="outline:none; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 6px #ccc;"
Custom Class K2BToolsTable_MultipleComboContainer:hover
  • custom-properties: "background: #ffffff; background: -moz-linear-gradient(top, #ffffff 0%, #efefef 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#efefef)); background: -webkit-linear-gradient(top, #ffffff 0%,#efefef 100%); background: -o-linear-gradient(top, #ffffff 0%,#efefef 100%); background: -ms-linear-gradient(top, #ffffff 0%,#efefef 100%); background: linear-gradient(to bottom, #ffffff 0%,#efefef 100%); -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#efefef',GradientType=0 )"
Custom Class K2BToolsTable_MultipleFilterContainer .FreeStyleGrid
  • overflow:hidden
  • custom-properties: "border-collapse: collapse;border-spacing: 0;";
Custom Class K2BToolsTable_MultipleFilterContainer .gx-grid
  • border-style:none
  • margin: 0px
  • max-height:300px
Custom Class K2BToolsTextBlock_MultipleComboTitle > a
  • font-size:12px
  • font-family:SourceSansPro-Semibold
  • fore-color:#333
  • custom-properties: text-decoration:none; color: #333 !important;

K2BTools 8.3.0

Download

K2BFlatCompact_8.3.0

Changelog

Type Name Changes
Attribute CheckBoxInGrid
  1. custom-properties:
    1. padding-left:0px !important;
Attribute Attribute
  1. font-size:12px
  2. reset max-height
Attribute ReadonlyAttribute_Trn
  1. position:relative;
  2. top:1px;
Attribute ReadonlyAttribute_TrnDate
  1. position:relative;
  2. top:2px;
Attribute ReadonlyAttribute_TrnDateTime
  1. position:relative;
  2. top:2px;
Attribute ReadonlyAttribute_FixedData
  1. position:relative;
  2. top:4px;
Attribute ReadonlyAttribute_Image_Grid
  1. max-height=30px;
Attribute Attribute_Trn
  1. FontSize="10pt";
  2. FontFamily="SourceSansPro-Regular"
Attribute ReadonlyAttribute_Trn
  1. Top:1px;
TextBlock Label
  1. Top: 2px;
Section K2BContextHelp
  1. Set property position to default value.
Table K2BToolsCell_PaginationNormal
  1. min-width:30px
  2. Set property width to default value.
Custom Class .gx-row-selected
  1. background-color: #F4EFEA
Custom Class .form-control-static
  1. padding-top:0px;
Custom Class .control-label
  1. custom-properties:
    1. Set property height to default value
Custom Class .form-control
  1. height:23px;

New Classes

Type Name

Properties
Action K2BToolsButton_FlatAction
  1. border: none;
  2. padding: 0px;
  3. color: #e7722b;
  4. font-family: SourceSansPro-Semibold;
  5. font-size: 15px;
  6. custom properties: text-decoration:underline;
Attribute K2BTools_FilterOptionCombo
  1. margin-right:5px;
  2. margin-left:5px;
  3. width:180px;
Grid Grid_AllowSelection
  1. external-class:true;
Group Group_AdvancedFiltersTitle
  1. FontWeight="700",
  2. FontSize="16px",
  3. FontFamily="SourceSansPro-Regular",
  4. Fore Color="#666"
Table child of: Table_DataAreaContainer Table_TransactionDataAreaContainer  
Table K2BTools_AdvancedFilterRow
  1. custom-properties:
    1. border-collapse: collapse;
Table: Child of Table_ActionsContainer Table_ComboActionsContainer  
Table K2BToolsTable_SideTextContainer
  1. position:relative;
  2. top:3px;
  3. custom-properties:
    1. border-collapse: collapse !important;
    2. border-spacing; 0px !important;
Table K2BToolsTableCell_SideText
  1. custom-properties
    1. padding:0px !important;
Table K2BToolsTableCell_RequiredField
  1. padding-left:0px !important;
Table K2BToolsTableCell_FieldWithSideText  
Table K2BToolsTableCell_EmptyRequiredContainer
  1. width:1px;
Table K2BToolsTable_TopAttributeContainer
  1. margin-bottom:5px;
Table K2BToolsTable_AttributeContainer
  1. margin-bottom:4px ;
  2. margin-right: - 15px;
TextBlock SideLabel
  1. top: set property to default.
TextBlock Textblock_AdvancedFiltersEmptyState
  1. font-Weight:normal
Textblock child of : Label Attribute_RequiredLabel
  1. custom-properties
    1. top:3px;!important
CustomClass Group_AdvancedFiltersTitle
  1. Margin Bottom="5px"
CustomClass

K2BToolsButton_FlatAction:hover,

.K2BToolsButton_FlatAction:focus
  1. custom-properties
    1. text-decoration:none
    2. background:none
Custom Class K2BTools_AdvancedFilterRow .input-group
  1. Margin Left="-2px"
Custom Class K2BTools_AdvancedFilterRow TD
  1. custom-properties:
    1. padding: 0px !important;
Custom Class Attribute_RequiredLabel:after
  1. custom-properties:
    1. content:"*";
    2. color:#c00;
Custom Class Attribute_RequiredReadOnlyLabel:after
  1. custom-properties:
    1. content:”” !important;
    2. color: #666 !important;
Custom Class K2BToolsButton_MainAction:hover
  1. background-color: #bb4917;
  2. border-bottom-color: #bb4917;
  3. border-left-color: #bb4917;
  4. order-right-color: #bb4917;
  5. border-top-color: #bb4917;
  6. border-style: solid;
  7. border-width: 0px;
  8. fore-color: white;
Custom Class .K2BToolsButton_MainActiondisabled background-color: #E7722B;
Custom Class .Image_Actiondisabled:hover
  1. custom-properties:
    1. backgrond:none;

 
Custom Class .Grid_AllowSelection tr:hover
  1. backgroundcolor:#F4EFEA
Custom Class .span.Attribute_RequiredLabel:empty
  1. top:-2px;
  2. position:relative;
Custom Class .K2BToolsTable_AttributeContainer span.Label
  1. margin-top: 0px;
Custom Class .K2BToolsTable_AttributeContainer .Label
  1. position:relative;
  2. top:5px;
Custom Class .K2BToolsTable_AttributeContainer table
  1. custom-properties:
    1. border-collapse:collapse;
    2. border-spacing:0px;
Custom Class K2BToolsTable_SideTextContainer .ReadonlyAttribute_Trn
  1. Top:0px;

 

 

K2BTools 8.2.0

Download

 

K2BFlatCompact_8.2.0

Changelog

 

Type Name Changes
Table

Body-Container (extra small)

Body-Container (all)
  1. margin-left: 0px
CustomClass form-group
  1. Custom properties
    1. margin-left:0px !important;
Table K2BToolsTable_AttributeContainer
  1. margin-top: 0px
Table K2BToolsTable_FieldContainer
  1. margin-bottom:5px
CustomClass .gx-grid
  1. Custom properties:
    1. overflow-x:auto
Custom Class

.input-group A.btn-default:hover

.Image_Action:hover

.K2BToolsTable_MyAccountContainer:hover

.K2BToolsTable_GridSettingsContainer:hover

.bootstrap-select > .btn:hover

.Button_Standard:hover
  1. Custom properties:
    1. Replace filter:ProgId... with -ms-filter:"ProgId..."
Attribute FilterAttribute
  1.  Remove class.
Custom .FilterAttribute:focus
  1. Remove class
Table

AvancedContainerItem

AdvancedContainer

K2BToolsMenuContainer

RecentLinksMainTable (Extra small)

K2BToolsMenuContainerCompact

K2BToolsMenuContainerInvisibleCompact
  1. Custom properties
    1. In transition (only applies to transition property, ignore -moz-transition, -webkit-transition, etc) property remove the 0s value closest to easy-in-out. Example: replace transition: left 0.5s ease-in-out  0s with transition: left 0.5s ease-in-out
Custom .input-group .form-control + span.input-group-btn > a.btn
  1. Custom properties
    1. In transition (only applies to transition property, ignore -moz-transition, -webkit-transition, etc) property remove the 0s value closest to easy-in-out. Example: replace transition: left 0.5s ease-in-out  0s with transition: left 0.5s ease-in-out
TextBlock TextBlock_LineSeparatorOpen
  1. Custom properties
    1. Remove user-select:none (so custom property value has the following properties: -webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;)
Custom dummy, class^="cb-icon-", class=" cb-icon-"
  1. Custom properties:
    1. Remove the * that is before margin-right property. 
Custom UL.K2BMetisMenu UL LI.active > A:
  1. Custom properties:
    1. change background-color: #ff7f7 to background-color:#ff7f70
Custom UL.K2BMetisMenu UL UL A
  1. Custom properties:
    1. padding-right is written wrong. Add a d to paDing-right

New Classes

Type Name

Properties
TextBlock child of: K2BToolsTextBlockPaginationNormal K2BToolsPaginationNormal_Disabled
 
Custom Class .K2BToolsTextBlock_PaginationNormal_Disabled A
  1. forecolor:#ddd
  2. cursor:default
  3. TextDecoration:none
Custom Class .K2BToolsTextBlock_PaginationNormal_Disabled A:hover
  1. forecolor:#ddd
Custom Class .Grid_WorkWithFooter
  1. Height:50px
Custom Class

.input-group A.btn-default:hover

.Image_Action:hover

.K2BToolsTable_MyAccountContainer:hover

.K2BToolsTable_GridSettingsContainer:hover

.bootstrap-select > .btn:hover

.Button_Standard:hover
  1. Custom properties:
    1. Replace filter:ProgId... with -ms-filter:"ProgId..."

 

K2BTools 8.1.0

Download

 

K2BFlatCompact_8.1.0

Changelog

Type Name Changes
Section PromptAdvancedBarCell
  1. extra small
    1. padding:0px
Table K2BToolsMenuContainer
  1. width: set property to default.
  2. margin-left:-15px
Table K2BToolsMenuContainerVisible
  1. width: set property to default.
Table K2BToolsMenuContainerCompact
  1. width: set property to default
  2. margin-left:-15px
Table K2BToolsTable_MainContentTable
  1. padding:5px
Custom control-label
  1. height:12px
Custom form-control-static
  1. min-height:12px

 

New Classes

Type Name

Properties
Image K2BMenuItemImage
  1. max-width="30px"
Custom Class .nav
  1. Extra small:
    1. custom properties: width:140!important;
  2. Small
    1. custom properties: width 140!important;
  3. Medium
    1. custom properties: width:184!important;
  4. Large
    1. custom properties: width:218!important;
Custom Class .sidebar-nav
  1. custom: border-bottom: 1px solid #ccc !important;
Custom Class .sidebar-nav ul a
  1. background-color: #EEEBEB
  2. padding-top: 10px
  3. padding-bottom:10px
  4. padding-right: 20px
  5. padding-left:20px
  6. custom properties:text-shadow:none !important; box-shadow:none !important; color:#857f76 !important;
Custom Class

.sidebar-nav ul a:hover

.sidebar-nav ul a:active

.sidebar-nav ul a:focus
  1. fore-color: #FFF
Custom Class UL.K2BMetisMenu
  1. border-top:1px solid #ccc;
Custom Class UL.K2BMetisMenu A:hover
  1. custom properties: color:#000 !important;
Custom Class UL.K2BMetisMenu A
  1. text-decoration: none;
  2. padding: 14px !important;
  3. font-family: SourceSansPro-Semibold;
  4. font-size: 18px;
  5. border-top:0px !important;
  6. border-bottom: 1px solid #ccc;
  7. border-right: 1px solid #ccc;
  8. cursor: pointer;
  9. custom properties: background-color:#eeebeb !important; border-top:0px !important;
Custom Class UL.K2BMetisMenu LI.active > A
  1. custom properties : background-color:#f5f2f2 !important;color: #666 !important;
Custom Class UL.K2BMetisMenu LI.active > A:hover
  1. custom properties: color:#666 !important;
Custom Class UL.K2BMetisMenu UL LI.active >A
  1. font-weight:bold;
  2. custom properties: background-color:#ff7f7 !important;
Custom Class UL.K2BMetisMenu UL UL LI.active > A 
  1. custom properties: background-color:#f5f2f2 !important;
Custom Class UL.K2BMetisMenu UL A
  1. border-bottom:none;
  2. font-size: 16px;
  3. font-family: SourceSansPro-Regular;
  4. custom properties :background-color:#f5f2f2 !important; padding: 10px !important;padding-left:15px !important;
Custom Class UL.K2BMetisMenu UL UL UL A
  1. border-bottom: none;
  2. font-size: 14px;
  3. custom properties: padding-left:30px !important;padding: 8px !important;
Custom Class UL.K2BMetisMenu UL UL UL UL A
  1. custom properties: padding-left:60px !important;
Custom Class UL.K2BMetisMenu LI.activeelement > A
  1. border-right: 6px solid #e7722b;
  2. custom properties: background-color: #fff !important;
Custom Class .fa.arrow:before
  1. custom properties: content: "\f107" !important;
Custom Class .active > a > .fa.arrow:before
  1. custom properties: content: "\f106" !important;
Custom Class .InvisibleInExtraSmallMenu
  1. extra-small:
    1. display:none!important;
Custom Class .InvisibleInSmallMenu
  1. small:
    1. display:none!important;
Custom Class .InvisibleInMediumMenu
  1. medium:
    1. display:none!important;
Custom Class .InvisibleInLargeMenu
  1. large:
    1. display:none!important;

 

K2BTools 8.0.14

Download

 

K2BFlatCompact_8.0.14

Changelog

First Release.