diff --git a/src/app/pages/relatorios/relatorios.scss b/src/app/pages/relatorios/relatorios.scss index 5c3a1f0..447fae8 100644 --- a/src/app/pages/relatorios/relatorios.scss +++ b/src/app/pages/relatorios/relatorios.scss @@ -299,21 +299,25 @@ /* Table */ .table-wrap { - padding: 10px 12px 14px; + padding: 12px 12px 16px; overflow-x: auto; + background: rgba(255, 255, 255, 0.7); + border-radius: 16px; + border: 1px solid rgba(0, 0, 0, 0.06); + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6); } .tablex { width: 100%; - border-collapse: collapse; + border-collapse: separate; + border-spacing: 0 8px; min-width: 720px; } .tablex th, .tablex td { - padding: 10px 10px; - border-bottom: 1px solid rgba(0, 0, 0, 0.06); - font-weight: 800; + padding: 12px 12px; + font-weight: 700; color: rgba(17, 18, 20, 0.8); text-align: left; white-space: nowrap; @@ -322,11 +326,47 @@ .tablex th { color: rgba(17, 18, 20, 0.65); font-size: 12px; + text-transform: uppercase; + letter-spacing: 0.04em; + padding-bottom: 6px; +} + +.tablex tbody tr { + background: #fff; + box-shadow: 0 8px 16px rgba(17, 18, 20, 0.06); + transition: transform 160ms ease, box-shadow 160ms ease; +} + +.tablex tbody tr:hover { + transform: translateY(-1px); + box-shadow: 0 12px 22px rgba(17, 18, 20, 0.12); +} + +.tablex tbody td { + border-top: 1px solid rgba(17, 18, 20, 0.06); + border-bottom: 1px solid rgba(17, 18, 20, 0.06); + background: rgba(255, 255, 255, 0.96); +} + +.tablex tbody td:first-child { + border-left: 1px solid rgba(17, 18, 20, 0.06); + border-top-left-radius: 12px; + border-bottom-left-radius: 12px; +} + +.tablex tbody td:last-child { + border-right: 1px solid rgba(17, 18, 20, 0.06); + border-top-right-radius: 12px; + border-bottom-right-radius: 12px; +} + +.tablex tbody tr:nth-child(even) td { + background: rgba(248, 249, 255, 0.9); } .muted { color: rgba(17, 18, 20, 0.55); - font-weight: 800; + font-weight: 700; } .cell-strong {