From d6c21df15cc7796e5792eb6eed8e4e9ed296ef94 Mon Sep 17 00:00:00 2001 From: Kelli Shaver <kelli@kellishaver.com> Date: Fri, 20 Apr 2012 13:17:02 -0400 Subject: [PATCH] cleaning up kb category, faq list, and minor cleanup on faq view --- assets/default/css/theme.css | 86 +++++++++++++++--- assets/default/images/kb_category_bg.png | Bin 0 -> 937 bytes assets/default/images/kb_large_folder.png | Bin 0 -> 2527 bytes include/client/faq.inc.php | 5 +- include/client/knowledgebase.inc.php | 103 ++++++++++------------ 5 files changed, 126 insertions(+), 68 deletions(-) create mode 100644 assets/default/images/kb_category_bg.png create mode 100644 assets/default/images/kb_large_folder.png diff --git a/assets/default/css/theme.css b/assets/default/css/theme.css index d004c4069..3f1cb699c 100644 --- a/assets/default/css/theme.css +++ b/assets/default/css/theme.css @@ -379,19 +379,33 @@ body { font-size: 15px; margin-left: 0; padding-left: 0; + border-top:1px solid #ddd; } #faq ol li { list-style: none; - margin: 0 0 10px 0; + margin: 0; + padding:0; color: #999; } #faq ol li a { - display: block; - height: 16px; + display:block; + padding:5px 0; + height:auto !important; + overflow:hidden; + margin:0; + border-bottom:1px solid #ddd; line-height: 16px; padding-left: 24px; background: url('../images/icons/page.png?1319579499') 0 50% no-repeat; } +#faq ol li a:hover { + background-color:#e9f5ff; +} + +.article-meta { + padding:5px; + background:#fafafa; +} /* Knowledgebase */ #kb { @@ -401,12 +415,21 @@ body { } #kb > li { - margin: 0 0 5px 0; - padding: 10px; - width: auto; - float: left; - clear: both; - list-style: none; + padding:10px; + height:auto !important; + overflow:hidden; + margin:0; + background:url(../images/kb_category_bg.png) bottom left repeat-x; + border-bottom:1px solid #ddd; +} + +#kb li i { + display:block; + width:32px; + height:32px; + float:left; + margin-right:6px; + background:url(../images/kb_large_folder.png) top left no-repeat; } #kb > li h4 { @@ -420,10 +443,51 @@ body { #kb > li h4 a { font-size: 14px; - padding-left: 24px; - background: url('../images/icons/page.png?1319579499') 0 50% no-repeat; } +#kb-search { + padding:10px 0; + overflow:hidden; +} + +#kb-search div { + clear:both; + overflow:hidden; + padding-top:5px; +} + +#kb-search #query { + margin:0; + display:inline-block; + float:left; + width:200px; + margin-right:5px; +} + +#kb-search #cid { + margin:0; + display:inline-block; + float:left; + width:200px; + margin-right:5px; + position:relative; + top:2px; +} + +#kb-search #topic-id { + margin:0; + display:inline-block; + float:left; + width:410px; +} + +#kb-search #searchSubmit { + margin:0; + display:inline-block; + float:left; + position:relative; + top:2px; +} #breadcrumbs { color: #333; diff --git a/assets/default/images/kb_category_bg.png b/assets/default/images/kb_category_bg.png new file mode 100644 index 0000000000000000000000000000000000000000..174d675f4c491060a413232bdef7e0e9298df60e GIT binary patch literal 937 zcmaJ=O^?z*8162Y&Bndx!DwPKcCXSeptKE@6b4)pOAs*P#aP+_8n&G}9i(tHUib;# z_7@mAc=F(36Ql7T_$R!2Tc>=j2i7LjnRoI$&-=_f?<`u)Cnv}Ek2#JzX`I0}n-ADf zj}F;?ape7E(>+@2(GDKasY4KFdAN^2BXEYOjT~?G<_9WqT!#0%J=(LM8ZHh5C&dU! z5HU8#mC8xvxMM^?9}WG`<bQwp$^+js`4<ISvZE>*`Db&2I`d}NosV7J<I9ghDKVHp zfT#nK;5>|t#N=1H23x1wA`ey&IyU*Wsh-^eRZI{l2vXLSR0*iEAm{SMV(}4BBv}$A zMU<7STr_fuAxU8K@hlth21Xm!H@R43@*_$kLlmdesW8n6m<&Z(*Y#9GQL+q?jb|Zs zl57~CZWSPkUE)X7$00}+oj#sWlV?uXM+l;wY#49K#0n-RP9(~LlpbjdwC(>xgJ6e_ zX&YVp-76e-XAu(HD8>`wvWpv>rl}&MN{~Y_>0*4otzv70DUL@t0@Y3d*pBOmX}rSQ zw$TV<>Vz(8K$B+*g713<RH0_&b5$*;RAsp)TXG#jShp$_O;ZbUeanT|odhVPTdsG_ zg*S53RtO@N86x7pMP8lY0IZH|_<OuqimvCidO=fa%6>0vuD8d_hO6Gl6`2_^z1V*) zdb`ECCtdE^mIb@UM<MHW!rJ=ot7jwjBpx)N)lGi&|6E;_?_@HU7vH{z@0ZKP!{x!@ ZE$;cn?U$b}KYUIfPovg^A1kll{RKO=A^!jX literal 0 HcmV?d00001 diff --git a/assets/default/images/kb_large_folder.png b/assets/default/images/kb_large_folder.png new file mode 100644 index 0000000000000000000000000000000000000000..144fa828a3fc83613dd7a5b29368b6da290fd09d GIT binary patch literal 2527 zcmaJ@XIN9&77b;16eElRQUqcsG9oGT1Q;nPfC*rTN|%saAV3mG0-;xllqUiX3OFDg zq$+KcDuOZ$WoSwr8I%D9L7cIJ@`5AI`|*7D`|dqwpKq<T_t|^>xG9eIc(A0BBnSio z+uC4Af)%p!ii-)poQQ~*f<=*wb>=#;e7HOc8vt3-Sl$4{mO=3aNC1Tv9^4O@fj}Zq zI@y`)OeCPGEC!6SgMo!Hf&^?3$n02H5QQ25a3S7+FP&))ecsjuh0tl{(9?!Q1Tn}O z@T1#AumPtCdond5fQq6)k9`j@3quP87yy?731b8@Ip{ER=qFvYV83$=heAF<xB=$S zzl(AvIzp^jYye^iL+DZwMhJ)z5{A?_Fg7+m3eiI#5paYa9I2;^G)C*|p%Dnk=Lagt z#-{n8Nf_McT!P3P>c`~<q2X{Ij|b!F!&q!zI1+_I?P%!f=?W0KoNy+W5~j=KsP8IZ z01lN+58~2UOvsKR#hVqvHHQi+{rd`xpf9pa&gV7>8U_!e1i_Io#Lks=fkfi}hcXyn z&>Sua_^00gDa;{<2LW&rz+r{3se-}zsPCi-LR+%|3YWzuvsi(<U3BzgaakNcRuIJ6 z$q+)MQ0dH__!FK;MB6esTndv4*ka6~0tFbIPD5jiFea7;1_%><J!>Qqi?l@IFc=KZ z(#p!j#K;hd+vQ?d)DQ;1<nD55|8S9C<?dL45hTcr0oe3VfQDnU7?4j_M$^Aqi$3<N zdY`$puhycE`zjYMC<eYW*#8>z?vcPfJKHa|6$D?54=@F8XA5j?#sXe|Kw?g|7)x^4 z%;M?ef#j14ABQ`5OkebcmT~)Yo$>OncdSZl5J~_=b|Ohat2MJBE8F|uItQLu?NhdT zWapj?o4AR1#4pV8^G;4x3YQi6(=Yz}iu^Z^hoe=uIi};`+?m4e>l<3Jk?S4H1>2_c z+uQT8{NUji5V(Z&ThcFy>iG0H<Wf4g#{!{%NgfO~5yca>%HAX(kpm43QLFgh8cMaN z3G4VCqgxub8Gh-u^A+QCza-(_#+87msCHyrWV_WR`g-U=U+IgbeY37TZRnEx1NCRR zURXnOx26n+s#US0nlAjl$CfvmiXy$eYSTjJDwOY0e;+RJ>Dta*fB5jDpDzY1YE5_* z;ewEz8#TQiJaBdYe)!PfU{sEsmczxruF|ma1dD^-lB=K-5Bkq1w$>d}+tX~;L=QrY z-EX#(Y;Nvvc`VcM-CTZt4=GAQeYS<N+++G-ZH=<MxVY$MT=(JC;MUxni_^)j!a|Qi z@YJ)b!i5)FZ$55+J@K$ZouRU(_sza(chx3S+Mg&IHVUj#4p0xtTNh>EZ<fjR^z=Mg zU!O+mNAp&*Q*<`LwPAXhgm!g!eF{$QCt(XERM?%0DQfPIVkq9Z>1l~+gs#tMo9vp2 z14vtT-MxPDoLp*3W-)GFCN6<e<T&AIFt{}8QKAecMqcUsFw;;ousG*(S!mXvAUb3_ zW4SFLcn<wW=U^Bzd{wJ;Gh)upQTrOk8<h_3@XMfYXsgOL3HvNBW!RL<s2gc3etX8X zw=TcrNiwFeYGr>eVJWMUAEJn0Fr#7)rN3R%^iu?X7(GRBa7Y~KnOqDRIIi&nae;hN zI(Wt65J*+2qS0k==vVdQ3&DZ^Dk#^IJT8=<pD!NDM5!u9zkEyD>rg(dcC5{Fuk*|! zk408NVs@J4iW2UUyl1LzaaoB7pKhTooVcgimYpwU6ga#3piNon>V<X20q&^Y=;U~! z*TwjCV$4yG;n<|^%d_;nhca==W!NTHKHtw^WsGQe{#w7=)Nk`?#hx0=gL3jbSYtOP z=@x1sWcl)U@-FpH(OVj{Q5(}b&jO8+j+pnSKsgNUyG_~w>#AoDH>li5O8TR>SmR1w zUa@HWss;Jt&ze;-#-fir5#K`aj0J>?sjI7-yH;NR!8`<FL|Q)@KOtmOxo8*}54xRW z=W2YmSk?-fiGf}1+ZsH&FAZ5KYT=#b+y~sl?-l+CLP;lMboxyW^J#CNhP$~bh$R*C zyg;cq<zLDq8Z~QkMdlW=AS0Ke9MLW6s$Js1BFL&L!Ra(G7IOmI8LL@2_H$asnBt1c zvk%7h1X(*ugQm;-CgC_!X4efu)z*?{VF<>ow<uaUV-$51pW~Hkk%}B@e%hfR)hzd% z(YZCea3^Q8t0Bhm=o|O!sf7zt960%KQSVcAe<Lm)z-^b9TSmRsm&h0%v9VXQ)9Wf9 zYsd@spq9$G{Zy?0d2Z0(R729@7#Qo=+*6snB^7u7op-k7{p;MrGrZaj6Z=0J-L*ut z2Gq#N+b&5$h1K;UccHvr#jL&=fE`J%8r`_RS?g0Hv_UwMZ-#Dp<$Q7<N&H|9Nc>!M z@{n6ohNzpUd$LURLwG$v0f#CH8Sg2=KHHo*Qn)6SU*d|@n6Xc}n<7+F${e0aYka?4 z1Jm@6ms081$l^bH(N3y9D{OI1vUT&0Mt6A|em3+-uxEB))cwW?#~PoON`>Pue^AEv z@#O=ga!j)}v_lE53GS!x`<p#RB~IVXEuyTz6BnwF6zv%+7oC)HsjFOB5bN+lNo*Rk zibMTxDe5RJgs#ED6Hi#LtnQPo^O=J7ksedk=j*Z_dEKtw%X)dMAushn<xrJQg+jO0 z`4<h{hU+c-R+Ol_na-6WWkeeG#`<A!q$S$vIzPeUki&lP_)yH{c-#{CN4BR>?`q8+ z++rrS&v<;KmM0zf{oKt1GTRj~lTYU^m)ScPN)G};(05hoZB1EYa(8rmV^5U{1p;{{ z>e{J<a(DmI>{{BWbzclhZB1D`*YWvgz1o#w#Ryo^xLQZ&^BLCsTq$0vX@Q&@uSM~- z??k<RITd;4<LP7Fq%<dAyWzi}%hifg7Fv5H{ZBeCZoX|hVbXXvvz`l2e=uS5u3hT) f*zMJ~EFm!v+9DqF+TUq$=a<VCYmce3@=Ev*VlFMW literal 0 HcmV?d00001 diff --git a/include/client/faq.inc.php b/include/client/faq.inc.php index c944f8316..65f770e96 100644 --- a/include/client/faq.inc.php +++ b/include/client/faq.inc.php @@ -6,7 +6,7 @@ $category=$faq->getCategory(); ?> <h1>Frequently Asked Questions</h1> <div id="breadcrumbs"> - <a href="index.php">All Categories</a> + <a href="index.php">All Categories</a> » <a href="faq.php?cid=<? echo $category->getId(); ?>"><? echo $category->getName(); ?></a> </div> <div style="width:700;padding-top:2px; float:left;"> @@ -23,7 +23,8 @@ if($faq->getNumAttachments()) { ?> <div><span class="faded"><b>Attachments:</b></span> <?php echo $faq->getAttachmentsLinks(); ?></div> <? }?> -<div><span class="faded"><b>Help Topics:</b></span> + +<div class="article-meta"><span class="faded"><b>Help Topics:</b></span> <?php echo ($topics=$faq->getHelpTopics())?implode(', ',$topics):' '; ?> </div> </p> diff --git a/include/client/knowledgebase.inc.php b/include/client/knowledgebase.inc.php index 83484e95d..d8f402e7b 100644 --- a/include/client/knowledgebase.inc.php +++ b/include/client/knowledgebase.inc.php @@ -3,61 +3,53 @@ if(!defined('OSTCLIENTINC')) die('Access Denied'); ?> <h1>Frequently Asked Questions</h1> -<form action="index.php" method="get" style="padding-top:15px;"> +<form action="index.php" method="get" id="kb-search"> <input type="hidden" name="a" value="search"> - <table border="0" cellspacing="0" cellpadding="3"> - <tr> - <td width="440"> - <input id="query" type="text" size="20" name="q" value="<?php echo Format::htmlchars($_REQUEST['q']); ?>"> - <select name="cid"> - <option value="">— All Categories —</option> - <?php - $sql='SELECT category_id, name, count(faq.category_id) as faqs ' - .' FROM '.FAQ_CATEGORY_TABLE.' cat ' - .' LEFT JOIN '.FAQ_TABLE.' faq USING(category_id) ' - .' WHERE cat.ispublic=1 AND faq.ispublished=1 ' - .' GROUP BY cat.category_id ' - .' HAVING faqs>0 ' - .' ORDER BY cat.name DESC '; - if(($res=db_query($sql)) && db_num_rows($res)) { - while($row=db_fetch_array($res)) - echo sprintf('<option value="%d" %s>%s (%d)</option>', - $row['category_id'], - ($_REQUEST['cid'] && $row['category_id']==$_REQUEST['cid']?'selected="selected"':''), - $row['name'], - $row['faqs']); - } - ?> - </select> - </td> - <td width="100" rowspan="2" style="text-align:left;vertical-align: middle;"> - <input id="searchSubmit" type="submit" value="Search"> - </td> - </tr> - <tr> - <td width="400"> - <select name="topicId" style="width:350px;"> - <option value="">— All Help Topics —</option> - <?php - $sql='SELECT ht.topic_id, ht.topic, count(faq.topic_id) as faqs ' - .' FROM '.TOPIC_TABLE.' ht ' - .' LEFT JOIN '.FAQ_TOPIC_TABLE.' faq USING(topic_id) ' - .' WHERE ht.ispublic=1 ' - .' GROUP BY ht.topic_id ' - .' HAVING faqs>0 ' - .' ORDER BY ht.topic DESC '; - if(($res=db_query($sql)) && db_num_rows($res)) { - while($row=db_fetch_array($res)) - echo sprintf('<option value="%d" %s>%s (%d)</option>', - $row['topic_id'], - ($_REQUEST['topicId'] && $row['topic_id']==$_REQUEST['topicId']?'selected="selected"':''), - $row['topic'], $row['faqs']); - } - ?> - </select> - </td> - </tr> - </table> + <div> + <input id="query" type="text" size="20" name="q" value="<?php echo Format::htmlchars($_REQUEST['q']); ?>"> + <select name="cid" id="cid"> + <option value="">— All Categories —</option> + <?php + $sql='SELECT category_id, name, count(faq.category_id) as faqs ' + .' FROM '.FAQ_CATEGORY_TABLE.' cat ' + .' LEFT JOIN '.FAQ_TABLE.' faq USING(category_id) ' + .' WHERE cat.ispublic=1 AND faq.ispublished=1 ' + .' GROUP BY cat.category_id ' + .' HAVING faqs>0 ' + .' ORDER BY cat.name DESC '; + if(($res=db_query($sql)) && db_num_rows($res)) { + while($row=db_fetch_array($res)) + echo sprintf('<option value="%d" %s>%s (%d)</option>', + $row['category_id'], + ($_REQUEST['cid'] && $row['category_id']==$_REQUEST['cid']?'selected="selected"':''), + $row['name'], + $row['faqs']); + } + ?> + </select> + <input id="searchSubmit" type="submit" value="Search"> + </div> + <div> + <select name="topicId" id="topic-id"> + <option value="">— All Help Topics —</option> + <?php + $sql='SELECT ht.topic_id, ht.topic, count(faq.topic_id) as faqs ' + .' FROM '.TOPIC_TABLE.' ht ' + .' LEFT JOIN '.FAQ_TOPIC_TABLE.' faq USING(topic_id) ' + .' WHERE ht.ispublic=1 ' + .' GROUP BY ht.topic_id ' + .' HAVING faqs>0 ' + .' ORDER BY ht.topic DESC '; + if(($res=db_query($sql)) && db_num_rows($res)) { + while($row=db_fetch_array($res)) + echo sprintf('<option value="%d" %s>%s (%d)</option>', + $row['topic_id'], + ($_REQUEST['topicId'] && $row['topic_id']==$_REQUEST['topicId']?'selected="selected"':''), + $row['topic'], $row['faqs']); + } + ?> + </select> + </div> </form> <hr> <div> @@ -100,9 +92,10 @@ if($_REQUEST['q'] || $_REQUEST['cid'] || $_REQUEST['topicId']) { //Search. echo '<div>Click on the category to browse FAQs.</div> <ul id="kb">'; while($row=db_fetch_array($res)) { - + echo sprintf(' <li> + <i></i> <h4><a href="faq.php?cid=%d">%s (%d)</a></h4> %s </li>',$row['category_id'], -- GitLab