CMS MADE SIMPLE FORGE

Products

 

[#10616] New 2 column layout of Product Item Information - can look broken at some screen widths

avatar
Created By: Chris Taylor (chrisbt)
Date Submitted: Tue Sep 01 07:05:22 -0400 2015

Assigned To: Robert Campbell (calguy1000)
Version: 2.24.2
CMSMS Version: 1.12
Severity: Trivial
Resolution: None
State: Open
Summary:
New 2 column layout of Product Item Information - can look broken at some screen widths
Detailed Description:
I like the new look of the inline labels, but have some issues with different
screen widths.

The right column looks broken between 1200px and approx 1700px screen width.
This is mainly due to the fixed width of the TinyMCE Editor block (fixed 790px)
wide. Plus there is also not quite enough width for the right column labels at
this width.

Please feel free to ignore/close this item if you wish.

I modified that tab in the template with the following (but still not sure it is
ideal):

{cge_tabcontent_start name='main'}
<div class="c_full">
  <div class="grid_6">
    <div class="c_full">
      <div class="grid_2 text-right">{$mod->Lang('name')}:</div>
      <div class="grid_10">
<input type="text" id="product_name" name="{$actionid}product_name"
value="{$product_name}" size="40" maxlength="255"/>
      </div>
    </div>
    <div class="c_full">
      <div class="grid_2 text-right">{$mod->Lang('price')}:</div>
      <div class="grid_10">{$currency_symbol}
<input type="text" id="product_price" name="{$actionid}price"
value="{$price}" size="10" maxlength="12"/>
        <br/>{$mod->Lang('info_decimal_units')}</div>
    </div>
    <div class="c_full">
      <div class="grid_2 text-right">{$taxabletext}:</div>
      <div class="grid_10">{$inputtaxable}</div>
    </div>
  </div>

  <div class="grid_6">{* right column *}
    {* status field *}
    <div class="c_full">
      <div class="grid_2 text-right">{$statustext}:</div>
      <div class="grid_10">{$inputstatus}</div>
    </div>

    {* the hierarchy stuff *}
    {if count($hierarchy_items)}
      <div class="c_full">
        <p class="grid_2 text-right">{$mod->Lang('hierarchy_position')}:</p>
        <p class="grid_10">
	  <select name="{$actionid}hierarchy" id="hierarchy">
{html_options options=array_flip($hierarchy_items) selected=$hierarchy_pos}
	  </select>
	      </p>
      </div>
      <div class="clearb"></div>
    {/if}

    {* categories *}
    {if isset($all_categories)}
      <div class="c_full">
        <div class="grid_2 text-right">{$mod->Lang('categories')}:</div>
        <div class="grid_10">
	  <select name="{$actionid}categories[]" id="categories" multiple="multiple">
	    {html_options options=$all_categories selected=$sel_categories}
	  </select>
	</div>
      </div>
    {/if}
  </div>
  <div class="clearb"></div>

  <div class="grid_12">{* bottom column *}
    <div class="c_full">
      <div class="grid_1 text-right">{$detailstext}:</div>
      <div class="grid_11">{$inputdetails}</div>
    </div>
  </div>
  <div class="clearb"></div>

</div>


History

Comments
avatar
Date: 2015-10-09 06:02
Posted By: TimdeBuurman (timdebuurman)

As a temporary solution, I added 
clear: both
to .c_full in the addedproduct template, but I think the problem is in the
OneEleven theme styles.