ここの情報は古いです。ご理解頂いた上でお取り扱いください。

Opened 12 years ago

Closed 11 years ago

#1955 closed project (fixed)

21. recentList(最新書き込みリスト)をXHTML+CSS化

Reported by: ebihara Owned by: nobody
Priority: major Milestone:
Component: pne-xhtmlcss Version:
Keywords: Cc:

Description (last modified by ogawa)

「recentList(最新書き込みリスト)」をXHTML+CSS化する。

wiki:pne-xhtmlcss/parts/21

Attachments (2)

#1955.GIF (13.7 KB) - added by nakasone 12 years ago.
#1955_2.GIF (5.7 KB) - added by nakasone 12 years ago.

Download all attachments as: .zip

Change History (26)

comment:1 Changed 12 years ago by ebihara

Description: modified (diff)

comment:2 Changed 12 years ago by ebihara

Priority: minorcritical

comment:3 Changed 12 years ago by ebihara

Owner: changed from nobody to ebihara
Status: newassigned

マークアップ用HTMLを用意します。

comment:4 Changed 12 years ago by ebihara

Keywords: マークアップ added; パーツ removed
Owner: changed from ebihara to nobody
Status: assignednew

r5218 でマークアップ用HTMLを追加しました。よろしくお願いします。

comment:5 Changed 12 years ago by ogawa

Summary: 最新書き込み一覧(recentList)をXHTML+CSS化30. 最新書き込み一覧(recentList)をXHTML+CSS化

comment:6 Changed 12 years ago by ogawa

Keywords: パーツ added; マークアップ removed
Owner: changed from nobody to ogawa
Status: newassigned

マークアップ用HTMLを見直します。

comment:7 Changed 12 years ago by ogawa

Description: modified (diff)
Summary: 30. 最新書き込み一覧(recentList)をXHTML+CSS化21. recentList(最新書き込みリスト)をXHTML+CSS化

パーツ名を変更しました。

comment:8 Changed 12 years ago by ogawa

Keywords: マークアップ added; パーツ removed
Owner: changed from ogawa to nobody
Status: assignednew

r5345 で「前を表示」を追加しました。マークアップ作業お願いします。

comment:9 Changed 12 years ago by ogawa

Priority: criticalmajor

comment:10 Changed 12 years ago by takai

Owner: changed from nobody to takai
Status: newassigned
  • マークアップしました
  • HTML r5679
  • CSS r5680

comment:11 Changed 12 years ago by takai

Keywords: パーツ added; マークアップ removed
Owner: changed from takai to nobody
Status: assignednew

comment:12 Changed 12 years ago by ogawa

Keywords: テンプレート added; パーツ removed

wiki:pne-xhtmlcss/parts/21 マークアップ例を追加しました。テンプレート班に回します。

comment:13 Changed 12 years ago by nakasone

Owner: changed from nobody to nakasone
Status: newassigned

テンプレートの書き換えをやります。

comment:14 Changed 12 years ago by nakasone

fh_diary_list.tplにおいて、横幅の異なったパーツはどのように対処すれば良いでしょうか。

出力されたHTMLは以下です。

<!-- ******ここから:Blog一覧****** -->
<table border="0" cellspacing="0" cellpadding="0" style="width:540px;margin:0px auto;" class="border_07">
<tr>
<td style="width:7px;" class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
<td style="width:524px;" class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
<td style="width:7px;" class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
</tr>
<tr>
<td class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
<td class="bg_01" align="center">
<!-- *ここから:Blog一覧>内容* -->
<!-- ここから:小タイトル -->
<table border="0" cellspacing="0" cellpadding="0" style="width:524px;" class="border_01">
<tr>

<td style="width:36px;" class="bg_06"><img src="./skin/default/img/content_header_1.gif" style="width:30px;height:20px;" class="dummy"></td>
<td style="width:486px;padding:2px 0px;" class="bg_06"><span class="b_b c_00">
<a name="blog">
なかのBlog
</a>
</span></td>
</tr>
</table>
<!-- ここまで:小タイトル -->
<!-- ここから:主内容 -->
<!-- ここから:主内容>>blog表示 -->
<table border="0" cellspacing="0" cellpadding="0" style="width:524px;" class="border_01">
<tr>
<td style="width:522px;height:1px;" class="bg_01" colspan="5"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>
<tr>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>

