cumtom table css
unknown
plain_text
5 months ago
3.5 kB
1
Indexable
.table { overflow: auto; width: 100%; border-collapse: collapse; } th { padding: 8px 12px; text-align: left; white-space: nowrap; background-color: #28a745; color: white; border: 1px solid #ddd; min-width: 100px; } .header { display: flex; align-items: center; justify-content: space-between; } .header img { margin-left: 4px; } .slds-table { border-collapse: separate; border-spacing: 0 5px; border: none; width: 100%; table-layout: auto; } .slds-table tr:first-child th { border-radius: 10px 11px 11px 10px; border-right: 3px solid transparent; background-clip: padding-box; } .slds-table tr:first-child th:last-child { border-right: none; } .slds-table td:first-child { border-top-left-radius: 10px; border-bottom-left-radius: 10px; } .slds-table td:last-child { border-top-right-radius: 10px; border-bottom-right-radius: 10px; } .slds-table th { background-color: #00894F; color: #FFFFFF; padding: 12px; text-align: left; width: 100%; } .slds-table td { padding: 10px; font-weight: bold; border: none; border-bottom: 1px solid #e0e0e0; vertical-align: middle; background-color: #E8F7F6; } .slds-table tr { margin: 5px 0; } .slds-table tr:hover { background-color: #f2f2f2; } .slds-table tr:nth-child(even) { background-color: #E8F7F6; } .slds-table .highlight { background-color: #a5d8e0; color: #000; font-weight: bold; } .slds-text-color_error { color: #c80000; text-align: center; } @media (max-width: 600px) { .slds-table { font-size: 14px; } } .th-spacing { position: relative; cursor: pointer; } .dropdown-menus { position: absolute; top: 46px; left: 0px; font-size: 14px; color: #000; padding: 10px !important; text-decoration: none !important; background-color: white; border: 1px solid #ccc; border-radius: 4px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); z-index: 1000; width: max-content; } .dropdown-menus a { text-decoration: none; color: black; margin-bottom: 5px; } .dropdown-menus ul { padding-left: 0px !important; } .dropdown-menus ul li a:hover { background-color: #e0e0e0; } .selected-option { background-color: #0070d2; color: white; font-weight: bold; border-radius: 4px; } .selected-option:hover { background-color: #0056a3; } .content { font-family: 'Lato', sans-serif; } .TermLoan-value-class { background-color: #F9B8C2 !important; border-radius: 5px; padding: 4px; width: fit-content; font-size: 12px !important; margin-right: 5px; } .inprogress-value-class { background-color: #AACFF4 !important; border-radius: 5px; padding: 4px; width: fit-content; font-size: 12px !important; margin-right: 5px; } ::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(119, 119, 119, 0.3); background-color: #F5F5F5; border-radius: 10px !important; } ::-webkit-scrollbar { height: 4px; width: 4px !important; background-color: #F5F5F5; border-radius: 10px !important; } ::-webkit-scrollbar-thumb { background-color: #acacac; border: 2px solid #acacac; border-radius: 10px !important; }
Editor is loading...
Leave a Comment