Skip to content

Commit 868f65a

Browse files
committed
@W-21859986 Polish install modal and copy feedback styles
- Lighter modal overlay and shadow, remove header border - Command code block: single-line ellipsis, compact padding, #DDEFFF bg - Copy in modal closes it and shows Copied! on main button - Copied! feedback uses green text only, keeps existing background
1 parent b234d1b commit 868f65a

2 files changed

Lines changed: 21 additions & 28 deletions

File tree

scripts/portal_generator/assets/portal.js

Lines changed: 8 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -3185,18 +3185,13 @@ function copyInstallFromModal(slug, buttonEl) {
31853185
if (!codeEl) return;
31863186
var command = codeEl.textContent;
31873187
navigator.clipboard.writeText(command).then(function() {
3188-
if (!buttonEl) return;
3189-
var label = buttonEl.querySelector('span');
3190-
if (!label) return;
3191-
var saved = label.textContent;
3192-
label.textContent = 'Copied!';
3193-
buttonEl.style.color = '#04844B';
3194-
buttonEl.style.borderColor = '#04844B';
3195-
setTimeout(function() {
3196-
label.textContent = saved;
3197-
buttonEl.style.color = '';
3198-
buttonEl.style.borderColor = '';
3199-
}, 1500);
3188+
closeInstallModal(slug);
3189+
// Show feedback on the main split button
3190+
var actions = document.getElementById('skill-actions-' + slug);
3191+
if (!actions) return;
3192+
var mainBtn = actions.querySelector('.skill-split-main');
3193+
if (!mainBtn) return;
3194+
_showSkillCopiedFeedback(mainBtn);
32003195
}).catch(function(err) {
32013196
console.error('Failed to copy install command:', err);
32023197
});
@@ -3224,14 +3219,10 @@ function _showSkillCopiedFeedback(buttonEl) {
32243219
if (!label) return;
32253220
var saved = label.textContent;
32263221
label.textContent = 'Copied!';
3227-
mainBtn.style.background = '#04844B';
3228-
mainBtn.style.color = 'white';
3229-
mainBtn.style.borderColor = '#04844B';
3222+
mainBtn.style.color = '#04844B';
32303223
setTimeout(function() {
32313224
label.textContent = saved;
3232-
mainBtn.style.background = '';
32333225
mainBtn.style.color = '';
3234-
mainBtn.style.borderColor = '';
32353226
}, 1500);
32363227
}
32373228

scripts/portal_generator/assets/styles.css

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -3884,37 +3884,35 @@ details[open] .examples-toggle-icon {
38843884
left: 0;
38853885
right: 0;
38863886
bottom: 0;
3887-
background: rgba(0, 0, 0, 0.5);
3887+
background: rgba(0, 0, 0, 0.2);
38883888
}
38893889

38903890
.install-modal-content {
38913891
position: relative;
38923892
background: white;
3893-
border: 1px solid var(--border-color);
38943893
border-radius: 16px;
3895-
max-width: 560px;
3894+
max-width: 520px;
38963895
width: 90%;
3897-
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
3896+
box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
38983897
}
38993898

39003899
.install-modal-header {
39013900
display: flex;
39023901
justify-content: space-between;
39033902
align-items: center;
3904-
padding: 1.25rem 1.5rem;
3905-
border-bottom: 1px solid var(--border-color);
3903+
padding: 1.25rem 1.5rem 0.75rem;
39063904
}
39073905

39083906
.install-modal-header h3 {
39093907
margin: 0;
3910-
font-size: var(--lume-font-size-6);
3908+
font-size: var(--lume-font-size-5);
39113909
font-family: var(--font-sans);
39123910
font-weight: var(--lume-font-weight-semibold);
39133911
color: #1f2937;
39143912
}
39153913

39163914
.install-modal-body {
3917-
padding: 1.5rem;
3915+
padding: 0.75rem 1.5rem 1.5rem;
39183916
}
39193917

39203918
.install-command-row {
@@ -3934,15 +3932,19 @@ details[open] .examples-toggle-icon {
39343932

39353933
.install-command-code {
39363934
flex: 1;
3937-
padding: 0.625rem 0.75rem;
3938-
background: #F0F7FF;
3935+
padding: 0 0.5rem;
3936+
background: #DDEFFF;
3937+
line-height: 1.4;
39393938
border: none;
39403939
border-radius: 0;
39413940
font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
39423941
font-size: var(--lume-font-size-2);
39433942
color: #1f2937;
3944-
word-break: break-all;
39453943
user-select: all;
3944+
white-space: nowrap;
3945+
overflow: hidden;
3946+
text-overflow: ellipsis;
3947+
min-width: 0;
39463948
}
39473949

39483950
.btn-install-copy {

0 commit comments

Comments
 (0)