mirror of
https://github.com/nykkolin/obsidian-convert-base64-to-png.git
synced 2026-07-22 05:45:47 +00:00
Move inline styles to CSS
This commit is contained in:
parent
47c967bb7f
commit
cb8c8a021a
2 changed files with 31 additions and 22 deletions
26
main.ts
26
main.ts
|
|
@ -322,23 +322,11 @@ class ConvertBase64ToPNGSettingTab extends PluginSettingTab {
|
|||
containerEl.createEl('hr');
|
||||
|
||||
const sponsorDiv = containerEl.createDiv('sponsor-container');
|
||||
sponsorDiv.addClass('sponsor-container');
|
||||
sponsorDiv.style.display = 'flex';
|
||||
sponsorDiv.style.flexDirection = 'column';
|
||||
sponsorDiv.style.alignItems = 'center';
|
||||
sponsorDiv.style.marginTop = '1rem';
|
||||
|
||||
const sponsorText = sponsorDiv.createDiv();
|
||||
const sponsorText = sponsorDiv.createDiv('sponsor-text');
|
||||
sponsorText.setText('If you like this Plugin, consider donating to support continued development.');
|
||||
sponsorText.style.marginBottom = '1rem';
|
||||
sponsorText.style.textAlign = 'center';
|
||||
|
||||
const buttonsDiv = sponsorDiv.createDiv();
|
||||
buttonsDiv.style.display = 'flex';
|
||||
buttonsDiv.style.gap = '1rem';
|
||||
buttonsDiv.style.justifyContent = 'center';
|
||||
buttonsDiv.style.flexWrap = 'wrap';
|
||||
buttonsDiv.style.alignItems = 'center';
|
||||
const buttonsDiv = sponsorDiv.createDiv('sponsor-buttons');
|
||||
|
||||
// Ko-fi button
|
||||
const kofiLink = buttonsDiv.createEl('a', {
|
||||
|
|
@ -348,12 +336,9 @@ class ConvertBase64ToPNGSettingTab extends PluginSettingTab {
|
|||
kofiLink.setAttribute('rel', 'noopener');
|
||||
|
||||
// Create an image element for Ko-fi
|
||||
const kofiImg = kofiLink.createEl('img');
|
||||
const kofiImg = kofiLink.createEl('img', { cls: 'sponsor-image' });
|
||||
kofiImg.src = 'https://img.shields.io/badge/Ko--fi-F16061?style=for-the-badge&logo=ko-fi&logoColor=white';
|
||||
kofiImg.alt = 'Support me on Ko-fi';
|
||||
kofiImg.style.height = '38px';
|
||||
kofiImg.style.width = 'auto';
|
||||
kofiImg.style.maxWidth = '160px';
|
||||
|
||||
// Buy Me a Coffee button
|
||||
const bmcLink = buttonsDiv.createEl('a', {
|
||||
|
|
@ -363,11 +348,8 @@ class ConvertBase64ToPNGSettingTab extends PluginSettingTab {
|
|||
bmcLink.setAttribute('rel', 'noopener');
|
||||
|
||||
// Create an image element for Buy Me a Coffee
|
||||
const bmcImg = bmcLink.createEl('img');
|
||||
const bmcImg = bmcLink.createEl('img', { cls: 'sponsor-image' });
|
||||
bmcImg.src = 'https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png';
|
||||
bmcImg.alt = 'Buy Me A Coffee';
|
||||
bmcImg.style.height = '38px';
|
||||
bmcImg.style.width = 'auto';
|
||||
bmcImg.style.maxWidth = '160px';
|
||||
}
|
||||
}
|
||||
|
|
|
|||
27
styles.css
27
styles.css
|
|
@ -25,3 +25,30 @@
|
|||
.base64-to-png-modal-buttons button {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
/* Sponsor section styles */
|
||||
.sponsor-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.sponsor-text {
|
||||
margin-bottom: 1rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.sponsor-buttons {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.sponsor-image {
|
||||
height: 38px;
|
||||
width: auto;
|
||||
max-width: 160px;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue