namirasoft-site-react 1.3.371 → 1.3.372

package/src/components/NSHeader.module.css

@@ -1,270 +1,270 @@
-.ns_header {
-    width: 100%;
-}
-
-.ns_navbar {
-    min-height: 96px;
-    /* background-color: #0000004d !important; */
-    position: relative;
-    z-index: 10;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-}
-
-.ns_navbar_content {
-    display: flex;
-    justify-content: space-between;
-    width: 100%;
-    gap: 8px;
-}
-
-.ns_navbar_login_status {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-}
-
-.ns_navbar_usersname {
-    color: #fff !important;
-    font-size: 16px;
-    font-weight: 400;
-    margin-right: 8px;
-}
-
-.ns_navbar_menu_icon {
-    display: none;
-}
-
-.ns_navbar_elements ul {
-    display: flex;
-    justify-content: space-between;
-    list-style-type: none;
-}
-
-.ns_navbar_elements ul li:not(:last-child) {
-    margin-right: 60px;
-}
-
-.ns_navbar_elements ul a {
-    font-size: 16px;
-    font-weight: 400;
-    color: #2f234f;
-    text-decoration: none;
-}
-
-.ns_navbar_elements ul a.ns_navbar_active {
-    color: #574c4c;
-    font-weight: 500;
-    position: relative;
-}
-
-.ns_navbar_elements ul a.ns_navbar_active::after {
-    content: "";
-    position: absolute;
-    bottom: -4px;
-    left: 0;
-    width: 100%;
-    height: 2px;
-    background-color: #574c4c;
-}
-
-.ns_header_icon {
-    outline: none;
-    border: none;
-    background: none;
-    padding: 0;
-    position: relative;
-}
-
-.ns_navbar_items_container {
-    margin-right: auto;
-    margin-inline-end: auto;
-    --bs-nav-link-padding-x: 1rem;
-    --bs-nav-link-padding-y: 0.5rem;
-    --bs-nav-link-font-weight: ;
-    --bs-nav-link-color: var(--bs-link-color);
-    --bs-nav-link-hover-color: var(--bs-link-hover-color);
-    --bs-nav-link-disabled-color: var(--bs-secondary-color);
-    display: flex;
-    flex-wrap: wrap;
-    padding-left: 0;
-    margin-bottom: 0;
-    list-style: none;
-}
-
-.ns_navbar_items_link {
-    display: block;
-    padding: 8px 16px;
-    font-size: var(--bs-nav-link-font-size);
-    font-weight: var(--bs-nav-link-font-weight);
-    color: var(--bs-nav-link-color);
-    text-decoration: none;
-    background: 0 0;
-    border: 0;
-    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out;
-}
-
-.ns_navbar_first_level_item {
-    color: #fff;
-}
-
-.ns_navbar_first_level_item a:hover {
-    background-color: rgba(178, 187, 217, 1);
-}
-
-@media (max-width: 768px) {
-    .ns_navbar_elements ul li:not(:last-child) {
-        margin-right: 30px;
-    }
-}
-
-.ns_navbar_parent_content {
-    display: flex;
-    align-items: center;
-    padding-left: 1rem;
-    padding-right: 1rem;
-    margin-left: auto;
-    margin-right: auto;
-}
-
-@media only screen and (min-width: 1024px) {
-
-    .ns_navbar_parent_content {
-        padding-right: 1rem;
-        padding-left: 1rem;
-    }
-
-    .ns_navbar_parent_content img {
-        cursor: pointer;
-    }
-
-    .ns_navbar_parent_content img:hover {
-        opacity: 0.5;
-    }
-
-    .ns_nav_second_item .dropdown-menu {
-        margin-top: -20% !important;
-        margin-left: 100%;
-    }
-}
-
-.ns_navbar_first_level_item a {
-    color: #fff;
-}
-
-.ns_navbar_second_level_item a {
-    color: #000 !important;
-    width: 100%;
-}
-
-.ns_navbar_second_level_item a:hover {
-    background-color: rgba(178, 187, 217, 1);
-}
-
-.ns_navbar_second_level_item {
-    color: #000 !important;
-    width: 100%;
-
-}
-
-.ns_navbar_title {
-    color: #fff;
-    font-size: 16px;
-
-}
-
-.ns_navbar_notification:hover {
-    opacity: 0.5;
-}
-
-.ns_navbar_notification_count {
-    width: 20px;
-    height: 20px;
-    background-color: #ff0000;
-    color: rgba(255, 255, 255, 1);
-    border-radius: 50%;
-    font-size: 10px;
-    font-weight: 600;
-    position: absolute;
-    text-align: center;
-    right: -8px;
-    top: -10px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    align-self: center;
-    animation-name: scale;
-    animation-duration: 1s;
-    animation-iteration-count: infinite;
-    animation-timing-function: ease-out;
-}
-
-@keyframes scale {
-    from {
-        scale: 1;
-    }
-
-    to {
-        scale: 1.2;
-    }
-}
-
-@media (max-width: 1024px) {
-    .ns_navbar_first_level_item:hover {
-        background-color: #FFFFFF1A;
-    }
-
-    .ns_navbar_items_link {
-        width: 100%;
-        border-bottom: 0.5px solid transparent;
-        border-image: linear-gradient(90deg, #ffffff00 0%, rgb(0, 0, 0, 40%), #ffffff00 100%);
-        border-image-slice: 1;
-    }
-
-    .ns_navbar_menu_icon {
-        display: block;
-        cursor: pointer;
-    }
-
-    .ns_navbar_elements {
-        position: absolute;
-        right: 0;
-        top: 96px;
-        width: 0px;
-        height: calc(100vh - 60px);
-        transition: all 0.3s ease-in;
-        overflow: hidden;
-        /* background-color: rgb(0 15 53 / 98%) !important; */
-    }
-
-    .ns_navbar_elements.ns_navbar_active {
-        width: 100%;
-        text-align: center;
-    }
-
-    .ns_navbar_elements ul {
-        display: flex;
-        flex-direction: column;
-    }
-
-    .ns_navbar_elements ul li {
-        margin-right: unset;
-        margin-top: 22px;
-    }
-
-    .ns_navbar_elements div {
-        flex-direction: column;
-        align-content: center;
-        background: #141B5CCC;
-        box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
-        backdrop-filter: blur(42.150001525878906px);
-        width: 100%;
-        transform: translate3d(0px, 0, 0px) !important;
-        position: relative !important;
-    }
-
-    .ns_navbar_second_level_item {
-        color: #fff !important;
-    }
+.ns_header {
+    width: 100%;
+}
+
+.ns_navbar {
+    min-height: 96px;
+    /* background-color: #0000004d !important; */
+    position: relative;
+    z-index: 10;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.ns_navbar_content {
+    display: flex;
+    justify-content: space-between;
+    width: 100%;
+    gap: 8px;
+}
+
+.ns_navbar_login_status {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.ns_navbar_usersname {
+    color: #fff !important;
+    font-size: 16px;
+    font-weight: 400;
+    margin-right: 8px;
+}
+
+.ns_navbar_menu_icon {
+    display: none;
+}
+
+.ns_navbar_elements ul {
+    display: flex;
+    justify-content: space-between;
+    list-style-type: none;
+}
+
+.ns_navbar_elements ul li:not(:last-child) {
+    margin-right: 60px;
+}
+
+.ns_navbar_elements ul a {
+    font-size: 16px;
+    font-weight: 400;
+    color: #2f234f;
+    text-decoration: none;
+}
+
+.ns_navbar_elements ul a.ns_navbar_active {
+    color: #574c4c;
+    font-weight: 500;
+    position: relative;
+}
+
+.ns_navbar_elements ul a.ns_navbar_active::after {
+    content: "";
+    position: absolute;
+    bottom: -4px;
+    left: 0;
+    width: 100%;
+    height: 2px;
+    background-color: #574c4c;
+}
+
+.ns_header_icon {
+    outline: none;
+    border: none;
+    background: none;
+    padding: 0;
+    position: relative;
+}
+
+.ns_navbar_items_container {
+    margin-right: auto;
+    margin-inline-end: auto;
+    --bs-nav-link-padding-x: 1rem;
+    --bs-nav-link-padding-y: 0.5rem;
+    --bs-nav-link-font-weight: ;
+    --bs-nav-link-color: var(--bs-link-color);
+    --bs-nav-link-hover-color: var(--bs-link-hover-color);
+    --bs-nav-link-disabled-color: var(--bs-secondary-color);
+    display: flex;
+    flex-wrap: wrap;
+    padding-left: 0;
+    margin-bottom: 0;
+    list-style: none;
+}
+
+.ns_navbar_items_link {
+    display: block;
+    padding: 8px 16px;
+    font-size: var(--bs-nav-link-font-size);
+    font-weight: var(--bs-nav-link-font-weight);
+    color: var(--bs-nav-link-color);
+    text-decoration: none;
+    background: 0 0;
+    border: 0;
+    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out;
+}
+
+.ns_navbar_first_level_item {
+    color: #fff;
+}
+
+.ns_navbar_first_level_item a:hover {
+    background-color: rgba(178, 187, 217, 1);
+}
+
+@media (max-width: 768px) {
+    .ns_navbar_elements ul li:not(:last-child) {
+        margin-right: 30px;
+    }
+}
+
+.ns_navbar_parent_content {
+    display: flex;
+    align-items: center;
+    padding-left: 1rem;
+    padding-right: 1rem;
+    margin-left: auto;
+    margin-right: auto;
+}
+
+@media only screen and (min-width: 1024px) {
+
+    .ns_navbar_parent_content {
+        padding-right: 1rem;
+        padding-left: 1rem;
+    }
+
+    .ns_navbar_parent_content img {
+        cursor: pointer;
+    }
+
+    .ns_navbar_parent_content img:hover {
+        opacity: 0.5;
+    }
+
+    .ns_nav_second_item .dropdown-menu {
+        margin-top: -20% !important;
+        margin-left: 100%;
+    }
+}
+
+.ns_navbar_first_level_item a {
+    color: #fff;
+}
+
+.ns_navbar_second_level_item a {
+    color: #000 !important;
+    width: 100%;
+}
+
+.ns_navbar_second_level_item a:hover {
+    background-color: rgba(178, 187, 217, 1);
+}
+
+.ns_navbar_second_level_item {
+    color: #000 !important;
+    width: 100%;
+
+}
+
+.ns_navbar_title {
+    color: #fff;
+    font-size: 16px;
+
+}
+
+.ns_navbar_notification:hover {
+    opacity: 0.5;
+}
+
+.ns_navbar_notification_count {
+    width: 20px;
+    height: 20px;
+    background-color: #ff0000;
+    color: rgba(255, 255, 255, 1);
+    border-radius: 50%;
+    font-size: 10px;
+    font-weight: 600;
+    position: absolute;
+    text-align: center;
+    right: -8px;
+    top: -10px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    align-self: center;
+    animation-name: scale;
+    animation-duration: 1s;
+    animation-iteration-count: infinite;
+    animation-timing-function: ease-out;
+}
+
+@keyframes scale {
+    from {
+        scale: 1;
+    }
+
+    to {
+        scale: 1.2;
+    }
+}
+
+@media (max-width: 1024px) {
+    .ns_navbar_first_level_item:hover {
+        background-color: #FFFFFF1A;
+    }
+
+    .ns_navbar_items_link {
+        width: 100%;
+        border-bottom: 0.5px solid transparent;
+        border-image: linear-gradient(90deg, #ffffff00 0%, rgb(0, 0, 0, 40%), #ffffff00 100%);
+        border-image-slice: 1;
+    }
+
+    .ns_navbar_menu_icon {
+        display: block;
+        cursor: pointer;
+    }
+
+    .ns_navbar_elements {
+        position: absolute;
+        right: 0;
+        top: 96px;
+        width: 0px;
+        height: calc(100vh - 60px);
+        transition: all 0.3s ease-in;
+        overflow: hidden;
+        /* background-color: rgb(0 15 53 / 98%) !important; */
+    }
+
+    .ns_navbar_elements.ns_navbar_active {
+        width: 100%;
+        text-align: center;
+    }
+
+    .ns_navbar_elements ul {
+        display: flex;
+        flex-direction: column;
+    }
+
+    .ns_navbar_elements ul li {
+        margin-right: unset;
+        margin-top: 22px;
+    }
+
+    .ns_navbar_elements div {
+        flex-direction: column;
+        align-content: center;
+        background: #141B5CCC;
+        box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+        backdrop-filter: blur(42.150001525878906px);
+        width: 100%;
+        transform: translate3d(0px, 0, 0px) !important;
+        position: relative !important;
+    }
+
+    .ns_navbar_second_level_item {
+        color: #fff !important;
+    }
 }