add icons for actions

This commit is contained in:
Frédéric Péters 2018-11-17 17:35:36 +01:00
parent 172f1449e1
commit 55ed54ea57
6 changed files with 45 additions and 2 deletions

View File

@ -1,3 +1,5 @@
$actions: add, duplicate, edit, remove;
div#side { // w.c.s. steps in backoffice submission
background: white;
padding: 0.5rem;
@ -15,3 +17,31 @@ div#side { // w.c.s. steps in backoffice submission
}
}
}
#main ul#fields-list li {
padding-top: 6px;
}
#main ul.biglist li p.commands span {
&.remove, &.add, &.edit, &.duplicate {
padding: 0;
border: 0;
background: transparent;
box-shadow: none;
a {
padding: 6px;
display: inline-block;
text-indent: -10000px;
overflow: hidden;
width: 30px;
}
}
@each $action in $actions {
&.#{$action} a {
background: url(icons/action-#{$action}.small.#{$string-color}.png) center center no-repeat;
&:hover {
background-image: url(icons/action-#{$action}.hover.png);
}
}
}
}

1
icons/action-add.svg Normal file
View File

@ -0,0 +1 @@
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 63.63 63.63"><defs><style>.cls-1{fill:#242d3c;}</style></defs><title>Pictos_v3_EXPORT</title><path class="cls-1" d="M63.63,59.09V4.55A4.54,4.54,0,0,0,59.09,0H4.55A4.54,4.54,0,0,0,0,4.55V59.09a4.54,4.54,0,0,0,4.55,4.54H59.09A4.54,4.54,0,0,0,63.63,59.09ZM50,31.82a4.55,4.55,0,0,1-4.55,4.54H36.36v9.09a4.55,4.55,0,1,1-9.09,0V36.36H18.18a4.55,4.55,0,0,1,0-9.09h9.09V18.18a4.55,4.55,0,0,1,9.09,0v9.09h9.09A4.55,4.55,0,0,1,50,31.82Z"/></svg>

After

Width:  |  Height:  |  Size: 523 B

View File

@ -0,0 +1 @@
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 63.95 65.06"><defs><style>.cls-1{fill:#242d3c;}</style></defs><title>Pictos_v3_EXPORT</title><path class="cls-1" d="M48.7,65.06H4.77A4.78,4.78,0,0,1,0,60.29V16.37a4.78,4.78,0,0,1,4.77-4.78H48.7a4.78,4.78,0,0,1,4.77,4.78V60.29A4.78,4.78,0,0,1,48.7,65.06ZM4.77,13.82a2.55,2.55,0,0,0-2.55,2.55V60.29a2.55,2.55,0,0,0,2.55,2.55H48.7a2.55,2.55,0,0,0,2.54-2.55V16.37a2.55,2.55,0,0,0-2.54-2.55Z"/><path class="cls-1" d="M41.38,38.33A3.66,3.66,0,0,1,37.72,42H30.39v7.32a3.66,3.66,0,0,1-7.32,0V42H15.75a3.66,3.66,0,1,1,0-7.32h7.32V27.35a3.66,3.66,0,0,1,7.32,0v7.32h7.33A3.66,3.66,0,0,1,41.38,38.33Z"/><path class="cls-1" d="M11.63,12.72A1.67,1.67,0,0,1,10,11.05V1.67A1.67,1.67,0,0,1,11.63,0h5.56a1.67,1.67,0,0,1,0,3.34H13.3v7.71A1.67,1.67,0,0,1,11.63,12.72Z"/><path class="cls-1" d="M49.53,3.34h-9a1.67,1.67,0,1,1,0-3.34h9a1.67,1.67,0,1,1,0,3.34Zm-16.17,0h-9a1.67,1.67,0,1,1,0-3.34h9a1.67,1.67,0,1,1,0,3.34Z"/><path class="cls-1" d="M62.28,8.9a1.67,1.67,0,0,1-1.67-1.67V3.34H56.72a1.67,1.67,0,0,1,0-3.34h5.56A1.67,1.67,0,0,1,64,1.67V7.23A1.67,1.67,0,0,1,62.28,8.9Z"/><path class="cls-1" d="M62.28,41.24a1.67,1.67,0,0,1-1.67-1.67v-9a1.67,1.67,0,0,1,3.34,0v9A1.67,1.67,0,0,1,62.28,41.24Zm0-16.17a1.67,1.67,0,0,1-1.67-1.67v-9a1.67,1.67,0,0,1,3.34,0v9A1.67,1.67,0,0,1,62.28,25.07Z"/><path class="cls-1" d="M62.28,54H52.9a1.67,1.67,0,0,1,0-3.34h7.71V46.76a1.67,1.67,0,0,1,3.34,0v5.56A1.67,1.67,0,0,1,62.28,54Z"/></svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

