| """ |
| CSS and styling for the GuardBench Leaderboard. |
| """ |
|
|
| custom_css = """ |
| .markdown-text { |
| font-size: 16px !important; |
| text-align: justify !important; |
| } |
| |
| .tab-buttons button.selected { |
| border-color: #2196F3 !important; |
| background: #E3F2FD !important; |
| color: #2196F3 !important; |
| } |
| |
| #citation-button textarea { |
| font-family: monospace !important; |
| } |
| |
| .leaderboard-container { |
| margin-top: 20px; |
| } |
| |
| .category-header { |
| font-weight: bold; |
| background-color: #f5f5f5; |
| padding: 10px; |
| margin-top: 15px; |
| border-radius: 5px; |
| } |
| |
| .metric-name { |
| font-weight: bold; |
| color: #2196F3; |
| } |
| |
| .model-name { |
| font-weight: bold; |
| } |
| |
| .model-link:hover { |
| text-decoration: underline; |
| color: #1976D2; |
| } |
| |
| .version-selector { |
| margin: 0 !important; |
| padding: 5px; |
| border-radius: 5px; |
| } |
| |
| .version-selector label { |
| font-weight: bold; |
| color: #2196F3; |
| } |
| |
| .version-selector select { |
| border-color: #2196F3; |
| border-radius: 4px; |
| } |
| |
| /* Make sure the version selector is properly aligned with refresh button */ |
| .version-selector > .block { |
| padding: 0 !important; |
| } |
| |
| .version-selector > .block > .wrap { |
| position: relative; |
| top: -5px; |
| } |
| """ |
|
|
