Skip to content

Commit

Permalink
feat(UI): Improve mobile view (bans list + comms list) - #9
Browse files Browse the repository at this point in the history
  • Loading branch information
@Rushaway
Rushaway authored Jun 5, 2024
1 parent ce80842 commit eefc849
Show file tree
Hide file tree
Showing 5 changed files with 141 additions and 7 deletions.
4 changes: 2 additions & 2 deletions sourcebans-web-theme-fluent/core/header.tpl
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>{$title}</title>
<link rel="Shortcut Icon" href="themes/{$theme}/images/favicon.ico" />
<link rel="stylesheet" type="text/css" href="themes/{$theme}/style/global.css?v05212021" />
<link rel="stylesheet" type="text/css" href="themes/{$theme}/style/global.css.map?v05212021" />
<link rel="stylesheet" type="text/css" href="themes/{$theme}/style/global.css" />
<link rel="stylesheet" type="text/css" href="themes/{$theme}/style/global.css.map" />
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v6.5.2/css/all.css">
<meta name="description" content="Sourcebans for website" />
<script type="text/javascript" src="themes/{$theme}/scripts/sourcebans.js"></script>
Expand Down
65 changes: 64 additions & 1 deletion sourcebans-web-theme-fluent/page_bans.tpl
View file
Original file line number Diff line number Diff line change
Expand Up @@ -117,7 +117,7 @@
<div class="collapse_content">
<div class="padding flex flex-jc:start" style="overflow: auto;">
<ul class="ban_action responsive_show:desktop">
<li class="button button-light">{$ban.demo_link}</li>
<li class="button button-light">{$ban.demo_link}</li>
{if !$login}
<li>
<a class="button button-success" href='index.php?p=login'>Admin ? Sign In</a>
Expand Down Expand Up @@ -148,6 +148,32 @@
{/if}
</ul>
<ul class="ban_list_detal">
<ul class="ban_action responsive_hide:desktop lists-mobile">
{if $view_bans}
{if ($ban.view_edit && !$ban.unbanned)}
<li class="button button-primary lists-mobile">{$ban.edit_link}</li>
{/if}
<li class="button button-success lists-mobile">{$ban.addcomment}</li>
<li class="button button-infos lists-mobile">{$ban.blockcomm_link}</li>
{if ($ban.unbanned == false && $ban.view_unban)}
<li class="button button-important lists-mobile">{$ban.unban_link}</li>
{/if}
{if $ban.unbanned && $ban.reban_link != false}
<li class="button button-important lists-mobile">{$ban.reban_link}</li>
{/if}
{if $ban.type == 0}
{if $groupban}
<li class="button button-important lists-mobile">{$ban.groups_link}</li>
{/if}
{if $friendsban}
<li class="button button-important lists-mobile">{$ban.friend_ban_link}</li>
{/if}
{/if}
{if $ban.view_delete}
<li class="button button-important lists-mobile">{$ban.delete_link}</li>
{/if}
{/if}
</ul>
<li>
<span><i class="fas fa-user"></i> Player</span>
{if empty($ban.player)}
Expand Down Expand Up @@ -309,6 +335,43 @@
</ul>
{/if}
</div>
{if $view_comments}
{if $ban.commentdata != "None"}
<ul class="ban_list_comments responsive_hide:desktop" style="display: contents;">
<div class="layout_box_title">
<h2><i class="fa-solid fa-comments"></i> Comments <i style="font-weight: normal;font-size: smaller;">(from the most recent to the oldest)</i></h2>
</div>
<ul>
{foreach from=$ban.commentdata item="commenta"}
<li>
<div class="layout_box-child padding">
<div class="ban_list_comments_header">
{if !empty($commenta.comname)}
<span class="text:bold">{$commenta.comname|escape:'html'}</span>
{else}
<span class="text:italic">Admin deleted</span>
{/if}
<span>{$commenta.added}</span>
{if $commenta.editcomlink != ""}
{$commenta.editcomlink} {$commenta.delcomlink}
{/if}
</div>
<div class="margin-top flex flex-fd:column">
{$commenta.commenttxt}
{if !empty($commenta.edittime)}
<span class="margin-top:half text:italic">
<i class="fas fa-pencil-alt"></i> Last edit
{$commenta.edittime} by {if !empty($commenta.editname)}{$commenta.editname}{else}<i>Admin deleted</i>{/if}
</span>
{/if}
</div>
</div>
</li>
{/foreach}
</ul>
{/if}
</ul>
{/if}
</div>
</td>
</tr>
Expand Down
58 changes: 57 additions & 1 deletion sourcebans-web-theme-fluent/page_comms.tpl
View file
Original file line number Diff line number Diff line change
Expand Up @@ -139,6 +139,25 @@
{/if}
</ul>
<ul class="ban_list_detal">
<ul class="ban_action responsive_hide:desktop lists-mobile">
{if $view_bans}
{if ($ban.view_edit && (!isset($ban.unbanned) || !$ban.unbanned))}
<li class="button button-primary lists-mobile">{$ban.edit_link}</li>
{/if}
{if $view_comments}
<li class="button button-success lists-mobile">{$ban.addcomment}</li>
{/if}
{if ($ban.unbanned == false && $ban.view_unban)}
<li class="button button-important lists-mobile">{$ban.unban_link}</li>
{/if}
{if isset($ban.unbanned) && $ban.reban_link != false}
<li class="button button-important lists-mobile">{$ban.reban_link}</li>
{/if}
{if $ban.view_delete}
<li class="button button-important lists-mobile">{$ban.delete_link}</li>
{/if}
{/if}
</ul>
<li>
<span><i class="fas fa-user"></i> Player</span>

