[Dark Theme] Fix reserved icon error and updated default icon image (#…

…10041)
NuGet · Jun 24, 2024 · 7127734 · 7127734
1 parent 5355aa3
commit 7127734
Show file tree

Hide file tree

Showing 10 changed files with 31 additions and 22 deletions.
diff --git a/src/Bootstrap/dist/css/bootstrap-theme.css b/src/Bootstrap/dist/css/bootstrap-theme.css
diff --git a/src/Bootstrap/less/theme/page-add-organization.less b/src/Bootstrap/less/theme/page-add-organization.less
@@ -4,6 +4,10 @@
     margin-bottom: 6px;
   }
 
+  .package-default-icon {
+    content: var(--default-package-icon, url(../img/default-package-icon-256x256.png));
+  }
+
   .required:after {
     color: var(--statusDangerStroke2Rest);
     content: " *";

diff --git a/src/Bootstrap/less/theme/page-display-package.less b/src/Bootstrap/less/theme/page-display-package.less
@@ -66,6 +66,7 @@
         width: 18px;
         margin-right: 5px;
         margin-left: 2px;
+        color: var(--brandBackground1Rest);
       }
 
       .prefix-reserve-label {
@@ -359,6 +360,7 @@
       margin-bottom: 3px;
       margin-left: 2px;
       vertical-align: middle;
+      color: var(--brandBackground1Rest);
     }
   }
 
@@ -517,6 +519,10 @@
       margin-bottom: -1px;
       background-color: transparent;
 
+      i {
+        color: var(--brandStrokeCompoundRest);
+      }
+
       &:hover {
         border-bottom-color: var(--brandStrokeCompoundHover);
         border-bottom-width: 2px;

diff --git a/src/NuGetGallery/Areas/Admin/Views/ReservedNamespace/Index.cshtml b/src/NuGetGallery/Areas/Admin/Views/ReservedNamespace/Index.cshtml
@@ -180,12 +180,7 @@
                                 <td>
                                     @if (pr.IsVerified)
                                     {
-                                        <img class="img-responsive"
-                                             src="~/Content/gallery/img/reserved-indicator.svg"
-                                             alt="Reserved namespace icon"
-                                             width="24" height="24"
-                                             @ViewHelpers.ImageFallback(Url.Absolute("~/Content/gallery/img/reserved-indicator-256x256.png"))
-                                             title="@Strings.ReservedNamespace_ReservedIndicatorTooltip" />
+                                        <i class="ms-Icon ms-Icon--SkypeCircleCheck reserved-indicator" title="@Strings.ReservedNamespace_ReservedIndicatorTooltip" alt="Reserved namespace icon"></i>
                                     }
                                 </td>
                                 <td>@pr.DownloadCount.ToNuGetNumberString()</td>

diff --git a/src/NuGetGallery/Content/gallery/css/bootstrap.min.css b/src/NuGetGallery/Content/gallery/css/bootstrap.min.css
diff --git a/src/NuGetGallery/NuGetGallery.csproj b/src/NuGetGallery/NuGetGallery.csproj
@@ -1386,6 +1386,7 @@
     <Content Include="Content\gallery\img\circuit-board-light-theme.svg" />
     <Content Include="Content\gallery\img\default-package-icon-256x256.png" />
     <Content Include="Content\gallery\img\default-package-icon.svg" />
+    <Content Include="Content\gallery\img\default-package-icon-white.png" />
     <Content Include="Content\gallery\img\dotnet-foundation-42x42.png" />
     <Content Include="Content\gallery\img\dotnet-foundation.svg" />
     <Content Include="Content\gallery\img\facebook-24x24.png" />

diff --git a/src/NuGetGallery/Views/Organizations/Add.cshtml b/src/NuGetGallery/Views/Organizations/Add.cshtml
@@ -26,14 +26,13 @@
             <div>
                 <aside class="col-sm-3 col-sm-push-9">
                     <b>Logo</b>
-                    <img src="@Url.Absolute("~/Content/gallery/img/default-package-icon-256x256.png")" 
-                         class="owner-image img-responsive" 
-                         height="332" 
-                         id="gravatar-image" 
-                         width="332" 
-                         alt="gravatar" 
-                         title="Organization logo" 
-                         aria-label="Organization logo">
+                    <img class="package-icon img-responsive owner-image package-default-icon"
+                         height="332"
+                         id="gravatar-image"
+                         width="332"
+                         alt="gravatar"
+                         title="Organization logo"
+                         aria-label="Organization logo" />
                     <p class="ms-font-s">
                         We use the organization's name and its verified email address to get its publicly visible Gravatar profile picture
                         (or a default image if it does not have a Gravatar profile picture). Please go to gravatar.com to change the profile picture for your organization.

diff --git a/src/NuGetGallery/Views/Packages/DisplayPackage.cshtml b/src/NuGetGallery/Views/Packages/DisplayPackage.cshtml
@@ -281,14 +281,14 @@
 
                         @if (Model.IsVerified.HasValue && Model.IsVerified.Value)
                         {
-                        }
                             <span class="prefix-reserve-title">
                                 <i class="ms-Icon ms-Icon--SkypeCircleCheck reserved-indicator" data-content="@Strings.ReservedNamespace_ReservedIndicatorTooltip" tabindex="0"
                                    alt="@Strings.ReservedNamespace_ReservedIndicatorTooltip"></i>
                                 <a href="https://docs.microsoft.com/nuget/nuget-org/id-prefix-reservation" class="prefix-reserve-label">
                                     Prefix Reserved
                                 </a>
                             </span>
+                        }
                     </div>
                 }
                 else

diff --git a/src/NuGetGallery/Views/Shared/_ListPackage.cshtml b/src/NuGetGallery/Views/Shared/_ListPackage.cshtml
@@ -50,7 +50,7 @@
                 @if (Model.IsVerified.HasValue && Model.IsVerified.Value)
                 {
                     <i class="ms-Icon ms-Icon--SkypeCircleCheck reserved-indicator"
-                        data-content="@Strings.ReservedNamespace_ReservedIndicatorTooltip" tabindex="0" alt="@Strings.ReservedNamespace_ReservedIndicatorTooltip"/>
+                        data-content="@Strings.ReservedNamespace_ReservedIndicatorTooltip" tabindex="0" alt="@Strings.ReservedNamespace_ReservedIndicatorTooltip"></i>
                 }
 
                 @if (showEditButton && (Model.CanEdit || Model.CanManageOwners || Model.CanUnlistOrRelist))

diff --git a/src/NuGetGallery/Views/Users/Packages.cshtml b/src/NuGetGallery/Views/Users/Packages.cshtml
@@ -222,11 +222,7 @@
                 <tbody data-bind="foreach: Namespaces">
                     <tr class="manage-package-listing" data-bind="visible: Visible">
                         <td class="align-middle hidden-xs">
-                            <img class="reserved-indicator-icon img-responsive"
-                                 src="~/Content/gallery/img/reserved-indicator.svg"
-                                 alt="Reserved namespace icon"
-                                 @ViewHelpers.ImageFallback(Url.Absolute("~/Content/gallery/img/reserved-indicator-256x256.png"))
-                                 title="@Strings.ReservedNamespace_ReservedIndicatorTooltip" />
+                            <i class="ms-Icon ms-Icon--SkypeCircleCheck reserved-indicator" title="@Strings.ReservedNamespace_ReservedIndicatorTooltip" alt="Reserved namespace icon"></i>
                         </td>
                         <td class="align-middle reserved-id">
                             <a data-bind="text: Pattern, attr: { href: SearchUrl, target: '_blank' }"></a>