Gold Saucer

.gitignore

@@ -1,3 +1,4 @@
 /.vscode
 .prettierrc
 .prettierignore
+DEVTools/PSD

Assets/css/GoldSaucer.css

@@ -591,6 +591,20 @@ body.gs_page {
   background-size: 32px 32px;
   content: "";
 }
+.gs_sm_head.mahjong {
+  margin-left: 12px;
+}
+.gs_sm_head.mahjong:after {
+  content: "";
+  display: block;
+  width: 8px;
+  height: 8px;
+  border-radius: 4px;
+  background: #999999;
+  position: absolute;
+  left: -12px;
+  top: 6px;
+}
 
 .gs_icon {
   padding-left: 36px;
@@ -925,15 +939,34 @@ table {
 
 /* Маджонг */
 .ga_mahjong {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
+  display: grid;
+  grid-auto-flow: column;
 }
 
 .gs_menu_wrapper {
   width: 320px;
 }
 
+.gs_menu_nav {
+  position: fixed;
+}
+.gs_menu_nav_inner {
+  width: 305px;
+  max-height: 745px;
+  overflow-x: auto;
+}
+.gs_menu_nav_inner::-webkit-scrollbar {
+  width: 12px;
+  height: 10px;
+  background-color: transparent;
+  border: 4px solid transparent;
+}
+.gs_menu_nav_inner::-webkit-scrollbar-thumb {
+  border: 4px solid transparent;
+  background-clip: padding-box;
+  background-color: #585858;
+  border-radius: 15px;
+}
 .gs_menu_nav_haider {
   position: relative;
   color: #59514c;
@@ -997,6 +1030,9 @@ table {
   color: #585858;
   font-weight: bold;
 }
+.gs_menu_nav_anchor li a.active {
+  color: #e57e17;
+}
 .gs_menu_nav_sub {
   display: grid;
   grid-template-rows: 0fr;