[TikiWiki-commits] [Git][tikiwiki/tiki][master] [FIX][UI] Updated wiki page and comment rating forms to use Bootstrap classes...

Gary Cunningham-Lee pushed to branch master at Tiki Wiki CMS Groupware / Tiki


Commits:
64bf0b5d by Gary Cunningham-Lee at 2026-03-22T23:51:50+09:00
[FIX][UI] Updated wiki page and comment rating forms to use Bootstrap classes...
---
* [FIX][UI] Updated wiki page and comment rating forms to use Bootstrap classes and added fieldset and legend elements to improve accessibility standards compliance. Also fixed bad spacing on tiki-forum_rankings.php.

See merge request tikiwiki/tiki!9815

- - - - -


5 changed files:

- lib/smarty_tiki/FunctionHandler/RatingResult.php
- templates/comment/list_inner.tpl
- templates/rating.tpl
- templates/tiki-ranking.tpl
- templates/tiki-show_page.tpl


Changes:

=====================================
lib/smarty_tiki/FunctionHandler/RatingResult.php
=====================================
@@ -42,6 +42,6 @@ class RatingResult extends Base
             return smarty_function_rating_result_avg($params, $smarty->getEmptyInternalTemplate());
         }
 
-        return "<table class='ratingDeliberationResultTable' style='width:100%;'><tr>" . $tableBody . "</tr></table>";
+        return "<table class='ratingDeliberationResultTable w-100 mt-2'><tr>" . $tableBody . "</tr></table>";
     }
 }


=====================================
templates/comment/list_inner.tpl
=====================================
@@ -64,10 +64,14 @@
                             {/if}
                         {/if}
                         {if $comment.userName ne $user and $comment.approved eq 'y' and $allow_vote}
+                            <div class="commentRating d-inline-block ms-3">
                             <form class="commentRatingForm" method="post">
