drupal - porpavljen dropdown user menu na malih zaslonih

frontend/drupal9/web/themes/custom/pro1ka/css/style.css

@@ -2274,15 +2274,23 @@ nav.tabs {
       background-color: #fff;
       color: #1e88e5; }
 
-#user-menu {
+#user-menu,
+#user-menu-mobile {
   position: absolute; }
-  #user-menu ul.user-menu-link {
+  #user-menu ul.user-menu-link,
+  #user-menu-mobile ul.user-menu-link {
     list-style: none;
+    background-color: white;
     padding-inline-start: 0;
     border: 1px solid #D1D1D1;
     padding: 10px 15px;
     margin-top: 6px; }
 
+#user-menu-mobile ul.user-menu-link {
+  margin-left: 20px;
+  border-left: 2px solid #D1D1D1;
+  background-color: unset; }
+
 .mobile-nav-menu {
   position: fixed;
   left: 0%;

frontend/drupal9/web/themes/custom/pro1ka/js/login.js

@@ -54,6 +54,11 @@
       jQuery('#user-menu').toggle();
     });
 
+    // Odpremo drop down menu za uporabnika
+    jQuery('#user-login-menu-mobile').on('click', function () {
+      jQuery('#user-menu-mobile').toggle();
+    });
+
     // Obnovitev gesla
     jQuery('#open-modal-lost-password').on('click', function () {
       jQuery('#modal-login').hide();

frontend/drupal9/web/themes/custom/pro1ka/sass/components/_menu.scss

@@ -329,11 +329,13 @@ nav.tabs {
   }
 }
 
-#user-menu {
+#user-menu,
+#user-menu-mobile {
   position: absolute;
-  
+
   ul.user-menu-link {
     list-style: none;
+    background-color: white;
     padding-inline-start: 0;
     border: 1px solid $siva;
     padding: 10px 15px;
@@ -341,6 +343,14 @@ nav.tabs {
   }
 }
 
+#user-menu-mobile{
+  ul.user-menu-link {
+    margin-left: 20px;
+    border-left: 2px solid #D1D1D1;
+    background-color: unset;
+  }
+}
+
 .mobile-nav-menu {
   position: fixed;
   left: 0%;

frontend/drupal9/web/themes/custom/pro1ka/templates/parts/header.html.twig

@@ -112,12 +112,12 @@
 
     {% if uporabnik is not empty %}
       <div class="usem-menu">
-        <a href="#" class="login" id="user-login-menu">
+        <a href="#" class="login" id="user-login-menu-mobile">
           {{ uporabnik }}
           <img src="/tema1ka/svg/icons8-chevron-right.svg" loading="lazy" alt="" class="button-right-arrow"
                 style="transform: rotateZ(90deg);">
         </a>
-        <div id="user-menu" style="display: none;">
+        <div id="user-menu-mobile" style="display: none;">
           <div name="odjava" method="post" action="/api/drupal/logout">
             <ul class="user-menu-link">
               <li>