menus.scss 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. .com-menus{
  2. width:100%;
  3. height:68px;
  4. overflow: hidden;
  5. overflow-x: auto;
  6. background:#f3f3f3;
  7. padding-top:5px;
  8. &::-webkit-scrollbar {
  9. width:5px;
  10. height:5px;
  11. background-color: #CCC;
  12. }
  13. &::-webkit-scrollbar-thumb{
  14. background-color:#b9deff;
  15. }
  16. .menus-out{
  17. width:100%;
  18. height:100%;
  19. }
  20. .group-item{
  21. display:flex;
  22. flex-direction: row;
  23. font-size:12px;
  24. margin-right: 10px;
  25. float:left;
  26. /* background:#e2e2e2; */
  27. margin-left:5px;
  28. border-radius: 5px;
  29. padding-top:5px;
  30. padding-bottom:5px;
  31. .items-name{
  32. font-size:14px;
  33. display: flex;
  34. width:25px;
  35. justify-content: center;
  36. align-items: center;
  37. margin-left:10px;
  38. border-right:1px solid #CCC;
  39. font-weight: bold;
  40. }
  41. .menus{
  42. display: flex;
  43. justify-content:center;
  44. align-items: center;
  45. .menu{
  46. display: flex;
  47. flex-direction: column;
  48. align-items: center;
  49. justify-content:center;
  50. width:60px;
  51. .icon{
  52. width:32px;
  53. height:32px;
  54. display: flex;
  55. align-items: center;
  56. justify-content:center;
  57. .svg-style{
  58. width:24px;
  59. height:24px;
  60. }
  61. }
  62. }
  63. }
  64. }
  65. .group-item0{
  66. /* width:500px; */
  67. overflow: hidden;
  68. }
  69. }