Page History

// RESPONSIVE STYLES FOR Responsive UI Forms
// SIZES: xs, xxs
@include panel-w(('xs', 'xxs')) { // xs and xxs
 
    // helper classes for responsive forms
    .dhxform_obj_material {
        //
apply the changes for a fieldset here         .xs-lower-one-col > fieldset {
            > .dhxform_base_nested > .f-2-col,
{            > .dhxform_base_nested >   grid-template-columns: 1fr;
    .f-3-col,
            > .col1,dhxform_base_nested > .col2 {f-4-col,
            > .dhxform_base_nested > .f-5-col,
     @include grid-column(1);      > .dhxform_base_nested    > .f-6-col,
     }             }
        }
		// apply the changes for the blocks here
        .block_dhxform_item_label_left.xs-lower-one-col {> .dhxform_base_nested > .f-7-col,
            > .dhxform_block > .in_blockbase_nested > .f-28-col,
{            > .dhxform_base_nested >   grid-template-columns: 1fr;
   .f-9-col,
            > .col1,dhxform_base_nested > .col2 {f-10-col,
            > .dhxform_base_nested    > .f-11-col,
   @include grid-column(1);        > .dhxform_base_nested > .f-12-col {
       }         grid-template-columns: 1fr;
  }              > .dhxform_blockcol1, > .in_blockcol2, > .f-3-col {
          col3, > .col4, > .col5, > .col6,
     grid-template-columns: 1fr;          > .col7, > .col8, >  .col9, > .col1col10, > .col2col11, > .col3col12 {
                    @include grid-column(1);
                }
            }
        }

        .block_dhxform_item_label_left.xs-lower-one-col {
    }              > .dhxform_block > .in_block > .f-42-col,
{            > .dhxform_block > .in_block > grid.f-template-columns: 1fr;3-col,
                > .col1,dhxform_block > .col2,in_block > .col3,  > .col4 {f-4-col,
            > .dhxform_block > .in_block > .f-5-col,
    @include grid-column(1);       > .dhxform_block > .in_block > .f-6-col,
    }        > .dhxform_block > .in_block  }> .f-7-col,
            > .dhxform_block > .in_block > .f-58-col,
{            > .dhxform_block > .in_block > grid.f-template9-columns:col,
1fr;            > .dhxform_block > .in_block  > .col1, > .col2, > .col3,  > .col4,f-10-col,
            > .col5 {
   dhxform_block > .in_block > .f-11-col,
            > .dhxform_block > .in_block @include grid-column(1);
> .f-12-col {
               } grid-template-columns: 1fr;
          }      > .col1, > .col2, >  .col3, > .dhxform_block > .in_block > .f-6-col {col4,
                > .col5, > .col6, > .col7, >  grid-template-columns: 1fr;.col8,
                > .col9, > .col1col10, > .col2col11, > .col3col12 {
                    @include grid-column(1);
                }
            }
            
        }

        
    }
	}
}