diff --git a/web/src/ui/components/AnchorLink/AnchorLink.js b/web/src/ui/components/AnchorLink/AnchorLink.js
index 4f3e22ae..a2b504b9 100644
--- a/web/src/ui/components/AnchorLink/AnchorLink.js
+++ b/web/src/ui/components/AnchorLink/AnchorLink.js
@@ -16,7 +16,7 @@ const AnchorLink = ({
'badge-secondary',
styles.badge,
)
- const iconClasses = classNames(styles['copy-link-icon'], { [styles.block]: isBlock })
+ const iconClasses = classNames(styles.copyLinkIcon, isBlock ? styles.block : styles.inline)
const location = useLocation()
return (
diff --git a/web/src/ui/components/AnchorLink/AnchorLink.module.scss b/web/src/ui/components/AnchorLink/AnchorLink.module.scss
index 79a48218..4ab71ee4 100644
--- a/web/src/ui/components/AnchorLink/AnchorLink.module.scss
+++ b/web/src/ui/components/AnchorLink/AnchorLink.module.scss
@@ -4,17 +4,24 @@
position: absolute;
}
-.copy-link-icon {
+.copyLinkIcon.inline {
+ cursor: pointer;
+ display: flex;
+ svg {
+ height: $font-size-sm;
+ }
+ @include xs {
+ display: none;
+ }
+}
+
+.copyLinkIcon.block {
display: none;
@include xs {
+ display: flex;
cursor: pointer;
- display: block;
- height: 1rem;
- &.block {
- display: flex;
- width: 100%;
- justify-content: center;
- margin-top: 0.5rem;
- }
+ width: 100%;
+ justify-content: center;
+ margin-top: 0.5rem;
}
}
diff --git a/web/src/ui/components/Build/ArtifactRow.js b/web/src/ui/components/Build/ArtifactRow.js
index 24100311..35cb2258 100644
--- a/web/src/ui/components/Build/ArtifactRow.js
+++ b/web/src/ui/components/Build/ArtifactRow.js
@@ -36,6 +36,12 @@ const QrCode = ({ artifactPlistSignedUrl, closeAction }) => (
)
+export const SharableArtifactLink = ({ buildId, artifactKind, isBlock }) => (
+