FediMovies/fedimovies-web
1
1
Fork 0
Code Pull requests Activity

Change content warning icon

Browse source
This commit is contained in:
silverpill 2023-04-22 12:17:23 +00:00
parent 23ea751341
commit 4c68b17257
4 changed files with 14 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/assets/feather/alert-triangle.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-alert-triangle"><path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"></path><line x1="12" y1="9" x2="12" y2="13"></line><line x1="12" y1="17" x2="12.01" y2="17"></line></svg>
Side by side

After

Width:  |  Height:  |  Size: 426 B

2
src/assets/tabler/alert-triangle.svg
View file

@ -1,2 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg class="icon icon-tabler icon-tabler-alert-triangle" width="24" height="24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M0 0h24v24H0z" fill="none" stroke="none"/><path d="m12.012 9.6967v2.3019m0 4.6037v0.01151" stroke-width="2.3019"/><path d="m3.9557 21.206h16.113a2.3019 2.3019 0 0 0 2.1177-3.1651l-8.1716-14.099a2.3019 2.3019 0 0 0-4.0283 0l-8.1716 14.099a2.3019 2.3019 0 0 0 2.0141 3.1651" stroke-width="2.3019"/></svg>
Side by side

Before

Width:  |  Height:  |  Size: 598 B

14
src/components/PostEditor.vue
View file

@ -91,11 +91,11 @@
<button
type="button"
class="icon"
:class="{ highlighted: isSensitive }"
title="Toggle content warning"
:class="{ warning: isSensitive }"
:title="isSensitive ? 'Remove content warning' : 'Add content warning'"
@click="isSensitive = !isSensitive"
>
<img src="@/assets/tabler/alert-triangle.svg">
<img src="@/assets/feather/alert-triangle.svg">
</button>
<div class="toolbar-space"></div>
<button
@ -470,6 +470,14 @@ $line-height: 1.5;
--loader-width: 2px;
}
.icon.warning {
color: $warning-color;
img {
filter: $warning-colorizer;
}
}
.character-counter {
font-weight: bold;
}

2
src/styles/_theme.scss
View file

@ -15,6 +15,8 @@ $link-color: #484747;
$link-colorizer: invert(27%) sepia(2%) saturate(0%) hue-rotate(58deg) brightness(96%) contrast(94%);
$link-hover-color: #000000;
$link-hover-colorizer: invert(0%) sepia(0%) saturate(0%) hue-rotate(324deg) brightness(96%) contrast(104%);
$warning-color: #C87000;
$warning-colorizer: invert(51%) sepia(61%) saturate(3100%) hue-rotate(12deg) brightness(88%) contrast(103%);
$error-color: #FF4D4D;
$greentext-color: #789922;