]> git.mxchange.org Git - friendica.git/commitdiff
[frio] Larger clickable area for dropdown menus
authorDamian Wajer <damian@damianwajer.com>
Tue, 17 Jan 2023 19:01:34 +0000 (20:01 +0100)
committerDamian Wajer <damian@damianwajer.com>
Thu, 19 Jan 2023 18:48:16 +0000 (19:48 +0100)
view/theme/frio/css/style.css
view/theme/frio/templates/common_tabs.tpl

index 785dad51e2c96abe5af8e23d0de9037ad9430d80..89291e524fee05d1ff44a2e5f4fb85c096c35fc5 100644 (file)
@@ -816,8 +816,8 @@ nav.navbar .nav > li > button:focus {
        font-weight: bold;
 }
 #topbar-first .dropdown.account li#nav-sitename {
-       padding-left: 15px;
-       padding-right: 15px;
+       padding-left: 20px;
+       padding-right: 20px;
        font-weight: bold;
        word-break: break-word;
 }
@@ -967,13 +967,15 @@ ul li .intro-wrapper button.intro-action-link {
        background-color: $nav_bg;
        border: none;
 }
+.dropdown-menu .divider {
+       margin: 5px 0;
+}
 .nav-pills .dropdown-menu li.divider,
 .nav-tabs .dropdown-menu li.divider,
 .account .dropdown-menu li.divider,
 .contact-photo-wrapper .dropdown-menu li.divider {
        background-color: $menu_background_hover_color;
        border-bottom: none;
-       margin: 9px 1px !important;
 }
 .nav-pills .dropdown-menu li > a,
 .nav-tabs .dropdown-menu li > a,
@@ -991,8 +993,6 @@ ul li .intro-wrapper button.intro-action-link {
 .contact-photo-wrapper .dropdown-menu li .btn-link {
        color: $nav_icon_color;
        font-weight: 400;
-       font-size: 13px;
-       padding: 4px 15px;
        width: 100%;
        text-align: left;
 }
@@ -2188,6 +2188,10 @@ the section element. Only after we have
 moved it to the nav through js */
        display: none !important;
 }
+.tabbar-wrapper__link {
+       padding-right: 10px;
+       padding-left: 10px;
+}
 #tabmenu,
 .tabbar-wrapper,
 .tabbar,
@@ -2217,7 +2221,8 @@ ul.tabs li {
 }
 ul.tabs li a {
        display: block;
-       padding: 11px 10px;
+       padding-top: 11px;
+       padding-bottom: 11px;
 }
 ul.tabs li:hover,
 ul.tabs li.active {
@@ -2249,6 +2254,12 @@ ul.dropdown-menu li:hover {
        box-sizing: border-box;
 }
 /* Dropdown Menu */
+.dropdown-menu li .btn-link,
+.dropdown-menu li a,
+.tabs .dropdown-menu li a {
+       padding: 6px 20px;
+       font-size: 14px;
+}
 .dropdown-menu li a,
 .dropdown-menu li .btn-link {
        color: $font_color_darker;
index 0f95d1a549d5a8a4fa4cb68a3d0396fc4d259b43..306fa27cd43cf6cf1f55c2595d8d0e4ef3e52952 100644 (file)
@@ -6,7 +6,7 @@
                        <ul class="tabs flex-nav" role="menu">
                                {{foreach $tabs as $tab}}
                                        <li id="{{$tab.id}}" role="presentation" {{if $tab.sel}} class="{{$tab.sel}}" {{/if}}>
-                                               <a role="menuitem" href="{{$tab.url}}" {{if $tab.accesskey}}accesskey="{{$tab.accesskey}}" {{/if}}
+                                               <a role="menuitem" class="tabbar-wrapper__link" href="{{$tab.url}}" {{if $tab.accesskey}}accesskey="{{$tab.accesskey}}" {{/if}}
                                                        {{if $tab.title}} title="{{$tab.title}}" {{/if}}>
                                                        {{$tab.label}}
                                                </a>
@@ -37,7 +37,7 @@
                                {{foreach $tabs as $tab}}
                                        {{if $tab.sel}}
                                                <li id="{{$tab.id}}-xs" role="presentation" {{if $tab.sel}} class="{{$tab.sel}}" {{/if}}>
-                                                       <a role="menuitem" href="{{$tab.url}}" {{if $tab.title}} title="{{$tab.title}}" {{/if}}>
+                                                       <a role="menuitem" class="tabbar-wrapper__link" href="{{$tab.url}}" {{if $tab.title}} title="{{$tab.title}}" {{/if}}>
                                                                {{$tab.label}}
                                                        </a>
                                                </li>