1
icons/action-edit.svg Normal file
View File

@ -0,0 +1 @@
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40.88 63.11"><defs><style>.cls-1{fill:#242d3c;}</style></defs><title>Pictos_v3_EXPORT</title><path class="cls-1" d="M20.44,55.59a1.12,1.12,0,0,1-.94-.51L10.86,41.62a1.08,1.08,0,0,1-.18-.6V1.11A1.11,1.11,0,0,1,11.79,0H29.08A1.12,1.12,0,0,1,30.2,1.11V41a1.17,1.17,0,0,1-.18.6L21.38,55.08A1.12,1.12,0,0,1,20.44,55.59ZM12.91,40.7l7.53,11.72L28,40.7V2.22H12.91Z"/><path class="cls-1" d="M27.76,41.36H13.12a1.11,1.11,0,1,1,0-2.22H27.76a1.11,1.11,0,1,1,0,2.22Z"/><path class="cls-1" d="M28.83,6.49H12a1.12,1.12,0,0,1,0-2.23H28.83a1.12,1.12,0,1,1,0,2.23Z"/><polygon class="cls-1" points="20.44 54.48 25.53 45.89 15.35 45.89 20.44 54.48"/><path class="cls-1" d="M39.77,63.11H1.11A1.11,1.11,0,0,1,0,62V26.56a1.11,1.11,0,0,1,1.11-1.11H11.85a1.12,1.12,0,0,1,0,2.23H2.22v33.2H38.65V27.68H29a1.12,1.12,0,0,1,0-2.23H39.77a1.11,1.11,0,0,1,1.11,1.11V62A1.11,1.11,0,0,1,39.77,63.11Z"/><rect class="cls-1" x="15.81" y="9.72" width="9.27" height="26.69"/></svg>

After

Width:  |  Height:  |  Size: 1.0 KiB

1
icons/action-remove.svg Normal file
View File

@ -0,0 +1 @@
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 63.63 63.63"><defs><style>.cls-1{fill:#242d3c;}</style></defs><title>Pictos_v3_EXPORT</title><path class="cls-1" d="M63.63,59.09V4.55A4.54,4.54,0,0,0,59.09,0H4.55A4.54,4.54,0,0,0,0,4.55V59.09a4.54,4.54,0,0,0,4.55,4.54H59.09A4.54,4.54,0,0,0,63.63,59.09Zm-19-14.42a4.54,4.54,0,0,1-6.43,0l-6.42-6.43-6.43,6.43A4.55,4.55,0,0,1,19,38.24l6.43-6.42L19,25.39A4.55,4.55,0,0,1,25.39,19l6.43,6.43L38.24,19a4.55,4.55,0,0,1,6.43,6.43l-6.43,6.43,6.43,6.42A4.54,4.54,0,0,1,44.67,44.67Z"/></svg>

After

Width:  |  Height:  |  Size: 567 B

View File

@ -131,7 +131,7 @@ class build_icons(Command):
destpath = 'gadjo/static/css/icons/'
if not os.path.exists(destpath):
os.mkdir(destpath)
variants = {
variants_applications = {
'small': {'colour': 'e7e7e7', 'width': '20'},
'small.white': {'colour': 'ffffff', 'width': '20'},
'small.4e7ee2': {'colour': '4e7ee2', 'width': '20'},
@ -140,9 +140,18 @@ class build_icons(Command):
'large': {'colour': 'e7e7e7', 'width': '80'},
'large-hover': {'colour': 'bebebe', 'width': '80'},
}
variants_actions = {
'small.4e7ee2': {'colour': '4e7ee2', 'width': '20'},
'small.ff375e': {'colour': 'ff375e', 'width': '20'},
'small.6f2b92': {'colour': '6f2b92', 'width': '20'},
'hover': {'colour': '2b2b2b', 'width': '20'},
}
for basepath, dirnames, filenames in os.walk('icons'):
for filename in filenames:
basename = os.path.splitext(filename)[0]
variants = variants_applications
if filename.startswith('action-'):
variants = variants_actions
for variant in variants:
dest_filename = '%s.%s.png' % (basename, variant)
destname = os.path.join(destpath, dest_filename)
@ -150,7 +159,7 @@ class build_icons(Command):
**variants.get(variant))
def generate(self, src, dest, colour, width, **kwargs):
if False and os.path.exists(dest) and os.stat(dest).st_mtime >= os.stat(src).st_mtime:
if os.path.exists(dest) and os.stat(dest).st_mtime >= os.stat(src).st_mtime:
return
# default values
from PIL import Image