TeaSpeak
/
TeaWeb
1
0
Fork 0
Code Issues 1 Pull Requests Activity

Correctly including using the permission editor group svgs

master
WolverinDEV 2021-03-23 15:52:06 +01:00
parent f7c62fbbe0
commit be8d8acec1
11 changed files with 61 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
shared/img/client-icons/group_add.svg Normal file
View File

@ -0,0 +1,10 @@
<svg version="1.1" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
<style type="text/css">.st0{fill:#666666;}</style>
<g transform="scale(.25)">
<g id="Icon-Plus" transform="translate(28,278)">
<path class="st0" d="m4-222.1c-13.2 0-23.9-10.7-23.9-23.9s10.7-23.9 23.9-23.9 23.9 10.7 23.9 23.9-10.7 23.9-23.9 23.9zm0-45.2c-11.7 0-21.3 9.6-21.3 21.3s9.6 21.3 21.3 21.3 21.3-9.6 21.3-21.3-9.6-21.3-21.3-21.3z"/>
<polygon class="st0" points="16.7 -247.4 16.7 -244.6 -8.7 -244.6 -8.7 -247.4"/>
<polygon class="st0" points="5.4 -258.7 5.4 -233.3 2.6 -233.3 2.6 -258.7"/>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 605 B

13
shared/img/client-icons/group_delete.svg Normal file
View File

@ -0,0 +1,13 @@
<svg version="1.1" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
<style type="text/css">.st0{fill:#666666;}</style>
<g transform="matrix(.25 0 0 .25 0 .0125)">
<g id="Icon-Trash" transform="translate(232,228)">
<polygon class="st0" points="-207.5 -205.1 -204.5 -205.1 -204.5 -181.1 -207.5 -181.1"/>
<polygon class="st0" points="-201.5 -205.1 -198.5 -205.1 -198.5 -181.1 -201.5 -181.1"/>
<polygon class="st0" points="-195.5 -205.1 -192.5 -205.1 -192.5 -181.1 -195.5 -181.1"/>
<polygon class="st0" points="-219.5 -214.1 -180.5 -214.1 -180.5 -211.1 -219.5 -211.1"/>
<path class="st0" d="m-192.6-212.6h-2.8v-3c0-.9-.7-1.6-1.6-1.6h-6c-.9 0-1.6.7-1.6 1.6v3h-2.8v-3c0-2.4 2-4.4 4.4-4.4h6c2.4 0 4.4 2 4.4 4.4v3"/>
<path class="st0" d="m-191-172.1h-18c-2.4 0-4.5-2-4.7-4.4l-2.8-36 3-.2 2.8 36c.1.9.9 1.6 1.7 1.6h18c.9 0 1.7-.8 1.7-1.6l2.8-36 3 .2-2.8 36c-.2 2.5-2.3 4.4-4.7 4.4"/>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 924 B

7
shared/img/client-icons/group_permission_copy.svg Normal file
View File

@ -0,0 +1,7 @@
<svg version="1.1" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
<style type="text/css">.st0{fill:#666666;}</style>
<g transform="scale(.03125)">
<polygon class="st0" points="288 96 288 176 368 176 368 160 304 160 304 96"/>
<path class="st0" d="m325.3 64h-165.3v48h-48v336h240v-48h48v-261zm10.7 368h-208v-304h32v272h176zm48-48h-208v-304h142.7l65.3 65.6z"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 386 B

12
shared/img/client-icons/group_rename.svg Normal file
View File

@ -0,0 +1,12 @@
<svg version="1.1" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
<style type="text/css">.st0{fill:#666666;}</style>
<g transform="matrix(.25 0 0 .25 -.1 -.1)">
<g id="Icon-Pencil" transform="translate(179,382)">
<path class="st0" d="m-168.2-328 3.7-14.9 22.7-22.7 11.2 11.2-22.7 22.7zm6.3-13.5-2.4 9.6 9.6-2.4 20.2-20.2-7.2-7.2z"/>
<path class="st0" d="m-155.7-332.6c-1-3.9-4-6.9-7.9-7.9l.7-2.8c4.9 1.2 8.7 5 9.9 9.9l-2.7.8"/>
<polyline class="st0" points="-156 -338.1 -158 -340.2 -138.1 -360.1 -136.1 -358.1 -156 -338.1"/>
<path class="st0" d="m-166.2-330 4.4-1.1c-.4-1.6-1.7-2.9-3.3-3.3l-1.1 4.4"/>
<path class="st0" d="m-129.5-355.5-11.2-11.2 4.5-4.5.7.1c5.4.7 9.7 5 10.4 10.4l.1.7zm-7.1-11.2 7.2 7.2 1.4-1.4c-.8-3.6-3.6-6.4-7.2-7.2z"/>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 789 B

11
shared/img/icon_group_add.svg
View File

@ -1,11 +0,0 @@
<?xml version="1.0" ?><!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN'
'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'>
<svg id="Layer_1" style="enable-background:new 0 0 64 64;" version="1.1" viewBox="0 0 64 64" xml:space="preserve"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><style type="text/css">
.st0{fill:#666666;}
</style>
<g><g id="Icon-Plus" transform="translate(28.000000, 278.000000)">
<path class="st0" d="M4-222.1c-13.2,0-23.9-10.7-23.9-23.9c0-13.2,10.7-23.9,23.9-23.9s23.9,10.7,23.9,23.9 C27.9-232.8,17.2-222.1,4-222.1L4-222.1z M4-267.3c-11.7,0-21.3,9.6-21.3,21.3s9.6,21.3,21.3,21.3s21.3-9.6,21.3-21.3 S15.7-267.3,4-267.3L4-267.3z" id="Fill-38"/><polygon
class="st0" id="Fill-39" points="-8.7,-247.4 16.7,-247.4 16.7,-244.6 -8.7,-244.6 "/><polygon class="st0"
id="Fill-40"
points="2.6,-258.7 5.4,-258.7 5.4,-233.3 2.6,-233.3 "/></g></g></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.1 KiB

3
shared/img/icon_group_delete.svg
View File

@ -1,3 +0,0 @@
<?xml version="1.0" ?><!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg id="Layer_1" style="enable-background:new 0 0 64 64;" version="1.1" viewBox="0 0 64 64" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><style type="text/css">
.st0{fill:#666666;}
</style><g><g id="Icon-Trash" transform="translate(232.000000, 228.000000)"><polygon class="st0" id="Fill-6" points="-207.5,-205.1 -204.5,-205.1 -204.5,-181.1 -207.5,-181.1 "/><polygon class="st0" id="Fill-7" points="-201.5,-205.1 -198.5,-205.1 -198.5,-181.1 -201.5,-181.1 "/><polygon class="st0" id="Fill-8" points="-195.5,-205.1 -192.5,-205.1 -192.5,-181.1 -195.5,-181.1 "/><polygon class="st0" id="Fill-9" points="-219.5,-214.1 -180.5,-214.1 -180.5,-211.1 -219.5,-211.1 "/><path class="st0" d="M-192.6-212.6h-2.8v-3c0-0.9-0.7-1.6-1.6-1.6h-6c-0.9,0-1.6,0.7-1.6,1.6v3h-2.8v-3 c0-2.4,2-4.4,4.4-4.4h6c2.4,0,4.4,2,4.4,4.4V-212.6" id="Fill-10"/><path class="st0" d="M-191-172.1h-18c-2.4,0-4.5-2-4.7-4.4l-2.8-36l3-0.2l2.8,36c0.1,0.9,0.9,1.6,1.7,1.6h18 c0.9,0,1.7-0.8,1.7-1.6l2.8-36l3,0.2l-2.8,36C-186.5-174-188.6-172.1-191-172.1" id="Fill-11"/></g></g></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.2 KiB

9
shared/img/icon_group_permission_copy.svg
View File

@ -1,9 +0,0 @@
<?xml version="1.0" ?><!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN'
'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'>
<svg height="512px" id="Layer_1" style="enable-background:new 0 0 512 512;" version="1.1" viewBox="0 0 512 512"
width="512px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<style type="text/css">
.st0{fill:#666666;}
</style>
<g><polygon class="st0" points="304,96 288,96 288,176 368,176 368,160 304,160 "/><path class="st0"
d="M325.3,64H160v48h-48v336h240v-48h48V139L325.3,64z M336,432H128V128h32v272h176V432z M384,384H176V80h142.7l65.3,65.6V384 z"/></g></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 678 B

3
shared/img/icon_group_rename.svg
View File

@ -1,3 +0,0 @@
<?xml version="1.0" ?><!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg id="Layer_1" style="enable-background:new 0 0 64 64;" version="1.1" viewBox="0 0 64 64" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><style type="text/css">
.st0{fill:#666666;}
</style><g><g id="Icon-Pencil" transform="translate(179.000000, 382.000000)"><path class="st0" d="M-168.2-328l3.7-14.9l22.7-22.7l11.2,11.2l-22.7,22.7L-168.2-328L-168.2-328z M-161.9-341.5 l-2.4,9.6l9.6-2.4l20.2-20.2l-7.2-7.2L-161.9-341.5L-161.9-341.5z" id="Fill-168"/><path class="st0" d="M-155.7-332.6c-1-3.9-4-6.9-7.9-7.9l0.7-2.8c4.9,1.2,8.7,5,9.9,9.9L-155.7-332.6" id="Fill-169"/><polyline class="st0" id="Fill-170" points="-156,-338.1 -158,-340.2 -138.1,-360.1 -136.1,-358.1 -156,-338.1 "/><path class="st0" d="M-166.2-330l4.4-1.1c-0.4-1.6-1.7-2.9-3.3-3.3L-166.2-330" id="Fill-171"/><path class="st0" d="M-129.5-355.5l-11.2-11.2l4.5-4.5l0.7,0.1c5.4,0.7,9.7,5,10.4,10.4l0.1,0.7L-129.5-355.5 L-129.5-355.5z M-136.6-366.7l7.2,7.2l1.4-1.4c-0.8-3.6-3.6-6.4-7.2-7.2L-136.6-366.7L-136.6-366.7z" id="Fill-172"/></g></g></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.2 KiB

6
shared/js/ui/modal/permission/ModalRenderer.scss
View File

@ -322,10 +322,8 @@ html:root {
@include transition(background-color .25s ease-in-out);
img {
width: 2.2em;
height: 2.2em;
.icon {
font-size: 2.2em;
align-self: center;
}
}

19
shared/js/ui/modal/permission/ModalRenderer.tsx
View File

@ -25,6 +25,7 @@ import {ContextDivider} from "tc-shared/ui/react-elements/ContextDivider";
import {EditorRenderer} from "tc-shared/ui/modal/permission/EditorRenderer";
import {spawnContextMenu} from "tc-shared/ui/ContextMenu";
import {ClientIcon} from "svg-sprites/client-icons";
import {ClientIconRenderer} from "tc-shared/ui/react-elements/Icons";
const cssStyle = require("./ModalRenderer.scss");
@ -33,11 +34,13 @@ const ModalEventContext = React.createContext<Registry<PermissionModalEvents>>(u
const EditorEventContext = React.createContext<Registry<PermissionEditorEvents>>(undefined);
const ServerInfoContext = React.createContext<PermissionEditorServerInfo>(undefined);
const GroupsButton = (props: { image: string, alt: string, onClick?: () => void, disabled: boolean }) => {
const GroupsButton = (props: { clientIcon: ClientIcon, alt: string, onClick?: () => void, disabled: boolean }) => {
return (
<div className={cssStyle.button + " " + (props.disabled ? cssStyle.disabled : "")}
onClick={() => !props.disabled && props.onClick()}>
<img src={props.image} alt={props.alt}/>
<div
className={cssStyle.button + " " + (props.disabled ? cssStyle.disabled : "")}
onClick={() => !props.disabled && props.onClick()}
>
<ClientIconRenderer icon={props.clientIcon} className={cssStyle.icon} />
</div>
);
};
@ -177,7 +180,7 @@ class GroupsList extends React.PureComponent<{ events: Registry<PermissionModalE
</div>,
<div key={"buttons"} className={cssStyle.buttons}>
<GroupsButton
image={"img/icon_group_add.svg"}
clientIcon={ClientIcon.GroupAdd}
alt={this.props.target === "server" ? tr("Add server group") : tr("Add channel group")}
disabled={this.state.disableGroupAdd}
onClick={() => this.props.events.fire("action_create_group", {
@ -186,13 +189,13 @@ class GroupsList extends React.PureComponent<{ events: Registry<PermissionModalE
})}
/>
<GroupsButton
image={"img/icon_group_rename.svg"}
clientIcon={ClientIcon.GroupRename}
alt={this.props.target === "server" ? tr("Rename server group") : tr("Rename channel group")}
onClick={() => this.onGroupRename()}
disabled={this.state.disableGroupRename}
/>
<GroupsButton
image={"img/icon_group_permission_copy.svg"}
clientIcon={ClientIcon.GroupPermissionCopy}
alt={this.props.target === "server" ? tr("Copy server group permissions") : tr("Copy channel group permissions")}
disabled={this.state.disablePermissionCopy}
onClick={() => this.props.events.fire("action_group_copy_permissions", {
@ -201,7 +204,7 @@ class GroupsList extends React.PureComponent<{ events: Registry<PermissionModalE
})}
/>
<GroupsButton
image={"img/icon_group_delete.svg"}
clientIcon={ClientIcon.GroupDelete}
alt={this.props.target === "server" ? tr("Delete server group") : tr("Delete channel group")}
disabled={this.state.disableDelete}
onClick={() => this.onGroupDelete()}

8
shared/svg-sprites/client-icons.d.ts vendored
View File

File diff suppressed because one or more lines are too long