Spaces:
Running
Running
CSS = """ | |
.bmc-button { | |
padding: 2px 5px; | |
border-radius: 5px; | |
background-color: #FF813F; | |
color: white; | |
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3); | |
text-decoration: none; | |
display: inline-block; | |
font-size: 20px; | |
margin: 2px; | |
cursor: pointer; | |
-webkit-transition: background-color 0.3s ease; | |
-ms-transition: background-color 0.3s ease; | |
transition: background-color 0.3s ease; | |
} | |
.bmc-button:hover, | |
.bmc-button:active, | |
.bmc-button:focus { | |
background-color: #FF5633; | |
} | |
.markdown { | |
margin-bottom: 0; | |
padding-bottom: 0; | |
} | |
.tabs { | |
margin-top: 0; | |
padding-top: 0; | |
} | |
#md_project a { | |
color: black; | |
text-decoration: none; | |
} | |
#md_project a:hover { | |
text-decoration: underline; | |
} | |
""" | |
MARKDOWN = """ | |
### [Whisper Web-UI](https://github.com/jhj0517/Whsiper-WebUI) | |
""" | |
NLLB_VRAM_TABLE = """ | |
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<style> | |
table { | |
border-collapse: collapse; | |
width: 100%; | |
} | |
th, td { | |
border: 1px solid #dddddd; | |
text-align: left; | |
padding: 8px; | |
} | |
th { | |
background-color: #f2f2f2; | |
} | |
</style> | |
</head> | |
<body> | |
<details> | |
<summary>VRAM usage for each model</summary> | |
<table> | |
<thead> | |
<tr> | |
<th>Model name</th> | |
<th>Required VRAM</th> | |
</tr> | |
</thead> | |
<tbody> | |
<tr> | |
<td>nllb-200-3.3B</td> | |
<td>~16GB</td> | |
</tr> | |
<tr> | |
<td>nllb-200-1.3B</td> | |
<td>~8GB</td> | |
</tr> | |
<tr> | |
<td>nllb-200-distilled-600M</td> | |
<td>~4GB</td> | |
</tr> | |
</tbody> | |
</table> | |
<p><strong>Note:</strong> Be mindful of your VRAM! The table above provides an approximate VRAM usage for each model.</p> | |
</details> | |
</body> | |
</html> | |
""" |