ccmdi_smart-link-formatter/styles.css
2025-11-11 11:42:55 -05:00

112 lines
No EOL
2.3 KiB
CSS

.link-loading {
border-radius: 4px;
padding: 2px 6px;
color: transparent;
background-clip: text;
-webkit-background-clip: text;
background-image: linear-gradient(
90deg,
var(--text-normal) 0%,
var(--text-muted) 20%,
var(--text-normal) 40%,
var(--text-muted) 60%,
var(--text-normal) 80%
);
background-size: 400% 100%;
background-position: 0 0;
animation: shimmer 3s ease-in-out infinite;
}
@keyframes shimmer {
0% {
background-position: 100% 0;
}
50% {
background-position: 0% 0;
}
100% {
background-position: 100% 0;
}
}
.link-loading-inactive {
border-radius: 4px;
padding: 2px 6px;
color: var(--text-error);
opacity: 0.8;
font-size: 0.9em;
font-style: italic;
}
.smart-link-formatter-setting-textarea {
width: 200px;
resize: none;
}
.smart-link-formatter-tall-textarea-setting {
align-items: stretch;
}
.smart-link-formatter-tall-textarea-setting .setting-item-info {
align-self: center;
}
.smart-link-formatter-tall-textarea-setting .setting-item-control {
display: flex;
}
.smart-link-formatter-tall-textarea-setting .setting-item-control textarea {
height: 80%;
margin-top: auto;
margin-bottom: auto;
}
/* Tab navigation styles */
.smart-link-formatter-nav {
display: flex;
gap: 8px;
margin-bottom: 20px;
}
.smart-link-formatter-nav button {
background: var(--background-modifier-form-field);
border: 1px solid var(--background-modifier-border);
color: var(--text-muted);
padding: 8px 16px;
cursor: pointer;
font-size: 14px;
font-weight: 500;
transition: all 0.2s ease;
border-radius: 6px;
}
.smart-link-formatter-nav button:hover {
background-color: var(--background-modifier-hover);
border-color: var(--background-modifier-border-hover);
}
.smart-link-formatter-nav button.smart-link-formatter-tab-active {
color: var(--text-on-accent);
background: var(--interactive-accent);
border-color: var(--interactive-accent);
font-weight: 600;
}
.smart-link-formatter-section-divider {
height: 1px;
margin-bottom: 20px;
}
/* Replacement setting styles */
.smart-link-formatter-replacement-setting .setting-item-control {
display: flex;
flex-wrap: wrap;
gap: 8px;
align-items: center;
}
.smart-link-formatter-replacement-setting .setting-item-control input[type="text"] {
flex: 1;
min-width: 100px;
}