styling

src/display/css_html_js.py

@@ -119,101 +119,101 @@
 
 # """
 
-custom_css = """
-/* 1) Load Karbon Font: Make sure this points to your actual font files */
-@font-face {
-    font-family: 'Karbon';
-    src: url('path/to/Karbon.woff2') format('woff2'),
-         url('path/to/Karbon.woff') format('woff');
-    font-weight: normal;
-    font-style: normal;
-}
-
-/* 2) Global Container */
-body, .gradio-container {
-    font-family: 'Karbon', sans-serif;
-    margin: 0;
-    padding: 0;
-    background-color: #fafafa; /* Light background */
-    color: #000000;
-}
-
-.gradio-container {
-    max-width: 1200px; 
-    margin: 0 auto;
-    padding: 2rem 1rem;
-}
-
-/* 3) Headings, with brand color #eb088a */
-h1, h2, h3, h4, h5, h6 {
-    color: #eb088a;
-    margin-bottom: 1rem;
-    font-weight: 600;
-}
-
-/* 4) Intro Block for a slight highlight */
-.intro-block {
-    background-color: #ffe2f1; /* lighter tint of #eb088a */
-    padding: 1.5rem;
-    border-radius: 8px;
-    border: 1px solid #f8badb;
-    margin-bottom: 2rem;
-}
-
-/* 5) Tab styling - remove default orange styling */
-.tab-buttons {
-    margin-top: 1rem;
-    margin-bottom: 1rem;
-    display: flex;
-}
-.tab-buttons > .tabitem {
-    padding: 0.6rem 1.2rem;
-    background-color: #ffffff;
-    border: 1px solid #eb088a;
-    border-radius: 6px;
-    color: #eb088a;
-    margin-right: 5px;
-    cursor: pointer;
-    transition: background-color 0.2s ease, color 0.2s ease;
-    font-weight: 500;
-}
-.tab-buttons > .tabitem.selected {
-    background-color: #eb088a;
-    color: #ffffff;
-}
-.tab-buttons > .tabitem:hover {
-    background-color: #eb088a;
-    color: #ffffff;
-}
-
-/* 6) Dataframe Styling */
-.gr-dataframe table {
-    width: 100%;
-    border-collapse: collapse;
-    border: 1px solid #cccccc;
-    margin-bottom: 2rem;
-}
-.gr-dataframe th {
-    background-color: #eb088a;
-    color: #ffffff;
-    padding: 0.6rem;
-    text-align: left;
-    font-weight: 600;
-}
-.gr-dataframe td {
-    padding: 0.6rem;
-    border-bottom: 1px solid #e0e0e0;
-}
-.gr-dataframe tr:nth-child(even) {
-    background-color: #fdfdfd;
-}
-
-/* 7) Make default markdown text nice */
-.markdown-text p {
-    margin-bottom: 1rem;
-    line-height: 1.6;
-}
-"""
+# custom_css = """
+# /* 1) Load Karbon Font: Make sure this points to your actual font files */
+# @font-face {
+#     font-family: 'Karbon';
+#     src: url('path/to/Karbon.woff2') format('woff2'),
+#          url('path/to/Karbon.woff') format('woff');
+#     font-weight: normal;
+#     font-style: normal;
+# }
+
+# /* 2) Global Container */
+# body, .gradio-container {
+#     font-family: 'Karbon', sans-serif;
+#     margin: 0;
+#     padding: 0;
+#     background-color: #fafafa; /* Light background */
+#     color: #000000;
+# }
+
+# .gradio-container {
+#     max-width: 1200px; 
+#     margin: 0 auto;
+#     padding: 2rem 1rem;
+# }
+
+# /* 3) Headings, with brand color #eb088a */
+# h1, h2, h3, h4, h5, h6 {
+#     color: #000000;
+#     margin-bottom: 1rem;
+#     font-weight: 600;
+# }
+
+# /* 4) Intro Block for a slight highlight */
+# .intro-block {
+#     background-color: #ffe2f1; /* lighter tint of #eb088a */
+#     padding: 1.5rem;
+#     border-radius: 8px;
+#     border: 1px solid #f8badb;
+#     margin-bottom: 2rem;
+# }
+
+# /* 5) Tab styling - remove default orange styling */
+# .tab-buttons {
+#     margin-top: 1rem;
+#     margin-bottom: 1rem;
+#     display: flex;
+# }
+# .tab-buttons > .tabitem {
+#     padding: 0.6rem 1.2rem;
+#     background-color: #ffffff;
+#     border: 1px solid #eb088a;
+#     border-radius: 6px;
+#     color: #eb088a;
+#     margin-right: 5px;
+#     cursor: pointer;
+#     transition: background-color 0.2s ease, color 0.2s ease;
+#     font-weight: 500;
+# }
+# .tab-buttons > .tabitem.selected {
+#     background-color: #eb088a;
+#     color: #ffffff;
+# }
+# .tab-buttons > .tabitem:hover {
+#     background-color: #eb088a;
+#     color: #ffffff;
+# }
+
+# /* 6) Dataframe Styling */
+# .gr-dataframe table {
+#     width: 100%;
+#     border-collapse: collapse;
+#     border: 1px solid #cccccc;
+#     margin-bottom: 2rem;
+# }
+# .gr-dataframe th {
+#     background-color: #eb088a;
+#     color: #ffffff;
+#     padding: 0.6rem;
+#     text-align: left;
+#     font-weight: 600;
+# }
+# .gr-dataframe td {
+#     padding: 0.6rem;
+#     border-bottom: 1px solid #e0e0e0;
+# }
+# .gr-dataframe tr:nth-child(even) {
+#     background-color: #fdfdfd;
+# }
+
+# /* 7) Make default markdown text nice */
+# .markdown-text p {
+#     margin-bottom: 1rem;
+#     line-height: 1.6;
+# }
+# """
 
 
 get_window_url_params = """