File size: 1,941 Bytes
bec55d2 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 |
/* custom_styles.css */
/* Dark theme styles */
body {
background-color: #1a1a1a; /* Dark background color */
color: #ffffff; /* Light text color */
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; /* Custom font family */
margin: 0; /* Remove default body margin */
}
/* Container styles */
.gradio-interface {
max-width: 800px; /* Limit interface width */
margin: auto; /* Center interface horizontally */
padding: 20px; /* Add padding around the interface */
}
/* Title and description styles */
.gradio-title {
color: #ff5733; /* Custom title color */
font-size: 36px; /* Custom title font size */
margin-bottom: 20px; /* Add space below the title */
}
.gradio-description {
font-size: 18px; /* Custom description font size */
margin-bottom: 20px; /* Add space below the description */
}
/* Button styles */
.gradio-interface input[type="file"] {
background-color: #ff5733; /* Custom button background color */
color: #ffffff; /* Button text color */
font-size: 16px; /* Custom button font size */
padding: 10px 20px; /* Add padding to the button */
border: none; /* Remove button border */
border-radius: 5px; /* Add button border radius */
cursor: pointer; /* Change cursor to pointer on hover */
transition: background-color 0.3s; /* Smooth transition for background color */
}
.gradio-interface input[type="file"]:hover {
background-color: #e64a19; /* Darker background color on hover */
}
/* Output text styles */
.gr-output .gr-output-text {
font-size: 24px; /* Custom output text font size */
margin-top: 20px; /* Add space above the output text */
}
/* Image output styles */
.gr-output .gr-output-image img {
border: 5px solid #ff5733; /* Custom border color for output images */
border-radius: 10px; /* Add border radius to images */
max-width: 100%; /* Ensure images don't exceed container width */
}
|