[frio] Larger clickable area for aside links

This commit is contained in:
Damian Wajer 2023-01-17 19:36:36 +01:00
parent 1e21945658
commit 9dcc0f6f20
3 changed files with 33 additions and 16 deletions

View file

@ -367,6 +367,10 @@ btn-eventnav:hover {
aside .badge {
opacity: 0.7;
}
.forum-widget-entry .badge,
.sidebar-group-li .badge {
margin-top: 6px;
}
/* disabled elements */
.community-content-wrapper > h3,
@ -1044,7 +1048,6 @@ aside .widget,
position: relative;
margin-bottom: 20px;
padding: 10px;
font-size: 13px;
overflow: auto;
}
aside .widget h3,
@ -1052,7 +1055,7 @@ aside .widget h3,
font-weight: bold;
font-size: 16px;
margin: 0;
padding-bottom: 20px;
padding-bottom: 10px;
}
aside .widget ul,
@ -1065,10 +1068,11 @@ aside .widget ul,
list-style: none;
}
aside .widget li .label {
float: left;
}
aside .widget li,
.nav-container .widget li {
padding-top: 2px;
padding-bottom: 2px;
padding-left: 20px;
padding-right: 10px;
}
@ -1081,6 +1085,12 @@ aside .widget li.selected,
border-left: 3px solid $link_color !important;
padding-left: 17px;
}
.side-link-link,
aside .widget li a {
display: block;
padding-top: 6px;
padding-bottom: 6px;
}
aside .widget li a,
aside .widget li a:hover {
color: $font_color_darker;
@ -1300,8 +1310,12 @@ div#sidebar-group-list {
}
.group-edit-tool {
padding-top: 0;
color: $font_color_darker;
}
.sidebar-widget-header .group-edit-tool {
margin-top: -5px;
}
.faded-icon {
color: $font_color_darker;
@ -1316,9 +1330,12 @@ div#sidebar-group-list {
margin-left: 20px;
}
aside #group-sidebar .sidebar-group-li:hover .group-edit-tool.faded-icon,
aside #saved-search-list .saved-search-li:hover .savedsearchdrop.faded-icon,
aside .widget:hover .widget-action.faded-icon {
aside .widget-action {
padding: 5px 10px;
}
aside #group-sidebar .sidebar-group-li .group-edit-tool.faded-icon:hover,
aside #saved-search-list .saved-search-li .savedsearchdrop.faded-icon:hover,
aside .widget.widget-action.faded-icon:hover {
opacity: 0.8;
transition: all 0.25s ease-in-out;
}
@ -1328,7 +1345,7 @@ aside .widget .widget-action.faded-icon:hover {
opacity: 1;
}
aside #group-sidebar li .group-checkbox {
margin: 0;
margin: 6px 0 0;
}
aside #group-sidebar li .group-edit-tool {
padding-right: 10px;

View file

@ -2,7 +2,7 @@
<h3>{{$title}}</h3>
</span>
<div class="widget" id="group-sidebar">
<div id="sidebar-group-header">
<div id="sidebar-group-header" class="sidebar-widget-header">
<span class="fakelink" onclick="openCloseWidget('group-sidebar', 'group-sidebar-inflated');">
<h3>{{$title}}</h3>
</span>
@ -22,7 +22,7 @@
</form>
{{/if}}
</div>
<div id="sidebar-group-list">
<div id="sidebar-group-list" class="sidebar-widget-list">
{{* The list of available groups *}}
<ul role="menu" id="sidebar-group-ul">
{{foreach $groups as $group}}

View file

@ -11,14 +11,14 @@
</form>
{{* Directory links *}}
<div class="side-link" id="side-directory-link"><a href="directory">{{$nv.local_directory}}</a></div>
<div class="side-link" id="side-directory-link"><a href="{{$nv.global_dir}}" target="extlink">{{$nv.directory}}</a></div>
<div class="side-link" id="side-directory-link"><a href="directory" class="side-link-link">{{$nv.local_directory}}</a></div>
<div class="side-link" id="side-directory-link"><a href="{{$nv.global_dir}}" class="side-link-link" target="extlink">{{$nv.directory}}</a></div>
{{* Additional links *}}
<div class="side-link" id="side-match-link"><a href="contact/match">{{$nv.similar}}</a></div>
<div class="side-link" id="side-suggest-link"><a href="contact/suggestions">{{$nv.suggest}}</a></div>
<div class="side-link" id="side-random-profile-link"><a href="randprof" target="extlink">{{$nv.random}}</a></div>
<div class="side-link" id="side-match-link"><a href="contact/match" class="side-link-link">{{$nv.similar}}</a></div>
<div class="side-link" id="side-suggest-link"><a href="contact/suggestions" class="side-link-link">{{$nv.suggest}}</a></div>
<div class="side-link" id="side-random-profile-link"><a href="randprof" class="side-link-link" target="extlink">{{$nv.random}}</a></div>
{{if $nv.inv}}
<div class="side-link" id="side-invite-link"><button type="button" class="btn-link" onclick="addToModal('invite'); return false;">{{$nv.inv}}</button></div>
<div class="side-link" id="side-invite-link"><button type="button" class="btn-link side-link-link" onclick="addToModal('invite'); return false;">{{$nv.inv}}</button></div>
{{/if}}
</div>