Expand Down Expand Up @@ -253,7 +272,7 @@
</ul>

{if $view_comments}
<div class="ban_list_comments margin-left">
<div class="ban_list_comments margin-left responsive_show:desktop">
<div class="layout_box_title">
<h2>Comments</h2>
</div>
Expand Down Expand Up @@ -296,6 +315,43 @@
</div>
{/if}
</div>
{if $view_comments}
{if $ban.commentdata != "None"}
<ul class="ban_list_comments responsive_hide:desktop" style="display: contents;">
<div class="layout_box_title">
<h2><i class="fa-solid fa-comments"></i> Comments <i style="font-weight: normal;font-size: smaller;">(from the most recent to the oldest)</i></h2>
</div>
<ul>
{foreach from=$ban.commentdata item="commenta"}
<li>
<div class="layout_box-child padding">
<div class="ban_list_comments_header">
{if !empty($commenta.comname)}
<span class="text:bold">{$commenta.comname|escape:'html'}</span>
{else}
<span class="text:italic">Admin deleted</span>
{/if}
<span>{$commenta.added}</span>
{if $commenta.editcomlink != ""}
{$commenta.editcomlink} {$commenta.delcomlink}
{/if}
</div>
<div class="margin-top flex flex-fd:column">
{$commenta.commenttxt}
{if !empty($commenta.edittime)}
<span class="margin-top:half text:italic">
<i class="fas fa-pencil-alt"></i> Last edit
{$commenta.edittime} by {if !empty($commenta.editname)}{$commenta.editname}{else}<i>Admin deleted</i>{/if}
</span>
{/if}
</div>
</div>
</li>
{/foreach}
</ul>
{/if}
</ul>
{/if}
</div>
</td>
</tr>
Expand Down
19 changes: 17 additions & 2 deletions sourcebans-web-theme-fluent/style/global.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2370,6 +2370,14 @@ hr {
-ms-flex-direction: column;
flex-direction: column;
}
.lists-mobile {
display: inline-flex !important;
justify-content: center !important;
}
.ban_action.responsive_hide\:desktop.lists-mobile {
padding: 5px 10px;
width: max-content;
}
}

/* ================ Main ================ */
Expand Down Expand Up @@ -2463,8 +2471,15 @@ hr {
flex: 0 0 200px;
}

.ban_action li:not(:last-child) {
.ban_action li {
margin-bottom: 10px;
margin-right: 10px;
}

@media screen and (min-width: 980px) {
.ban_action li:not(:last-child) {
margin-bottom: 10px;
}
}

.ban_list_detal {
Expand Down Expand Up @@ -2726,4 +2741,4 @@ html[dir="rtl"] .cMessage_code {
/** ========== Fix Icons.. ========== **/
.fa-facebook:before {
margin-left: 1px;
}
}
2 changes: 1 addition & 1 deletion sourcebans-web-theme-fluent/theme.conf.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
define('theme_author', "aXenDev + .Rushaway + Hackmastr");

// Set the version of the theme here
define('theme_version', "1.8.0 Git 180");
define('theme_version', "1.8.0 Git 182");

// Set the link of the theme here
define('theme_link', "https://github.com/Rushaway/sourcebans-web-theme-fluent/");
Expand Down

0 comments on commit eefc849

Please sign in to comment.