Changeset 19858


Ignore:
Timestamp:
2011/01/08 15:31:42 (13 years ago)
Author:
yomoro
Message:

スマートフォンのカート画面以降のレイアウト微調整・ボタンのcss化

Location:
branches/version-2_5-dev
Files:
8 edited

Legend:

Unmodified
Added
Removed
  • branches/version-2_5-dev/data/Smarty/templates/sphone/cart/index.tpl

    r19851 r19858  
    133133                        <br /> 
    134134<ul id="quantity_level"> 
    135                                 <li><a href="?" onclick="fnModeSubmit('up','cart_no','<!--{$item.cart_no}-->'); return false"><img src="<!--{$TPL_DIR}-->img/button/btn_plus.gif" width="16" height="16" alt="+" /></a></li> 
    136                                 <li><a href="?" onclick="fnModeSubmit('down','cart_no','<!--{$item.cart_no}-->'); return false"><img src="<!--{$TPL_DIR}-->img/button/btn_minus.gif" width="16" height="16" alt="-" /></a></li> 
     135                                <li><a href="?" onclick="fnModeSubmit('up','cart_no','<!--{$item.cart_no}-->'); return false"><img src="<!--{$TPL_DIR}-->img/button/btn_plus.gif" width="8" height="8" alt="+" /></a></li> 
     136                                <li><a href="?" onclick="fnModeSubmit('down','cart_no','<!--{$item.cart_no}-->'); return false"><img src="<!--{$TPL_DIR}-->img/button/btn_minus.gif" width="8" height="8" alt="-" /></a></li> 
    137137                            </ul></td> 
    138138                        <td><!--{$item.total_inctax|number_format}-->円</td> 
     
    167167                <p> 
    168168                    <!--{if $tpl_prev_url != ""}--> 
    169                         <a href="<!--{$tpl_prev_url}-->" onmouseover="chgImg('<!--{$TPL_DIR}-->img/button/btn_back_on.gif','back');" onmouseout="chgImg('<!--{$TPL_DIR}-->img/button/btn_back.gif','back');"> 
    170                             <img src="<!--{$TPL_DIR}-->img/button/btn_back.gif" width="150" height="30" alt="買い物を続ける" name="back" id="back" /></a>&nbsp;&nbsp; 
     169                     <a href="<!--{$tpl_prev_url}-->" class="spbtn spbtn-medeum"> 
     170                                    買い物を続ける</a>&nbsp;&nbsp; 
    171171                    <!--{/if}--> 
    172172                    <!--{if strlen($tpl_error) == 0}--> 
    173173                        <input type="hidden" name="cartKey" value="<!--{$key}-->" /> 
    174                         <input type="image" onmouseover="chgImgImageSubmit('<!--{$TPL_DIR}-->img/button/btn_buystep_on.gif',this)" onmouseout="chgImgImageSubmit('<!--{$TPL_DIR}-->img/button/btn_buystep.gif',this)" src="<!--{$TPL_DIR}-->img/button/btn_buystep.gif" width="130" height="30" alt="購入手続きへ" name="confirm" /> 
     174                        <input type="submit" value="購入手続きへ" class="spbtn spbtn-shopping" width="130" height="30" alt="購入手続きへ" name="confirm" /> 
    175175                    <!--{/if}--> 
    176176              </p> 
  • branches/version-2_5-dev/data/Smarty/templates/sphone/shopping/confirm.tpl

    r19851 r19858  
    5454            <input type="hidden" name="mode" value="confirm" /> 
    5555            <input type="hidden" name="uniqid" value="<!--{$tpl_uniqid}-->" /> 
    56  
    57             <div class="tblareabtn"> 
    58                 <a href="./payment.php" onmouseover="chgImgImageSubmit('<!--{$TPL_DIR}-->img/button/btn_back_on.gif',back03)" onmouseout="chgImgImageSubmit('<!--{$TPL_DIR}-->img/button/btn_back.gif',back03)"><img src="<!--{$TPL_DIR}-->img/button/btn_back.gif" width="150" height="30" alt="戻る" border="0" name="back03-top" id="back03-top" /></a>&nbsp; 
    59                 <!--{if $payment_type != ""}--> 
    60                 <input type="image" onclick="return fnCheckSubmit();" onmouseover="chgImgImageSubmit('<!--{$TPL_DIR}-->img/button/btn_next_on.gif',this)" onmouseout="chgImgImageSubmit('<!--{$TPL_DIR}-->img/button/btn_next.gif',this)" src="<!--{$TPL_DIR}-->img/button/btn_next.gif" alt="次へ" class="box150" name="next-top" id="next-top" /> 
    61                 <!--{else}--> 
    62                 <input type="image" onclick="return fnCheckSubmit();" onmouseover="chgImgImageSubmit('<!--{$TPL_DIR}-->img/button/btn_order_complete_on.gif',this)" onmouseout="chgImgImageSubmit('<!--{$TPL_DIR}-->img/button/btn_order_complete.gif',this)" src="<!--{$TPL_DIR}-->img/button/btn_order_complete.gif" alt="ご注文完了ページへ" class="box150" name="next-top" id="next-top" />                <!--{/if}--> 
    63             </div> 
    64  
    6556            <table summary="ご注文内容確認"> 
    6657                <tr> 
     
    8172                            <!--{/if}--> 
    8273                        > 
    83                             <img src="<!--{$smarty.const.URL_PATH}-->resize_image.php?image=<!--{$item.productsClass.main_list_image|sfNoImageMainList|h}-->&amp;width=65&amp;height=65" alt="<!--{$item.productsClass.name|h}-->" /></a> 
     74                            <img src="<!--{$smarty.const.URL_PATH}-->resize_image.php?image=<!--{$item.productsClass.main_list_image|sfNoImageMainList|h}-->&amp;width=40&amp;height=40" alt="<!--{$item.productsClass.name|h}-->" /></a> 
    8475                    </td> 
    8576                    <td> 
     
    250241 
    251242            <div class="tblareabtn"> 
    252                 <a href="./payment.php" onmouseover="chgImgImageSubmit('<!--{$TPL_DIR}-->img/button/btn_back_on.gif',back03)" onmouseout="chgImgImageSubmit('<!--{$TPL_DIR}-->img/button/btn_back.gif',back03)"><img src="<!--{$TPL_DIR}-->img/button/btn_back.gif" width="150" height="30" alt="戻る" border="0" name="back03" id="back03" /></a>&nbsp; 
     243            <a href="./payment.php" class="spbtn spbtn-medeum"> 
     244                    戻る</a>&nbsp; 
    253245                <!--{if $payment_type != ""}--> 
    254                 <input type="image" onclick="return fnCheckSubmit();" onmouseover="chgImgImageSubmit('<!--{$TPL_DIR}-->img/button/btn_next_on.gif',this)" onmouseout="chgImgImageSubmit('<!--{$TPL_DIR}-->img/button/btn_next.gif',this)" src="<!--{$TPL_DIR}-->img/button/btn_next.gif" alt="次へ" class="box150" name="next" id="next" /> 
     246                 <input type="submit" value="次へ" class="spbtn spbtn-shopping" width="130" height="30" alt="次へ" name="next" id="next" /> 
    255247                <!--{else}--> 
    256                 <input type="image" onclick="return fnCheckSubmit();" onmouseover="chgImgImageSubmit('<!--{$TPL_DIR}-->img/button/btn_order_complete_on.gif',this)" onmouseout="chgImgImageSubmit('<!--{$TPL_DIR}-->img/button/btn_order_complete.gif',this)" src="<!--{$TPL_DIR}-->img/button/btn_order_complete.gif" alt="ご注文完了ページへ" class="box150" name="next" id="next" /> 
     248                 <input type="submit" value="ご注文完了ページへ" class="spbtn spbtn-shopping" width="130" height="30" alt="ご注文完了ページへ" name="next" id="next" /> 
    257249                <!--{/if}--> 
    258250            </div> 
  • branches/version-2_5-dev/data/Smarty/templates/sphone/shopping/nonmember_input.tpl

    r19833 r19858  
    3030      <input type="hidden" name="uniqid" value="<!--{$tpl_uniqid}-->" /> 
    3131      <input type="hidden" name="<!--{$smarty.const.TRANSACTION_ID_NAME}-->" value="<!--{$transactionid}-->" /> 
    32       <table summary=" "> 
     32      <table summary="お客様情報入力"> 
    3333        <tr> 
    3434          <th>お名前<span class="attention">※</span></th> 
     
    4242        </tr> 
    4343        <tr> 
    44           <th>お名前(フリガナ)<span class="attention">※</span></th> 
     44          <th>お名前<br /> 
     45          (フリガナ)<span class="attention">※</span></th> 
    4546          <td> 
    4647            <!--{assign var=key1 value="order_kana01"}--> 
     
    5758            <!--{assign var=key2 value="order_zip02"}--> 
    5859            <span class="attention"><!--{$arrErr[$key1]}--><!--{$arrErr[$key2]}--></span> 
    59             <p>〒&nbsp;<input type="text" name="<!--{$key1}-->" value="<!--{$arrForm[$key1].value|h}-->" maxlength="<!--{$arrForm[$key1].length}-->" style="<!--{$arrErr[$key1]|sfGetErrorColor}-->"  size="6" class="box60" />&nbsp;-&nbsp;  <input type="text"  name="<!--{$key2}-->" value="<!--{$arrForm[$key2].value|h}-->" maxlength="<!--{$arrForm[$key2].length}-->" style="<!--{$arrErr[$key2]|sfGetErrorColor}-->"  size="6" class="box60" />  
    60               <a href="http://search.post.japanpost.jp/zipcode/" target="_blank"><span class="fs12">郵便番号検索</span></a></p> 
     60            <p>〒&nbsp;<input type="text" name="<!--{$key1}-->" value="<!--{$arrForm[$key1].value|h}-->" maxlength="<!--{$arrForm[$key1].length}-->" style="<!--{$arrErr[$key1]|sfGetErrorColor}-->"  size="6" class="box60" />&nbsp;-&nbsp;  <input type="text"  name="<!--{$key2}-->" value="<!--{$arrForm[$key2].value|h}-->" maxlength="<!--{$arrForm[$key2].length}-->" style="<!--{$arrErr[$key2]|sfGetErrorColor}-->"  size="6" class="box60" /> <br /> 
     61<a href="http://search.post.japanpost.jp/zipcode/" target="_blank"><span class="fs12">郵便番号検索</span></a></p> 
    6162 
    6263            <p class="zipimg"><a href="<!--{$smarty.const.URL_PATH}-->address/<!--{$smarty.const.DIR_INDEX_URL}-->" onclick="fnCallAddress('<!--{$smarty.const.INPUT_ZIP_URL_PATH}-->', 'order_zip01', 'order_zip02', 'order_pref', 'order_addr01'); return false;" target="_blank"><img src="<!--{$TPL_DIR}-->img/button/btn_address_input.gif" width="86" height="20" alt="住所自動入力" /></a> 
    63                <span class="mini">&nbsp;郵便番号を入力後、クリックしてください。</span></p> 
     64               <span class="mini">&nbsp;<br /> 
     65               郵便番号を入力後、クリックしてください。</span></p> 
    6466          </td> 
    6567        </tr> 
     
    154156            <select name="year" style="<!--{$errBirth|sfGetErrorColor}-->"> 
    155157              <!--{html_options options=$arrYear selected=$arrForm.year.value|default:''}--> 
    156             </select>年 
     158            </select>年<br /> 
    157159            <select name="month" style="<!--{$errBirth|sfGetErrorColor}-->"> 
    158160              <!--{html_options options=$arrMonth selected=$arrForm.month.value|default:''}--> 
     
    167169          <!--{assign var=key value="deliv_check"}--> 
    168170          <input type="checkbox" name="<!--{$key}-->" value="1" onclick="fnCheckInputDeliv();" <!--{$arrForm[$key].value|sfGetChecked:1}--> id="deliv_label" /> 
    169           <label for="deliv_label"><em>お届け先を指定</em> ※上記に入力された住所と同一の場合は省略可能です。</label> 
     171          <label for="deliv_label"><em>お届け先を指定</em> <br /> 
     172            ※上記に入力された住所と同一の場合は省略可能です。</label> 
    170173          </th> 
    171174        </tr> 
     
    181184        </tr> 
    182185        <tr> 
    183           <th>お名前(フリガナ)<span class="attention">※</span></th> 
     186          <th>お名前<br /> 
     187          (フリガナ)<span class="attention">※</span></th> 
    184188          <td> 
    185189            <!--{assign var=key1 value="deliv_kana01"}--> 
     
    197201            <span class="attention"><!--{$arrErr[$key1]}--><!--{$arrErr[$key2]}--></span> 
    198202            <p>〒&nbsp;<input type="text" name="<!--{$key1}-->" value="<!--{$arrForm[$key1].value|h}-->" maxlength="<!--{$arrForm[$key1].length}-->" style="<!--{$arrErr[$key1]|sfGetErrorColor}-->"  size="6" class="box60" />&nbsp;-&nbsp;  <input type="text"  name="<!--{$key2}-->" value="<!--{$arrForm[$key2].value|h}-->" maxlength="<!--{$arrForm[$key2].length}-->" style="<!--{$arrErr[$key2]|sfGetErrorColor}-->"  size="6" class="box60" />  
    199               <a href="http://search.post.japanpost.jp/zipcode/" target="_blank"><span class="fs12">郵便番号検索</span></a></p> 
     203              <a href="http://search.post.japanpost.jp/zipcode/" target="_blank"><span class="fs12"><br /> 
     204              郵便番号検索</span></a></p> 
    200205 
    201206            <p class="zipimg"><a href="<!--{$smarty.const.URL_PATH}-->address/<!--{$smarty.const.DIR_INDEX_URL}-->" onclick="fnCallAddress('<!--{$smarty.const.INPUT_ZIP_URL_PATH}-->', 'deliv_zip01', 'deliv_zip02', 'deliv_pref', 'deliv_addr01'); return false;" target="_blank"><img src="<!--{$TPL_DIR}-->img/button/btn_address_input.gif" width="86" height="20" alt="住所自動入力" /></a> 
    202               <span class="mini">&nbsp;郵便番号を入力後、クリックしてください。</span></p> 
     207              <span class="mini">&nbsp;<br /> 
     208              郵便番号を入力後、クリックしてください。</span></p> 
    203209          </td> 
    204210        </tr> 
     
    241247 
    242248      <div class="tblareabtn"> 
    243        <input type="image" onmouseover="chgImgImageSubmit('<!--{$TPL_DIR}-->img/button/btn_next_on.gif',this)" onmouseout="chgImgImageSubmit('<!--{$TPL_DIR}-->img/button/btn_next.gif',this)" src="<!--{$TPL_DIR}-->img/button/btn_next.gif" class="box150" alt="次へ" name="next" id="next" /> 
     249       <input type="submit" value="次へ" class="spbtn spbtn-shopping" width="130" height="30" alt="次へ" name="next" id="next" /> 
    244250      </div> 
    245251    </form> 
  • branches/version-2_5-dev/data/Smarty/templates/sphone/shopping/payment.tpl

    r19833 r19858  
    7777                        </select> 
    7878                    <!--{/if}--> 
     79                </div> 
     80                <div> 
    7981                    <!--★お届け時間★--> 
    8082                    <!--{assign var=key value="deliv_time_id"}--> 
     
    9799                    <span class="attention"><!--{$arrErr[$key]}--></span> 
    98100                    <textarea name="<!--{$key}-->" style="<!--{$arrErr[$key]|sfGetErrorColor}-->" cols="80" rows="8" class="area660" wrap="head"><!--{$arrForm[$key].value|h}--></textarea> 
     101                </div> 
     102                <div> 
    99103                    <span class="attention"> (<!--{$smarty.const.LTEXT_LEN}-->文字まで)</span> 
    100104                </div> 
     
    124128 
    125129            <div class="tblareabtn"> 
    126                 <a href="<!--{$tpl_back_url|h}-->" onmouseover="chgImg('<!--{$TPL_DIR}-->img/button/btn_back_on.gif','back03')" onmouseout="chgImg('<!--{$TPL_DIR}-->img/button/btn_back.gif','back03')"> 
    127                     <img src="<!--{$TPL_DIR}-->img/button/btn_back.gif" width="150" height="30" alt="戻る" border="0" name="back03" id="back03" /></a>&nbsp; 
    128                 <input type="image" onmouseover="chgImgImageSubmit('<!--{$TPL_DIR}-->img/button/btn_next_on.gif',this)" onmouseout="chgImgImageSubmit('<!--{$TPL_DIR}-->img/button/btn_next.gif',this)" src="<!--{$TPL_DIR}-->img/button/btn_next.gif" class="box150" alt="次へ" name="next" id="next" /> 
     130                <a href="<!--{$tpl_back_url|h}-->" class="spbtn spbtn-medeum"> 
     131                    戻る</a>&nbsp; 
     132                <input type="submit" value="次へ" class="spbtn spbtn-shopping" width="130" height="30" alt="次へ" name="next" id="next" /> 
    129133            </div> 
    130134        </form> 
  • branches/version-2_5-dev/html/user_data/packages/sphone/css/button.css

    r19839 r19858  
    193193text-decoration: none; 
    194194} 
     195 
     196/* ショッピング関連ボタン 
     197----------------------------------------------- */ 
     198.spbtn-shopping { 
     199display: block; 
     200margin: 0.5em auto 0.3em; 
     201font: bold 15px helvetica; 
     202border: solid 1px #666666; 
     203text-shadow: 0px -1px 1px rgba(0,0,0,0.5); 
     204color: #ffffff; 
     205background-color: #fc4743; 
     206background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,0.25)), to(rgba(0,0,0,0.2)), color-stop(0.5, rgba(255,255,255,0.05)), color-stop(0.51, rgba(0,0,0,0.05))); 
     207-webkit-border-radius: 6px; 
     208-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.7); 
     209} 
     210a.spbtn-shopping { 
     211width: 59%; 
     212max-width: 178px; 
     213} 
     214input.spbtn-shopping { 
     215width: 60%; 
     216max-width: 180px; 
     217} 
  • branches/version-2_5-dev/html/user_data/packages/sphone/css/common.css

    r19839 r19858  
    77background-position: 50% 0% fixed; 
    88font-family: helvetica, Osaka; 
    9 font-size: large; 
     9font-size:small; 
    1010margin: 0px 3.13% 10px; 
    1111padding: 0px; 
     
    254254----------------------------------------------- */ 
    255255input[size="40"] { 
    256 width: 60%; 
     256width: 50%; 
    257257} 
    258258input[type="password"] { 
    259 width: 60%; 
     259width: 50%; 
    260260} 
    261261input[type="tel"] { 
    262 width: 3.6em; 
     262width: 3em; 
    263263} 
    264264input, tr, th, td { 
     
    266266} 
    267267input { 
    268 font-size: large; 
     268font-size: small; 
    269269} 
    270270textarea{ 
    271 font-size: 14px; 
     271font-size: small; 
    272272width: 95%; 
    273273} 
    274274form dl{ 
    275 font: bold 17px helvetica; 
     275font: bold small helvetica; 
    276276margin: 10px 0; 
    277277} 
     
    279279margin: 5px 0; 
    280280color:#4D576B; 
    281 font: bold 17px helvetica; 
     281font: bold small helvetica; 
    282282background-color: transparent; 
    283283text-shadow: 0px 1px 1px #ffffff; 
  • branches/version-2_5-dev/html/user_data/packages/sphone/css/table.css

    r19839 r19858  
    66background: #fff; 
    77border: 1px solid #B4B4B4; 
    8 font: bold 17px 'Helvetica-Bold'; 
     8font: bold small 'Helvetica-Bold'; 
    99padding: 0;    
    1010margin: 10px 0; 
     
    1616border-top: 1px solid #B4B4B4; 
    1717list-style-type: none; 
    18 padding: 7px 10px 7px 10px; 
     18padding: 4px 6px; 
    1919} 
    2020li:first-child { 
     
    111111table td { 
    112112margin: 0; 
    113 max-width: 200px; 
     113max-width: 250px; 
    114114height: 2em; 
    115115background-color: #ffffff; 
     
    466466} 
    467467 
     468/* テーブル・商品詳細 
     469----------------------------------------------- */ 
     470#detailrightblock table th { 
     471font-size: 15px; 
     472font-weight: normal; 
     473} 
     474 
     475/* お客様情報入力 
     476----------------------------------------------- */ 
     477table[summary="お客様情報入力"] td{ 
     478padding-left:5px; 
     479text-align: left; 
     480vertical-align: middle; 
     481} 
     482 
    468483/* お問い合わせ 
    469484----------------------------------------------- */ 
  • branches/version-2_5-dev/html/user_data/packages/sphone/css/width.css

    r19839 r19858  
    22 
    33.box60 { 
    4 width: 3em; 
     4width: 2.2em; 
    55} 
    66.box120 { 
    7 width: 4.5em; 
     7width: 2.8em; 
    88} 
    99.box300 { 
    10 width: 262px; 
     10width: 250px; 
    1111} 
    1212.box380 { 
    13 width: 260px; 
     13width: 250px; 
    1414} 
    1515/* 
Note: See TracChangeset for help on using the changeset viewer.