<td style="width:66px;" class="bg_05" align="center" valign="top">
<div style="padding:4px 3px;">

03月18日<br> 21:36

</div>
</td>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
<td style="width:453px;" class="bg_02" align="left" valign="middle">
<div style="padding:4px 3px;">

<a href="http://news.tejimaya.com/archives/50916419.html" target="_blank">中国より帰国しました</a>

</div>
</td>

<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>
<tr>
<td style="height:1px;" class="bg_01" colspan="5"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>

</table>

<!-- ここまで:主内容>>blog表示 -->
<!-- ここまで:主内容 -->
<!-- 無し -->
<!-- *ここまで:Blog一覧>>内容* -->
</td>
<td class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
</tr>
<tr>
<td class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
<td class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
<td class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
</tr>
</table>
<!-- ******ここまで:Blog一覧****** -->

Changed 12 years ago by nakasone

Attachment: #1955.GIF added

comment:15 Changed 12 years ago by nakasone

h_diary_list_all.tplにおいて、中でもう一つ枠に囲われており、矢印の画像が付いているものはどのように対処すれば良いでしょうか。

出力されたHTMLは以下です。

<!-- ******ここから:最新Blog一覧****** -->
<table border="0" cellspacing="0" cellpadding="0" style="width:650px;margin:0px auto;" class="border_07">
<tr>
<td style="width:7px;" class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
<td style="width:636px;" class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
<td style="width:7px;" class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
</tr>

<tr>
<td class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
<td class="bg_01" align="center">
<!-- *ここから:最新Blog一覧>内容* -->
<!-- ここから:小タイトル -->
<table border="0" cellspacing="0" cellpadding="0" style="width:636px;" class="border_01">
<tr>
<td style="width:36px;" class="bg_06"><img src="./skin/default/img/content_header_1.gif" style="width:30px;height:20px;" class="dummy"></td>
<td style="width:600px;padding:2px 0px;" class="bg_06">
<span class="c_00">
<span class="b_b">最新Blog一覧</span>
</span>
</td>
</tr>
</table>
<!-- ここまで:小タイトル -->

<!-- ここから:主内容 -->
<!-- ここから:主内容>>最新Blog一覧本体 -->
<div class="border_01 bg_05" align="center">

<img src="./skin/dummy.gif" alt="dummy" class="v_spacer_l">

<!-- ここから:主内容>>最新Blog一覧本体>>のループ部分 -->
<div class="border_01 bg_09" style="width:562px;margin:0px auto;" align="center">
<img src="./skin/dummy.gif" alt="dummy" class="v_spacer_m">
<table border="0" cellspacing="0" cellpadding="0" style="width:550px;margin:0px auto;">
<tr>
<td style="width:550px;height:1px;" class="bg_01" colspan="5"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>
<tr>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
<td style="width:180px;" class="bg_02" align="left" valign="middle">

<div class="padding_s">

<img src="./skin/dummy.gif" alt="dummy" style="width:14px;height:14px;" class="icon icon_3">1999年11月30日 00:00

</div>

</td>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
<td style="width:367px;" class="bg_02" align="left" valign="middle">

<div class="padding_s">

<a href="http://gohan.uxu.jp/gohan/2008-01-24/" target="_blank">2008-01-24(10)</a> (えびはらこうすけ)

</div>

</td>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>
<tr>
<td style="height:1px;" class="bg_01" colspan="5"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>

<tr>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
<td style="width:180px;" class="bg_02" align="left" valign="middle">

<div class="padding_s">

<img src="./skin/dummy.gif" alt="dummy" style="width:14px;height:14px;" class="icon icon_3">1999年11月30日 00:00

</div>

</td>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
<td style="width:367px;" class="bg_02" align="left" valign="middle">

<div class="padding_s">

<a href="http://gohan.uxu.jp/gohan/2008-01-25/" target="_blank">2008-01-25(9)</a> (えびはらこうすけ)


