mirror of
https://github.com/keathmilligan/obsidian-paste-reformatter.git
synced 2026-07-22 05:43:44 +00:00
f659fb0144
* Fix scrolling behavior when adding replacement items * Improve replacement list management UX
117 lines
2.1 KiB
CSS
117 lines
2.1 KiB
CSS
/*
|
|
|
|
This CSS file will be included with your plugin, and
|
|
available in the app when your plugin is enabled.
|
|
|
|
If your plugin does not need CSS, delete this file.
|
|
|
|
*/
|
|
|
|
/* Regex Replacement Container Styles */
|
|
.regex-replacements-container {
|
|
margin-left: 0px;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
/* Regex Replacement Table Styles */
|
|
.regex-table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
}
|
|
|
|
/* Table Header Styles */
|
|
.regex-th {
|
|
text-align: left;
|
|
padding: 5px;
|
|
}
|
|
|
|
.regex-th-pattern, .regex-th-replacement {
|
|
width: 48%;
|
|
}
|
|
|
|
.regex-th-actions {
|
|
width: 4%;
|
|
}
|
|
|
|
/* Table Cell Styles */
|
|
.regex-td {
|
|
padding: 5px;
|
|
}
|
|
|
|
.regex-td-actions {
|
|
text-align: center;
|
|
}
|
|
|
|
/* Input Field Styles */
|
|
.regex-input {
|
|
width: 100%;
|
|
}
|
|
|
|
/* Empty Message Styles */
|
|
.regex-empty-message {
|
|
text-align: center;
|
|
padding: 10px;
|
|
font-style: italic;
|
|
color: var(--text-muted);
|
|
opacity: 0.7;
|
|
}
|
|
|
|
/* Remove Icon Styles */
|
|
.regex-remove-icon {
|
|
cursor: pointer;
|
|
padding: 4px;
|
|
border-radius: 3px;
|
|
color: #dc3545;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
transition: background-color 0.2s ease;
|
|
}
|
|
|
|
.regex-remove-icon:hover {
|
|
background-color: rgba(220, 53, 69, 0.1);
|
|
}
|
|
|
|
.regex-remove-icon:active {
|
|
background-color: rgba(220, 53, 69, 0.2);
|
|
}
|
|
|
|
.regex-remove-icon:focus {
|
|
outline: 2px solid rgba(220, 53, 69, 0.5);
|
|
outline-offset: 1px;
|
|
}
|
|
|
|
/* Add Icon Styles */
|
|
.regex-add-icon {
|
|
cursor: pointer;
|
|
padding: 8px;
|
|
border-radius: 50%;
|
|
/* color: var(--interactive-accent); */
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
/* transition: background-color 0.2s ease; */
|
|
margin-top: 8px;
|
|
margin-bottom: 8px;
|
|
width: 100%;
|
|
}
|
|
|
|
.regex-add-icon svg {
|
|
width: 20px;
|
|
height: 20px;
|
|
}
|
|
|
|
.regex-add-icon:hover {
|
|
/* background-color: var(--interactive-accent-hover); */
|
|
color: var(--text-on-accent);
|
|
}
|
|
|
|
.regex-add-icon:active {
|
|
/* background-color: var(--interactive-accent); */
|
|
color: var(--text-on-accent);
|
|
}
|
|
|
|
/* .regex-add-icon:focus {
|
|
outline: 2px solid var(--interactive-accent);
|
|
outline-offset: 2px;
|
|
} */
|