sam_oneal/fx_cast
1
0
Fork 0
mirror of https://github.com/hensm/fx_cast.git synced 2026-06-08 08:39:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

Use CSS background images for options page icon buttons

Browse Source
This commit is contained in:
hensm
2022-08-27 07:46:24 +01:00
parent 25c0187780
commit a65b3bbe4a
3 changed files with 19 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
ext/src/ui/options/Bridge.svelte
View File

@@ -198,9 +198,7 @@
class="ghost bridge__refresh" class="ghost bridge__refresh"
title={_("optionsBridgeRefresh")} title={_("optionsBridgeRefresh")}
on:click={checkBridgeStatus} on:click={checkBridgeStatus}
> />
<img src="assets/photon_refresh.svg" alt="icon, refresh" />
</button>
</div> </div>
{#if bridgeInfo} {#if bridgeInfo}

21
ext/src/ui/options/Whitelist.svelte
View File

@@ -184,9 +184,7 @@
title={_("optionsSiteWhitelistEditItem")} title={_("optionsSiteWhitelistEditItem")}
disabled={isEditing && !isEditingValid} disabled={isEditing && !isEditingValid}
on:click={() => beginEditing(i)} on:click={() => beginEditing(i)}
> />
<img src="assets/photon_edit.svg" alt="icon, edit" />
</button>
{/if} {/if}
<button <button
@@ -195,9 +193,7 @@
title={_("optionsSiteWhitelistRemoveItem")} title={_("optionsSiteWhitelistRemoveItem")}
disabled={isEditing && !isEditingItem && !isEditingValid} disabled={isEditing && !isEditingItem && !isEditingValid}
on:click={() => removeItem(i)} on:click={() => removeItem(i)}
> />
<img src="assets/photon_delete.svg" alt="icon, remove" />
</button>
{#if !isEditingItem && opts.showAdvancedOptions} {#if !isEditingItem && opts.showAdvancedOptions}
<button <button
@@ -217,14 +213,7 @@
} }
expandedItemIndices = expandedItemIndices; expandedItemIndices = expandedItemIndices;
}} }}
> />
<img
src="../assets/{isItemExpanded
? 'photon_arrowhead_up.svg'
: 'photon_arrowhead_down.svg'}"
alt="icon, arrow down"
/>
</button>
{#if isItemExpanded} {#if isItemExpanded}
<div class="whitelist__expanded"> <div class="whitelist__expanded">
@@ -300,8 +289,6 @@
title={_("optionsSiteWhitelistAddItem")} title={_("optionsSiteWhitelistAddItem")}
on:click={addItem} on:click={addItem}
type="button" type="button"
> />
<img src="assets/photon_new.svg" alt="icon, add" />
</button>
</div> </div>
</div> </div>

14
ext/src/ui/options/styles/index.css
View File

@@ -144,6 +144,7 @@ input:placeholder-shown {
} }
.bridge__refresh { .bridge__refresh {
background-image: url("../assets/photon_refresh.svg");
position: absolute; position: absolute;
right: 0; right: 0;
top: 0; top: 0;
@@ -370,7 +371,20 @@ input:placeholder-shown {
width: -moz-available; width: -moz-available;
} }
.whitelist__edit-button {
background-image: url("../assets/photon_edit.svg");
}
.whitelist__remove-button {
background-image: url("../assets/photon_delete.svg");
}
.whitelist__expand-button {
background-image: url("../../assets/photon_arrowhead_down.svg");
}
.whitelist__item--expanded .whitelist__expand-button {
background-image: url("../../assets/photon_arrowhead_up.svg");
}
.whitelist__add-button { .whitelist__add-button {
background-image: url("../assets/photon_new.svg");
margin-inline-end: auto; margin-inline-end: auto;
} }