-
Notifications
You must be signed in to change notification settings - Fork 7
/
HACKING
178 lines (118 loc) · 6.39 KB
/
HACKING
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
This it intruduction of how Clarity icons are created
1. Creating Icons
=================
All icons are created as 128x128 pixels icons, I usualy open one of the source
files (so I already have proper sized canvas) create new shape in that file
I don't save it only use xml editor to get `<path` tag d attribute that have
path information and execute from command line
clarity-icon-theme $ mkshape "Title of the Icon" > /src/<PATH to the file>
to know how the file is name I usualy use XFce icon picker in Activator that
you can add to XFce panel or small python script
https://github.com/jcubic/tools/blob/master/gtk-icon-theme-viewer
this repo is a fork where I've added serch feature.
2. Configure script
===================
this script is created by hand, when you add something you need to run it
then run make, to see if there are no errors in genrated Makefile.
./configure
make
Usual errors are $ in makefile and in configure need to be escape differently
when in configure and in double quite there need to be \$ and if that goes to
Makefile it need to be escaped with $$ so if you have grep inside Makefile
you need to use double escape
echo -e "\t@grep '^x\$\$' file"
this will generate
@grep '^x$$' file
which is $ escaped for Makefile
Second issue is escaping escapes like \n and \r if they are inserted to Makefile
then need to be escaped so
echo -e "\t@sed 's%<svg>%\\n</svg>%' file"
this will generate
@sed 's%<svg>%\n</svg>%' file
The last I use to have is hash # it also need to be escaped because it's treated
as comment event if inside string:
echo "COPIES=grep -v '^\\#' src/copies | tr -d '\\r' | grep -v '^ *\$\$'"
above line is taken from configure script it get all lines from src/copies files
and ignore comments and blank lines
3. Applying Theme
=================
Main thing that is done in Makefile is to iterate over all icons is src and
generate file in scalable directory. Makefile is searching for all icons using
find command and execute build script that is located in root directory of
the project.
The build script is taking title and shape from icon svg using grep/sed and
injecting them using sed into template file that have
{{TITLE}} {{PATH}}
You can generate single icon using:
./build canus src/apps/vlc.svg
If you're working on new icons is good idea to create symlink to
./icons/Clarity so each time you create new icon you can create icon
using mkshape and then run build to generate new icon or create symlink
and copy the 2 arguements to src/symlinks file.
4. Creating new Theme
=====================
If you want to create new Theme you just need to copy some icon apply some
filters and effects but do not modify the shape, you can also hand code the
template in text editor, some things can not be done in Inkscape. Or you
can generate in Inkscape and then edit it. For instance you can replace
clone with symbols where you will have single {{PATH}}.
After you generated the icon you just need to remove d attribute and add
d="{{PATH}}" on main shape, there should be only one, I've didn't tested if
it work with multiple instance of {{PATH}}. And and create
<title>{{TITLE}}</title> it's not needed for svg to work but it's nice that
icon have title.
5. Compund Icons
================
Those icons are normal icons taken from scalable directory where there
are injected at the end (in SVG whats after it's on top like on stack)
Those icons are located in src/compound_icons_rules each line (comments and blanks
are ignored) look like this:
apps/vlc-xmas.svg = apps/vlc.svg + vlc_xmas_hat.svg
it take generated icon scalable/apps/vlc.svg vlc_xmas_hat.svg located in src
directory and generated scalable/apps/vlc-xmas.svg
those icons are generated by ./configure
NOTE: change-theme script don't use ./configure it just take rules directly
from file
lines in Makefile for vlc-xmas.svg example look like this:
@sed -e "s%</svg>%`grep 'id=\"shape\"' src/vlc_xmas_hat.svg`\n</svg>%" scalable/apps/vlc.svg > scalable/apps/vlc-xmas.svg;
@echo "building scalable/apps/vlc-xmas.svg"
it execute grep to get line that have id="shape" so each element need to have it
and insert before closing </svg> tag.
Right now only single element is supported but if you want to put multiple elements
you can just add
<g id="shape"><!-- multiple shapes --></g>
in fact g is not needed but it will look nicer in result svg. Look at
vlc_xmas_hat.svg as an example.
6. Symlinks and Copies
======================
Some icons are duplicate, it's hard to add symlinks to git repo so the first
solution was tar.gz file with all the symlinks but it was hard to add new symlinks
it would show single file in diff and you will not know which one was changes
so latest version have all symlinks in src/symlinks directory.
The file is created in such a way that you can inject ln -sf before each line
using sed and pipe it to bash. And this is want Makefile is doing.
When I was creating icons I've notice that some don't work as symlinks
but when I've created a copy they was working so some icons are exeptions
and put in src/copies file, they are generated in same way except that sed is
injecting cp in front of every line, comments and blanks are also ignored.
7. 16x16 png icons
==================
When working on icons there was some issues with small icons (scaling). The
solution was to generate those icons using rsvg (usualy as rsvg-convert command)
There was one issue with Parole icons when there ware 16px icons so they are in
src/16x16_exceptions file. To gnore the files there is generated regular
expression (only 2 files so there is not problem) using this command
SKIP=`grep -v '^\#' src/16x16_exceptions | tr -d '\r' | grep -v '^ *$$' | paste -sd '|' - | sed -e 's/.*/(&)/'`
Begining is just skiping blanks and comments, `paste` will join all lines with
pipe character and `sed` at the end will wrap it with parenthesis just in case.
this SKIP variable is used in pipe like this:
@sed -e 's/\.svg/\.png/g' -e 's/scalable/16x16/g' -e 's/^\(.*\) \(.*\)/echo symlink \2; ln -sf &/g' <($(SYMLINKS)) | grep -vE $(SKIP) | bash
$(SYMLINKS) is execute as shell script with redirect, I think it's called bash
process substitution, and $(SKIP) in grep is used as string. sed is generating
echo + ln -sf command that is piped to bash.
8. Static Icons
===============
There are also exception to all of this build icons and they are located
in static directory that have same structure as src and scalable but
there are only few of those
Happy Hacking