Fix colors for popover

Azure · Aug 8, 2022 · e0c0707 · e0c0707
1 parent ffb4148
commit e0c0707
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 1 deletion.
diff --git a/src/dotnet/APIView/APIViewWeb/Client/css/site.scss b/src/dotnet/APIView/APIViewWeb/Client/css/site.scss
@@ -11,6 +11,7 @@
     --btn-outline-dark: #343a40;
     --monochrome-8: rgb(0 0 0 / 8%);
     --monochrome-2: rgba(0, 0, 0, 0.2);
+    --monochrome-25: rgba(0, 0, 0, 0.25);
     --monochrome-19: rgba(0, 0, 0, 0.19);
     --monochrome-15: rgba(0, 0, 0, 0.15);
     --monochrome-75: rgba(0, 0, 0, .075);
@@ -39,6 +40,7 @@
     --btn-outline-dark: #ccd6df;
     --monochrome-8: rgba(255, 255, 255, 8%);
     --monochrome-2: rgba(255, 255, 255, 0.2);
+    --monochrome-25: rgba(255, 255, 255, 0.25);
     --monochrome-19: rgba(255, 255, 255, 0.19);
     --monochrome-15: rgba(255, 255, 255, 0.15);
     --monochrome-75: rgba(255, 255, 255, .075);
@@ -368,6 +370,31 @@ pre {
     color: var(--text-color);
 }
 
+.popover {
+    border-color: var(--border-color);
+}
+
+.bs-popover-bottom > .arrow::after, .bs-popover-auto[x-placement^="bottom"] > .arrow::after {
+    border-bottom-color: var(--background-color);
+}
+
+.bs-popover-bottom > .arrow::before, .bs-popover-auto[x-placement^="bottom"] > .arrow::before {
+    border-bottom-color: var(--monochrome-25);
+}
+
+.bs-popover-bottom .popover-header::before, .bs-popover-auto[x-placement^="bottom"] .popover-header::before {
+    border-bottom: 1px solid var(--background-color);
+}
+
+.popover-header {
+    background-color: var(--background-color);
+    color: var(--text-color);
+}
+.popover-body {
+    background-color: var(--background-color);
+    color: var(--text-color);
+}
+
 /* Code rendering classes
 ----------------------------------------------------------------------*/
 

diff --git a/src/dotnet/APIView/APIViewWeb/Pages/Assemblies/Revisions.cshtml b/src/dotnet/APIView/APIViewWeb/Pages/Assemblies/Revisions.cshtml
@@ -37,7 +37,7 @@
                             </div>
                         </div>
                         <div class="modal-footer">
-                            <button type="button" class="btn btn-outline-secondary" data-dismiss="modal">Close</button>
+                            <button type="button" class="btn btn-outline-dark" data-dismiss="modal">Close</button>
                             <button type="submit" class="btn btn-primary" onclick="this.form.submit(); this.disabled = true;"><i class="fas fa-cloud-upload-alt"></i> Upload</button>
                         </div>
                     </form>