</div>

</td>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>
<tr>
<td style="height:1px;" class="bg_01" colspan="5"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>
<tr>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
<td style="width:180px;" class="bg_02" align="left" valign="middle">

<div class="padding_s">

<img src="./skin/dummy.gif" alt="dummy" style="width:14px;height:14px;" class="icon icon_3">1999年11月30日 00:00

</div>

</td>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
<td style="width:367px;" class="bg_02" align="left" valign="middle">

<div class="padding_s">

<a href="http://gohan.uxu.jp/gohan/2008-01-26/" target="_blank">2008-01-26(13)</a> (えびはらこうすけ)

</div>

</td>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>
<tr>
<td style="height:1px;" class="bg_01" colspan="5"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>

<tr>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
<td style="width:180px;" class="bg_02" align="left" valign="middle">

<div class="padding_s">

<img src="./skin/dummy.gif" alt="dummy" style="width:14px;height:14px;" class="icon icon_3">1999年11月30日 00:00

</div>

</td>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
<td style="width:367px;" class="bg_02" align="left" valign="middle">

<div class="padding_s">

<a href="http://gohan.uxu.jp/gohan/2008-01-27/" target="_blank">2008-01-27(11)</a> (えびはらこうすけ)


</div>

</td>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>
<tr>
<td style="height:1px;" class="bg_01" colspan="5"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>
<tr>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
<td style="width:180px;" class="bg_02" align="left" valign="middle">

<div class="padding_s">

<img src="./skin/dummy.gif" alt="dummy" style="width:14px;height:14px;" class="icon icon_3">1999年11月30日 00:00

</div>

</td>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
<td style="width:367px;" class="bg_02" align="left" valign="middle">

<div class="padding_s">

<a href="http://gohan.uxu.jp/gohan/2008-01-28/" target="_blank">2008-01-28(14)</a> (えびはらこうすけ)

</div>

</td>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>
<tr>
<td style="height:1px;" class="bg_01" colspan="5"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>

</table>
<img src="./skin/dummy.gif" alt="dummy" class="v_spacer_m">
</div>
<!-- ここまで:主内容>>最新Blog一覧本体>>のループ部分 -->

<img src="./skin/dummy.gif" alt="dummy" class="v_spacer_l">

</div>
<!-- ここまで:>>最新Blog一覧本体 -->
<!-- ここまで:主内容 -->
<!-- 無し -->
<!-- *ここまで:最新Blog一覧>>内容* -->
</td>
<td class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
</tr>
<tr>
<td style="width:7px;" class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>

<td style="width:636px;" class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
<td style="width:7px;" class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
</tr>
</table>
<!-- ******ここまで:最新Blog一覧****** -->

comment:16 Changed 12 years ago by ogawa

fh_diary_list と h_diary_list_all r5983 でやってみました。

fh_diary_listに関しては暫定対処です。すぐ上のcommentListのパーツに合わせようとしましたが、ddが1行だった場合にdtのfloatがずれてうまくいかなかったので、1行に収まるように横幅を調整しました。

h_diary_list_all の方は他と同じ表示で統一でいいでしょう。

Changed 12 years ago by nakasone

Attachment: #1955_2.GIF added

comment:17 Changed 12 years ago by nakasone

h_invite_tplにおいて、http://trac.openpne.jp/attachment/ticket/1955/%231955_2.GIFのように、日付の欄の背景色が付いており、チェックボックスがあるものはどのように対処したら良いでしょうか

出力されたHTMLは以下です。

<!-- ******ここから:招待一覧****** -->

<form action="./" method="post">
<input type="hidden" name="m" value="pc">
<input type="hidden" name="a" value="do_h_invite_delete_member">
<input type="hidden" name="sessid" value="5263cca2c35c7d647314858df703c81a">
<table border="0" cellspacing="0" cellpadding="0" style="width:580px;" class="border_07">
<tr>
<td style="width:7px;" class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
<td style="width:576px;" class="bg_00"><img src="./skin/dummy.gif" alt="dummy" style="width:566px;height:7px;" class="dummy"></td>
<td style="width:7px;" class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
</tr>
<tr>
<td class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
<td class="bg_01" align="center">
<!-- *ここから:招待一覧>内容* -->
<table border="0" cellspacing="0" cellpadding="0" style="width:574px;" class="border_01">
<tr>
<td style="width:36px;" class="bg_06"><img src="./skin/default/img/content_header_1.gif" style="width:30px;height:20px;" class="dummy"></td>