-                                {rating type="comment" id=$comment.threadId}
-                                <input type="hidden" name="id" value="{$comment.threadId}" />
-                                <input type="hidden" name="type" value="comment" />
+                                <fieldset>
+                                    <legend class="fs-6">{tr}Rate this comment:{/tr}</legend>
+                                    {rating type="comment" id=$comment.threadId}
+                                    <input type="hidden" name="id" value="{$comment.threadId}" />
+                                    <input type="hidden" name="type" value="comment" />
+                                </fieldset>
                             </form>
                             {jq}
                                 var crf = $('form.commentRatingForm').on("submit", function() {
@@ -102,7 +106,7 @@
                                 </div>
                             </div>
                         {/if}
-
+                            </div>
                     </div>{* End of comment-footer *}
                 </div>{* End of comment-item *}
                 {if ! $level || $prefs.comments_threshold_indent eq '0' || $level lt $prefs.comments_threshold_indent}


=====================================
templates/rating.tpl
=====================================
@@ -1,27 +1,35 @@
 <div class="rating">
     {if $prefs.rating_smileys eq 'y'}
         {foreach from=$rating_options item=v key=i}
-            <input type="radio" class="form-check-input" name="rating_value[{$rating_type|escape}][{$rating_id|escape}]" value="{$v|escape}" id="{$rating_type|escape}{$rating_id|escape}_{$v|escape}"{if $current_rating eq $v} checked="checked"{/if}>
-            <label class="form-label" for="{$rating_type|escape}{$rating_id|escape}_{$v|escape}">
-                    <img src="{$rating_smiles[$i].img|escape}" title="{tr}User rating:{/tr} {$v|escape}" alt="{tr}User rating{/tr}">
-            </label>
+            <div class="form-check form-check-inline">
+                <input type="radio" class="form-check-input" name="rating_value[{$rating_type|escape}][{$rating_id|escape}]" value="{$v|escape}" id="{$rating_type|escape}{$rating_id|escape}_{$v|escape}"{if $current_rating eq $v} checked="checked"{/if}>
+                <label class="form-check-label" for="{$rating_type|escape}{$rating_id|escape}_{$v|escape}">
+                        <img src="{$rating_smiles[$i].img|escape}" title="{tr}User rating:{/tr} {$v|escape}" alt="{tr}User rating{/tr}">
+                </label>
+            </div>
         {/foreach}
     {elseif $rating_has_labels}
         {if $prefs.rating_options_reversed eq 'y'}
             {foreach from=$rating_options|array_reverse item=v key=i}
-                <input type="radio" class="form-check-input" name="rating_value[{$rating_type|escape}][{$rating_id|escape}]" value="{$i|escape}" id="{$rating_type|escape}{$rating_id|escape}_{$v|escape}" {if $current_rating == $v}checked="checked"{/if}>
-                <label class="form-label" for="{$rating_type|escape}{$rating_id|escape}_{$v|escape}">{$v|escape}</label>
+                <div class="form-check form-check-inline">
+                    <input type="radio" class="form-check-input" name="rating_value[{$rating_type|escape}][{$rating_id|escape}]" value="{$i|escape}" id="{$rating_type|escape}{$rating_id|escape}_{$v|escape}" {if $current_rating == $v}checked="checked"{/if}>
+                    <label class="form-check-label" for="{$rating_type|escape}{$rating_id|escape}_{$v|escape}">{$v|escape}</label>
+                </div>
             {/foreach}
         {else}
             {foreach from=$rating_options item=v key=i}
-                <input type="radio" class="form-check-input" name="rating_value[{$rating_type|escape}][{$rating_id|escape}]" value="{$i|escape}" id="{$rating_type|escape}{$rating_id|escape}_{$v|escape}" {if $current_rating == $v}checked="checked"{/if}>
-                <label for="{$rating_type|escape}{$rating_id|escape}_{$v|escape}">{$v|escape}</label>
+                <div class="form-check form-check-inline">
+                    <input type="radio" class="form-check-input" name="rating_value[{$rating_type|escape}][{$rating_id|escape}]" value="{$i|escape}" id="{$rating_type|escape}{$rating_id|escape}_{$v|escape}" {if $current_rating == $v}checked="checked"{/if}>
+                    <label class="form-check-label" for="{$rating_type|escape}{$rating_id|escape}_{$v|escape}">{$v|escape}</label>
+                </div>
             {/foreach}
         {/if}
     {else}
         {foreach from=$rating_options item=v key=i}
-            <input type="radio" class="form-check-input" name="rating_value[{$rating_type|escape}][{$rating_id|escape}]" value="{$v|escape}" id="{$rating_type|escape}{$rating_id|escape}_{$v|escape}"{if $current_rating eq $v} checked="checked"{/if}>
-            <label for="{$rating_type|escape}{$rating_id|escape}_{$v|escape}">{$v|escape}</label>
+            <div class="form-check form-check-inline">
+                <input type="radio" class="form-check-input" name="rating_value[{$rating_type|escape}][{$rating_id|escape}]" value="{$v|escape}" id="{$rating_type|escape}{$rating_id|escape}_{$v|escape}"{if $current_rating eq $v} checked="checked"{/if}>
+                <label class="form-check-label" for="{$rating_type|escape}{$rating_id|escape}_{$v|escape}">{$v|escape}</label>
+            </div>
         {/foreach}
     {/if}
     <input type="hidden" name="rating_prev[{$rating_type|escape}][{$rating_id|escape}]" value="{$current_rating|escape}">


=====================================
templates/tiki-ranking.tpl
=====================================
@@ -6,6 +6,7 @@
                     <option value="{$allrankings[ix].value|escape}" {if $which eq $allrankings[ix].value}selected="selected"{/if}>{$allrankings[ix].name}</option>
                 {/section}
             </select>
+            <br>
             <select name="limit" class="form-select me-3 mb-4">
                 <option value="10" {if $limit eq 10}selected="selected"{/if}>{tr}Top 10{/tr}</option>
                 <option value="20" {if $limit eq 20}selected="selected"{/if}>{tr}Top 20{/tr}</option>
@@ -15,7 +16,7 @@
         </div>
 
         {if $categIdstr}<input type="hidden" name="categId" value="{$categIdstr}">{/if}
-        <input type="submit" class="btn btn-primary mb-4" name="selrank" value="{tr}View{/tr}">
+        <input type="submit" class="btn btn-primary mb-4 ms-4" name="selrank" value="{tr}View{/tr}">
     </form>
 
 {section name=ix loop=$rankings}


=====================================
templates/tiki-show_page.tpl
=====================================
@@ -198,9 +198,11 @@ Note: The show content block must be defined at root level to use the include. A
 
     <footer class="form-text">
         {if $prefs.wiki_simple_ratings eq 'y' && $tiki_p_wiki_vote_ratings eq 'y'}
-            {tr}Rate this page:{/tr}
             <form method="post" action="">
-                {rating type="wiki page" id=$page_id}
+                <fieldset>
+                    <legend>{tr}Rate this page:{/tr}</legend>
+                    {rating type="wiki page" id=$page_id}
+                </fieldset>
             </form>
         {/if}
 



View it on GitLab: https://gitlab.com/tikiwiki/tiki/-/commit/64bf0b5de1b8cd8b11b82eff25c570e5f8bdf634

-- 
View it on GitLab: https://gitlab.com/tikiwiki/tiki/-/commit/64bf0b5de1b8cd8b11b82eff25c570e5f8bdf634
You're receiving this email because of your account on gitlab.com. Manage all notifications: https://gitlab.com/-/profile/notifications | Help: https://gitlab.com/help

_______________________________________________
TikiWiki-cvs mailing list
[email protected]
https://lists.sourceforge.net/lists/listinfo/tikiwiki-cvs