<td style="width:398px;padding:2px 0px;" class="bg_06"><span class="b_b c_00">招待中メールアドレス一覧</span></td>
<td style="width:140px;" align="right" class="bg_06">&nbsp;</td>
</tr>
</table>
<!-- ここまで:小タイトル -->
<!-- ここから:主内容 -->
<table border="0" cellspacing="0" cellpadding="0" style="width:574px;">
<tr>
<td style="width:574px;height:1px;" class="bg_01" colspan="5"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>
<tr>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
<td style="width:255px;" class="bg_09" align="left" valign="middle">

<div class="c_01" style="padding:5px;">

2008年03月24日

</div>

</td>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
<td style="width:296px;" class="bg_02" align="left" valign="middle">

<div class="padding_s">

<input type="checkbox" name="c_member_id[]" value="15" class="no_bg">&nbsp;nakasone+test@tejimaya.net

</div>

</td>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>
<tr>
<td style="width:574px;height:1px;" class="bg_01" colspan="5"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>

</tr>
<tr>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
<td style="width:255px;" class="bg_09" align="left" valign="middle">

<div class="c_01" style="padding:5px;">

2008年03月05日

</div>

</td>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
<td style="width:296px;" class="bg_02" align="left" valign="middle">

<div class="padding_s">

<input type="checkbox" name="c_member_id[]" value="10" class="no_bg">&nbsp;nakasone+a@tejimaya.net


</div>

</td>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>
<tr>
<td style="width:574px;height:1px;" class="bg_01" colspan="5"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>



<tr>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
<td style="width:572px;" class="bg_03" align="center" valign="middle" colspan="3">

<div style="padding:6px 100px;text-align:center;">

<input type="submit" class="submit" value=" 削  除 ">

</div>

</td>
<td style="width:1px;" class="bg_01" align="center"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>
<tr>
<td style="width:574px;height:1px;" class="bg_01" colspan="5"><img src="./skin/dummy.gif" alt="dot" class="dot"></td>
</tr>
</table>
<!-- ここまで:主内容 -->
<!-- 無し -->
<!-- *ここまで:招待一覧>>内容* -->
</td>
<td class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
</tr>

<tr>
<td style="width:7px;" class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
<td style="width:566px;" class="bg_00"><img src="./skin/dummy.gif" alt="dummy" style="width:566px;height:7px;" class="dummy"></td>
<td style="width:7px;" class="bg_00"><img src="./skin/dummy.gif" alt="square" class="square"></td>
</tr>
</table>
</form>
<!-- ******ここまで:招待一覧****** -->

comment:18 Changed 12 years ago by takai

comment:19 Changed 12 years ago by nakasone

Keywords: パーツ added; テンプレート removed
Owner: changed from nakasone to nobody
Status: assignednew

r5923,r5933,r5934,r5935,r5943,r5944,r6068

で対応しました。

comment:20 Changed 12 years ago by nakasone

r6068でformが二重になっていたものをr6069で修正しました。

comment:21 Changed 12 years ago by ogawa

Keywords: テンプレート確認中 added

comment:22 Changed 11 years ago by nakasone

Keywords: テンプレート added; パーツ テンプレート確認中 removed
Owner: changed from nobody to nakasone
Status: newassigned

bizのテンプレート書き換えをやります。

comment:23 Changed 11 years ago by nakasone

Keywords: パーツ テンプレート確認中 added; テンプレート removed
Owner: changed from nakasone to nobody
Status: assignednew

r6720 で対応しました。

comment:24 Changed 11 years ago by ogawa

Keywords: パーツ テンプレート確認中 removed
Resolution: fixed
Status: newclosed
Note: See TracTickets for help on using tickets.