Koenig - Update toolbar to use Spirit classes

refs https://github.com/TryGhost/Ghost/issues/9505
- switch `{{koenig-toolbar}}` to use Spirit classes and icons
- wrap the toolbar `<ul>` in an absolutely positioned `<div>` rather than positioning the toolbar directly to improve animation behaviour
- remove old/unused Koenig SVG icons
This commit is contained in:
Kevin Ansfield 2018-04-03 16:52:00 +01:00
parent 9aef06c4c2
commit 3ec2e87a6c
37 changed files with 100 additions and 167 deletions

View File

@ -89,27 +89,6 @@
border: none;
}
.koenig-toolbar.is-link {
width: 263px;
height: 40px;
}
.koenig-toolbar.is-link input {
width: 100%;
background-color: transparent;
outline: none;
border: none;
padding:5px;
}
.koenig-toolbar.is-touch {
position: fixed !important;
top: 70px;
right: 40px;
}
.koenig-toolbar.is-touch:after {
border: none;
}
.koenig-toolbar-btn {
display: flex;
justify-content: center;
@ -125,6 +104,7 @@
width: 43px;
padding-left: 8px;
}
.koenig-toolbar-btn:last-child {
width: 43px;
padding-right: 8px;
@ -138,9 +118,6 @@
stroke-width: 2px;
stroke: color-mod(var(--lightgrey) l(-10%));
}
.koenig-toolbar-btn-list svg path {
fill: color-mod(var(--lightgrey) l(-10%));
}
.koenig-toolbar-btn:hover,
.koenig-toolbar-btn.selected {
@ -148,64 +125,10 @@
cursor: pointer;
text-shadow: #000 0 1px 6px;
}
.koenig-toolbar-btn-list.selected svg path {
fill: #fff;
}
.koenig-toolbar-btn:hover svg g {
stroke: #fff;
}
.koenig-toolbar-btn-list:hover svg path {
fill: #fff;
}
.koenig-toolbar-btn-bold {
font-weight: 700;
}
.koenig-toolbar-btn-italic {
width: 31px;
font-size: 1.7rem;
text-indent: -1px;
font-style: italic;
font-family: Georgia, Times, serif;
font-weight: 500;
}
.koenig-toolbar-btn-strike {
text-decoration: line-through;
font-weight: 400;
-webkit-font-smoothing: antialiased;
}
.koenig-toolbar-btn-h1 {
font-variant: small-caps;
font-weight: 700;
-webkit-font-smoothing: antialiased;
}
.koenig-toolbar-btn-h2 {
font-weight: 700;
font-size: 0.9em;
font-variant: small-caps;
line-height: 42px;
-webkit-font-smoothing: antialiased;
}
.koenig-toolbar-btn-quote {
font-size: 4rem;
line-height: 62px;
font-family: Georgia, Times, serif;
-webkit-font-smoothing: antialiased;
}
.koenig-toolbar-divider {
height: 40px;
width: 1px;
margin: 0 9px 0 8px;
background: color-mod(var(--darkgrey) l(-10%));
box-shadow: rgba(255,255,255,0.04) 1px 0 0 0;
}
/* ⨁ menu ------------------------------------------------------------------ */

View File

@ -18,10 +18,9 @@ export default Component.extend({
layout,
attributeBindings: ['style'],
classNames: ['absolute'],
// public attrs
classNames: ['koenig-toolbar'],
classNameBindings: ['showToolbar:koenig-toolbar--visible'],
editorRange: null,
activeMarkupTagNames: null,
activeSectionTagNames: null,
@ -245,7 +244,7 @@ export default Component.extend({
_addStyleElement(styles) {
let styleElement = document.createElement('style');
styleElement.id = `${this.elementId}-style`;
styleElement.innerHTML = `#${this.elementId}:after { ${styles} }`;
styleElement.innerHTML = `#${this.elementId} > ul:after { ${styles} }`;
document.head.appendChild(styleElement);
},

View File

@ -1,70 +1,87 @@
{{!-- markup buttons --}}
<button
type="button"
title="Bold"
class="koenig-toolbar-btn koenig-toolbar-btn-bold {{if activeMarkupTagNames.isB "selected"}}"
{{action "toggleMarkup" "b"}}
>
B
</button>
<button
type="button"
title="Italic"
class="koenig-toolbar-btn koenig-toolbar-btn-italic {{if (or activeMarkupTagNames.isEm activeMarkupTagNames.isI) "selected"}}"
{{action "toggleMarkup" "em"}}
>
I
</button>
<button
type="button"
title="Heading One"
class="koenig-toolbar-btn koenig-toolbar-btn-h1 {{if activeSectionTagNames.isH1 "selected"}}"
{{action "toggleSection" "h1"}}
>
H1
</button>
<button
type="button"
title="Heading Two"
class="koenig-toolbar-btn koenig-toolbar-btn-h2 {{if activeSectionTagNames.isH2 "selected"}}"
{{action "toggleSection" "h2"}}
>
H2
</button>
<ul class="kg-action-bar bg-lgr-darkgrey inline-flex pa0 ma0 list br3 shadow-2 items-center relative white f8 fw6 tracked-2 {{if showToolbar "anim-fast-bezier" "o-0 pop-down"}}">
<li class="ma0 lh-solid">
<button
type="button"
title="Bold"
class="dib dim-lite pa3 pt2 pb2 link"
{{action "toggleMarkup" "strong"}}
>
{{svg-jar "koenig/kg-bold" class=(concat (if activeMarkupTagNames.isStrong "stroke-blue-l2" "stroke-white") " w4 h4 nudge-top--1")}}
</button>
</li>
<li class="ma0 lh-solid">
<button
type="button"
title="Italic"
class="dib dim-lite pa3 pt2 pb2 link"
{{action "toggleMarkup" "em"}}
>
{{svg-jar "koenig/kg-italic" class=(concat (if (or activeMarkupTagNames.isEm activeMarkupTagNames.isI) "stroke-blue-l2" "stroke-white") " w4 h4 nudge-top--1")}}
</button>
</li>
<li class="ma0 lh-solid">
<button
type="button"
title="Heading One"
class="dib dim-lite pa3 pt2 pb2 link"
{{action "toggleSection" "h1"}}
>
{{svg-jar "koenig/kg-heading-1" class=(concat (if activeSectionTagNames.isH1 "stroke-blue-l2" "stroke-white") " w4 h4 nudge-top--1")}}
</button>
</li>
<li class="ma0 lh-solid">
<button
type="button"
title="Heading Two"
class="dib dim-lite pa3 pt2 pb2 link"
{{action "toggleSection" "h2"}}
>
{{svg-jar "koenig/kg-heading-2" class=(concat (if activeSectionTagNames.isH2 "stroke-blue-l2" "stroke-white") " w4 h4 nudge-top--1")}}
</button>
</li>
<div class="koenig-toolbar-divider" role="presentation"></div>
<li class="ma0 lh-solid kg-action-bar-divider bg-darkgrey-d2 h5"></li>
<button
type="button"
title="Unordered List"
class="koenig-toolbar-btn koenig-toolbar-btn-list {{if activeSectionTagNames.isUl "selected"}}"
{{action "toggleSection" "ul"}}
>
{{svg-jar "koenig/list-bullets"}}
</button>
<button
type="button"
title="Ordered List"
class="koenig-toolbar-btn koenig-toolbar-btn-list {{if activeSectionTagNames.isOl "selected"}}"
{{action "toggleSection" "ol"}}
>
{{svg-jar "koenig/list-number"}}
</button>
<button
type="button"
title="Quote"
class="koenig-toolbar-btn koenig-toolbar-btn-quote {{if activeSectionTagNames.isBlockquote "selected"}}"
{{action "toggleSection" "blockquote"}}
>
&ldquo;
</button>
<li class="ma0 lh-solid">
<button
type="button"
title="Quote"
class="dib dim-lite pa3 pt2 pb2 link"
{{action "toggleSection" "blockquote"}}
>
{{svg-jar "koenig/kg-quote" class=(concat (if activeSectionTagNames.isBlockquote "stroke-blue-l2" "stroke-white") " w4 h4 nudge-top--1")}}
</button>
</li>
<li class="ma0 lh-solid">
<button
type="button"
title="Unordered List"
class="dib dim-lite pa3 pt2 pb2 link"
{{action "toggleSection" "ul"}}
>
{{svg-jar "koenig/kg-bullet-list" class=(concat (if activeSectionTagNames.isUl "stroke-blue-l2" "stroke-white") " w4 h4 nudge-top--1")}}
</button>
</li>
<li class="ma0 lh-solid">
<button
type="button"
title="Ordered List"
class="dib dim-lite pa3 pt2 pb2 link"
{{action "toggleSection" "ol"}}
>
{{svg-jar "koenig/kg-numbered-list" class=(concat (if activeSectionTagNames.isOl "stroke-blue-l2" "stroke-white") " w4 h4 nudge-top--1")}}
</button>
</li>
<div class="koenig-toolbar-divider" role="presentation"></div>
<li class="ma0 lh-solid kg-action-bar-divider bg-darkgrey-d2 h5"></li>
<button
type="button"
title="Link"
class="koenig-toolbar-btn koenig-toolbar-btn-link"
>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" fill="none"><path d="M14.5 12.5l.086.086c.781.781 2.047.781 2.828 0l3.965-3.964c1.166-1.167 1.166-3.075 0-4.243l-1.758-1.757c-1.166-1.167-3.076-1.167-4.242 0l-3.965 3.964c-.781.781-.781 2.047 0 2.829l.086.085M9.5 11.5l-.086-.085c-.781-.781-2.047-.781-2.828 0l-3.965 3.964c-1.166 1.167-1.166 3.076 0 4.243l1.758 1.757c1.166 1.167 3.076 1.167 4.242 0l3.965-3.964c.781-.781.781-2.047 0-2.829l-.086-.086M8.111 15.889l7.778-7.778"/></g></svg>
</button>
<li class="ma0 lh-solid">
<button
type="button"
title="Link"
class="dib dim-lite pa3 pt2 pb2 link"
>
{{svg-jar "koenig/kg-link" class=(concat (if activeMarkupTagNames.isA "stroke-blue-l2" "stroke-white") " w4 h4 nudge-top--1")}}
</button>
</li>
</ul>

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M16.007 11.184c1.787-1.041 2.993-2.972 2.993-5.184 0-3.309-2.691-6-6-6h-9.5c-.276 0-.5.224-.5.5s.224.5.5.5h2.5v22h-2.5c-.276 0-.5.224-.5.5s.224.5.5.5h11c3.584 0 6.5-2.916 6.5-6.5 0-3.064-2.134-5.634-4.993-6.316zm-3.007-10.184c2.757 0 5 2.243 5 5s-2.243 5-5 5h-6v-10h6zm1.5 22h-7.5v-11h7.5c3.032 0 5.5 2.468 5.5 5.5s-2.468 5.5-5.5 5.5z"/></svg>

Before

Width:  |  Height:  |  Size: 447 B

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12.707 12l11.147-11.146c.195-.195.195-.512 0-.707s-.512-.195-.707 0l-11.147 11.146-11.146-11.147c-.195-.195-.512-.195-.707 0s-.195.512 0 .707l11.146 11.147-11.147 11.146c-.195.195-.195.512 0 .707.098.098.226.147.354.147s.256-.049.354-.146l11.146-11.147 11.146 11.146c.098.098.226.147.354.147s.256-.049.354-.146c.195-.195.195-.512 0-.707l-11.147-11.147z"/></svg>

Before

Width:  |  Height:  |  Size: 466 B

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g><path d="M17.961 6.308l-.108-.162-5.999-5.999-.162-.108-.192-.039h-11c-.276 0-.5.224-.5.5v23c0 .276.224.5.5.5h17c.276 0 .5-.224.5-.5v-17l-.039-.192zm-5.961-4.601l4.293 4.293h-4.293v-4.293zm-11 21.293v-22h10v5.5c0 .276.224.5.5.5h5.5v16h-16zM11.854 10.146c-.195-.195-.512-.195-.707 0s-.195.512 0 .707l3.647 3.646-3.647 3.646c-.195.195-.195.512 0 .707.097.099.225.148.353.148s.256-.049.354-.146l4-4c.195-.195.195-.512 0-.707l-4-4.001zM6.853 10.146c-.195-.195-.512-.195-.707 0l-4 4c-.195.195-.195.512 0 .707l4 4c.098.098.226.147.354.147s.256-.049.353-.146c.195-.195.195-.512 0-.707l-3.646-3.647 3.646-3.646c.196-.196.196-.512 0-.708z"/></g></svg>

Before

Width:  |  Height:  |  Size: 740 B

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g><path d="M6.103 8.411c-.195-.195-.512-.195-.707 0l-2.77 2.77c-.195.195-.195.512 0 .707l2.77 2.769c.098.098.226.147.353.147s.256-.049.353-.147c.195-.195.195-.512 0-.707l-2.416-2.416 2.416-2.416c.197-.195.197-.512.001-.707zM8.857 14.657c.098.098.226.147.354.147.128 0 .256-.049.354-.147l2.769-2.769c.195-.195.195-.512 0-.707l-2.769-2.77c-.195-.195-.512-.195-.707 0-.195.195-.195.512 0 .707l2.416 2.416-2.417 2.416c-.195.196-.195.512 0 .707zM23.855 13.646l-2.5-2.5c-.195-.195-.512-.195-.707 0l-7.502 7.501c-.057.057-.092.125-.116.197l-.011.019-1 3.5c-.05.175-.002.363.127.491.095.094.223.146.354.146l.138-.02 3.5-1 .019-.011c.072-.024.14-.059.197-.116l7.502-7.501c.094-.094.147-.221.147-.354-.001-.132-.054-.259-.148-.352zm-7.855 7.147l-1.793-1.793 4.795-4.794 1.793 1.793-4.795 4.794zm-2.253-.839l1.298 1.298-1.818.52.52-1.818zm7.755-4.662l-1.793-1.793 1.293-1.293 1.793 1.793-1.293 1.293zM1 1h10v4.5c0 .276.224.5.5.5h4.498l-.018 6.032 1 .004.02-6.534v-.001l-.02-.098-.019-.095-.108-.162-4.999-4.999-.162-.108-.192-.039h-11c-.276 0-.5.224-.5.5v21c0 .276.224.5.5.5h10.5v-1h-10v-20zm11 .707l3.293 3.293h-3.293v-3.293z"/></g></svg>

Before

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g><path d="M17.486 11c-3.584 0-6.5 2.916-6.5 6.5s2.916 6.5 6.5 6.5 6.5-2.916 6.5-6.5-2.916-6.5-6.5-6.5zm0 12c-3.032 0-5.5-2.467-5.5-5.5s2.468-5.5 5.5-5.5 5.5 2.467 5.5 5.5-2.467 5.5-5.5 5.5zM20.213 17h-2.227v-2.227c0-.276-.224-.5-.5-.5s-.5.224-.5.5v2.227h-2.227c-.276 0-.5.224-.5.5s.224.5.5.5h2.227v2.228c0 .276.224.5.5.5s.5-.224.5-.5v-2.228h2.227c.276 0 .5-.224.5-.5s-.224-.5-.5-.5zM7.647 14.854c.111.111.269.165.425.142.156-.022.292-.117.367-.256l2.498-4.58.463 1.122c.104.256.399.377.652.272.255-.105.377-.397.271-.653l-.861-2.091c-.073-.178-.242-.298-.435-.309-.224-.02-.374.091-.466.26l-2.681 4.913-1.527-1.527c-.113-.114-.275-.166-.434-.14-.158.026-.295.127-.367.27l-2.5 5c-.077.155-.069.339.021.486.093.147.254.237.427.237h5.46c.276 0 .5-.224.5-.5s-.224-.5-.5-.5h-4.651l1.828-3.656 1.51 1.51zM5 9c1.102 0 2-.897 2-2s-.898-2-2-2-2 .897-2 2 .898 2 2 2zm0-3c.552 0 1 .449 1 1s-.448 1-1 1-1-.449-1-1 .448-1 1-1zM1 1h10v4.5c0 .276.224.5.5.5h4.5v4h1v-4.5l-.039-.192-.108-.162-4.999-4.999-.162-.108-.192-.039h-11c-.276 0-.5.224-.5.5v21c0 .276.224.5.5.5h10.5v-1h-10v-20zm11 .707l3.293 3.293h-3.293v-3.293z"/></g></svg>

Before

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g><path d="M17.5 22h-1.163l-6.884-20.161c-.069-.203-.26-.339-.474-.339-.214 0-.404.137-.474.339l-6.863 20.161h-1.142c-.276 0-.5.224-.5.5s.224.5.5.5h3.02c.276 0 .5-.224.5-.5s-.223-.5-.5-.5h-.821l2.043-6h8.49l2.049 6h-.801c-.276 0-.5.224-.5.5s.224.5.5.5h3.02c.276 0 .5-.224.5-.5s-.224-.5-.5-.5zm-12.418-7l3.899-11.45 3.909 11.45h-7.808zM23.5 22h-.641l-4.482-13.126c-.069-.203-.26-.339-.474-.339-.214 0-.404.137-.474.339l-2.36 6.932c-.089.262.051.546.312.635.261.086.545-.051.635-.312l1.888-5.544 2.191 6.415h-3.175c-.276 0-.5.224-.5.5s.224.5.5.5h3.516l1.365 4h-.286c-.276 0-.5.224-.5.5s.224.5.5.5h1.985c.276 0 .5-.224.5-.5s-.224-.5-.5-.5z"/></g></svg>

Before

Width:  |  Height:  |  Size: 745 B

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g><path d="M23.879.174c-.095-.11-.233-.174-.379-.174h-23c-.146 0-.284.064-.379.174-.095.11-.137.256-.115.4l3 20c.027.183.153.336.328.398l8.5 3 .166.028.166-.028 8.5-3c.175-.062.301-.214.328-.398l3-20c.022-.144-.02-.29-.115-.4zm-3.829 19.954l-8.05 2.842-8.05-2.841-2.869-19.129h21.838l-2.869 19.128zM7.5 11h8.424l-.873 6.108-3.051.872-3.055-.873-.412-2.684c-.042-.272-.29-.459-.57-.418-.273.042-.46.297-.418.57l.461 3c.029.193.169.351.356.405l3.5 1 .138.02.138-.019 3.5-1c.189-.054.329-.215.357-.41l1-7c.021-.144-.022-.289-.117-.398-.095-.11-.233-.173-.378-.173h-8.576l-.834-5h10.41c.276 0 .5-.224.5-.5s-.224-.5-.5-.5h-11c-.148 0-.286.064-.382.177-.095.112-.136.26-.111.405l1 6c.04.241.249.418.493.418z"/></g></svg>

Before

Width:  |  Height:  |  Size: 810 B

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M23.5 0h-8c-.276 0-.5.224-.5.5s.224.5.5.5h3.077l-14.348 22h-3.729c-.276 0-.5.224-.5.5s.224.5.5.5h8c.276 0 .5-.224.5-.5s-.224-.5-.5-.5h-3.077l14.348-22h3.729c.276 0 .5-.224.5-.5s-.224-.5-.5-.5z"/></svg>

Before

Width:  |  Height:  |  Size: 305 B

View File

@ -0,0 +1 @@
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><g stroke="currentColor" fill="none" fill-rule="evenodd" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4.765 2v12m0-6.783h3.823c1.787 0 3.236-1.167 3.236-2.608 0-1.44-1.45-2.609-3.236-2.609H3"/><path d="M7.412 7.217H9.47c1.948 0 3.529 1.52 3.529 3.392C13 12.48 11.419 14 9.47 14H3"/></g></svg>

After

Width:  |  Height:  |  Size: 381 B

View File

@ -0,0 +1 @@
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><g stroke="currentColor" fill="none" fill-rule="evenodd"><circle cx="3.5" cy="2.5" r="1"/><circle cx="3.5" cy="7.5" r="1"/><path d="M7.5 2.5h6m-6 5h6" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><circle cx="3.5" cy="12.5" r="1"/><path d="M7.5 12.5h6" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></g></svg>

After

Width:  |  Height:  |  Size: 407 B

View File

@ -0,0 +1 @@
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><g stroke="currentColor" fill="none" fill-rule="evenodd" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M11.5 2.167L13.833 4.5 8 10.333H5.667V8z"/><path d="M6.057 3H2v11h12V9"/></g></svg>

After

Width:  |  Height:  |  Size: 273 B

View File

@ -0,0 +1 @@
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M3 2v12M13 2v12M3 8h10.005" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor" fill="none" fill-rule="evenodd"/></svg>

After

Width:  |  Height:  |  Size: 222 B

View File

@ -0,0 +1 @@
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M5 5.483V13m6-7.517V13M5 9h6" stroke="currentColor" stroke-width="2" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"/></svg>

After

Width:  |  Height:  |  Size: 224 B

View File

@ -0,0 +1 @@
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><g stroke="currentColor" fill="none" fill-rule="evenodd" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 2h9M5 14h9m-2-8h2m-2 4h2" opacity=".6"/><path d="M2 6h6.005v4.001H2z"/></g></svg>

After

Width:  |  Height:  |  Size: 274 B

View File

@ -0,0 +1 @@
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><g stroke="currentColor" fill="none" fill-rule="evenodd" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M6 2h4M6 14h4" opacity=".6"/><path d="M2 6h12v4.001H2z"/></g></svg>

After

Width:  |  Height:  |  Size: 257 B

View File

@ -0,0 +1 @@
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><g stroke="currentColor" fill="none" fill-rule="evenodd" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M2 2h12M2 14h12" opacity=".6"/><path d="M2 6h12v4.001H2z"/></g></svg>

After

Width:  |  Height:  |  Size: 259 B

View File

@ -0,0 +1 @@
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><g stroke="currentColor" fill="none" fill-rule="evenodd" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 2h8M4 14h8" opacity=".6"/><path d="M2 6h12v4.001H2z"/></g></svg>

After

Width:  |  Height:  |  Size: 257 B

View File

@ -0,0 +1 @@
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M9 2h4.915M2 14h4.915m-2.577-.011L11.52 2.108" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor" fill="none" fill-rule="evenodd"/></svg>

After

Width:  |  Height:  |  Size: 241 B

View File

@ -0,0 +1 @@
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><g stroke="currentColor" fill="none" fill-rule="evenodd" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M7.093 12.41l-1.07 1.026a2.096 2.096 0 0 1-2.965 0l-.494-.494a2.097 2.097 0 0 1 0-2.964l3.213-3.213a2.096 2.096 0 0 1 2.965 0"/><path d="M8.742 3.756l1.235-1.192a2.098 2.098 0 0 1 2.965 0l.494.494a2.096 2.096 0 0 1 0 2.965L10.21 9.367c-.82.82-2.146.82-2.965 0"/></g></svg>

After

Width:  |  Height:  |  Size: 462 B

View File

@ -0,0 +1 @@
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><g stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"><path d="M7.5 2.5h6m-6 5h6m-6 5h6" stroke-width="2"/><path d="M3.292 11.5h1.126l-.583.897c.482 0 .583.28.583.572 0 .292-.101.573-.583.573h-.543m1.207-4.741H3.292c.863-1.166 1.166-1.07 1.166-1.728a.575.575 0 0 0-.583-.573.553.553 0 0 0-.563.568m.855-3.276V1.5l-.875.854"/></g></svg>

After

Width:  |  Height:  |  Size: 445 B

View File

@ -0,0 +1 @@
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M3.44 9H6v4H3V5.082C3 4.388 3.667 3.694 5 3m5.44 6H13v4h-3V5.082c0-.694.667-1.388 2-2.082" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor" fill="none" fill-rule="evenodd"/></svg>

After

Width:  |  Height:  |  Size: 285 B

View File

@ -0,0 +1 @@
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><g stroke="currentColor" fill="none" fill-rule="evenodd" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M1.583 3.333v3.5h3.5m9.334 5.834v-3.5h-3.5"/><path d="M12.952 6.25c-.644-1.82-1.907-2.943-3.79-3.37-1.883-.425-3.507.044-4.872 1.41L1.583 6.833m12.834 2.334L11.71 11.71c-1.365 1.366-2.989 1.835-4.872 1.41-1.883-.427-3.146-1.55-3.79-3.37"/></g></svg>

After

Width:  |  Height:  |  Size: 439 B

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g><path d="M6.065 5.431c.098.098.226.146.354.146.128 0 .256-.049.353-.146.195-.195.195-.512 0-.707l-2-2c-.195-.195-.512-.195-.707 0-.195.195-.195.512 0 .707l2 2zM9.487 4.5c.276 0 .5-.224.5-.5v-2.5c0-.276-.224-.5-.5-.5s-.5.224-.5.5v2.5c0 .276.223.5.5.5zM2.893 9h2.5c.276 0 .5-.224.5-.5s-.224-.5-.5-.5h-2.5c-.276 0-.5.224-.5.5s.224.5.5.5zM10.565 18.724l-3.403 3.401c-1.128 1.128-3.114 1.128-4.242 0l-1.061-1.06c-.564-.564-.874-1.317-.874-2.122 0-.804.31-1.557.874-2.121l3.402-3.403c.195-.195.195-.512 0-.707-.195-.195-.512-.195-.707 0l-3.402 3.403c-.753.753-1.168 1.757-1.168 2.828s.414 2.076 1.168 2.829l1.06 1.06c.753.753 1.758 1.168 2.829 1.168s2.075-.415 2.828-1.168l3.403-3.401c.195-.195.195-.512 0-.707-.195-.196-.512-.196-.707 0zM19.893 8h-4.5c-.276 0-.5.224-.5.5s.224.5.5.5h4.5c1.663 0 3.123 1.438 3.123 3.077v2c0 1.585-1.441 2.923-3.147 2.923h-4.476c-.276 0-.5.224-.5.5s.224.5.5.5h4.476c2.248 0 4.147-1.796 4.147-3.923v-2c0-2.172-1.927-4.077-4.123-4.077z"/></g></svg>

Before

Width:  |  Height:  |  Size: 1.0 KiB

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g><path d="M21.732 4.025l-1.758-1.757c-1.316-1.317-3.633-1.317-4.949 0l-3.965 3.964c-.975.975-.975 2.561.001 3.537l.086.085c.197.195.513.194.707-.002.195-.196.194-.512-.002-.707l-.085-.085c-.585-.585-.585-1.537 0-2.122l3.965-3.964c.939-.94 2.596-.94 3.535 0l1.757 1.757c.974.975.974 2.561 0 3.536l-3.965 3.964c-.585.585-1.536.585-2.121 0l-.086-.086c-.195-.195-.512-.195-.707 0s-.195.512 0 .707l.086.086c.489.489 1.129.732 1.769.732.64 0 1.28-.244 1.768-.731l3.965-3.964c1.363-1.364 1.363-3.584-.001-4.95zM12.854 14.146c-.195-.195-.512-.195-.707 0s-.195.512 0 .707l.086.086c.585.585.585 1.537 0 2.122l-3.965 3.964c-.939.94-2.595.94-3.535 0l-1.758-1.757c-.974-.975-.974-2.561 0-3.536l3.965-3.964c.585-.585 1.537-.584 2.122.001l.086.085c.197.195.513.194.707-.002.195-.196.194-.512-.002-.707l-.085-.085c-.975-.975-2.561-.975-3.535 0l-3.965 3.964c-1.363 1.365-1.363 3.585 0 4.95l1.757 1.757c.659.659 1.538 1.022 2.475 1.022s1.816-.363 2.475-1.022l3.965-3.964c.975-.975.975-2.561 0-3.536l-.086-.085zM7.758 16.243c.098.098.226.146.354.146.128 0 .256-.049.353-.146l7.777-7.778c.195-.195.195-.512 0-.707-.195-.195-.512-.195-.707 0l-7.777 7.778c-.196.195-.196.511 0 .707z"/></g></svg>

Before

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g><path d="M8.5 5h15c.276 0 .5-.224.5-.5s-.224-.5-.5-.5h-15c-.276 0-.5.224-.5.5s.224.5.5.5zM23.5 12h-15c-.276 0-.5.224-.5.5s.224.5.5.5h15c.276 0 .5-.224.5-.5s-.224-.5-.5-.5zM23.5 20h-15c-.276 0-.5.224-.5.5s.224.5.5.5h15c.276 0 .5-.224.5-.5s-.224-.5-.5-.5zM4.5 2h-4c-.276 0-.5.224-.5.5v4c0 .276.224.5.5.5h4c.276 0 .5-.224.5-.5v-4c0-.276-.224-.5-.5-.5zm-.5 4h-3v-3h3v3zM4.5 10h-4c-.276 0-.5.224-.5.5v4c0 .276.224.5.5.5h4c.276 0 .5-.224.5-.5v-4c0-.276-.224-.5-.5-.5zm-.5 4h-3v-3h3v3zM4.5 18h-4c-.276 0-.5.224-.5.5v4c0 .276.224.5.5.5h4c.276 0 .5-.224.5-.5v-4c0-.276-.224-.5-.5-.5zm-.5 4h-3v-3h3v3z"/></g></svg>

Before

Width:  |  Height:  |  Size: 702 B

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g><path d="M6.5 5h17c.276 0 .5-.224.5-.5s-.224-.5-.5-.5h-17c-.276 0-.5.224-.5.5s.224.5.5.5zM23.5 12h-17c-.276 0-.5.224-.5.5s.224.5.5.5h17c.276 0 .5-.224.5-.5s-.224-.5-.5-.5zM23.5 20h-17c-.276 0-.5.224-.5.5s.224.5.5.5h17c.276 0 .5-.224.5-.5s-.224-.5-.5-.5zM.85 4.394l.65-.634v2.74c0 .276.224.5.5.5s.5-.224.5-.5v-3.927c0-.201-.12-.383-.306-.461-.184-.077-.399-.038-.544.104l-1.5 1.464c-.197.192-.201.509-.008.707.193.196.509.202.708.007zM2.569 14h-1.036c.254-.298.465-.521.64-.703.515-.541.827-.868.827-1.76 0-.817-.673-1.482-1.5-1.482-.821 0-1.465.647-1.465 1.474 0 .276.224.5.5.5s.5-.224.5-.5c0-.279.191-.474.465-.474.28 0 .5.212.5.482 0 .491-.084.58-.551 1.07-.321.336-.761.798-1.352 1.595-.112.152-.129.354-.044.523.086.169.259.275.447.275h2.069c.276 0 .5-.224.5-.5s-.223-.5-.5-.5zM2.24 19.71l.609-.938c.101-.153.108-.35.02-.511-.086-.16-.255-.261-.438-.261h-1.931c-.276 0-.5.224-.5.5s.224.5.5.5h1.009l-.497.765c-.101.153-.108.35-.021.511.087.161.256.262.439.262.428 0 .5.12.5.482 0 .361-.072.481-.5.481h-.93c-.276-.001-.5.223-.5.499s.224.5.5.5h.931c.953 0 1.5-.54 1.5-1.481 0-.629-.244-1.079-.691-1.309z"/></g></svg>

Before

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M23.5 0h-17c-3.584 0-6.5 2.916-6.5 6.5s2.916 6.5 6.5 6.5h3.5v10.5c0 .276.224.5.5.5s.5-.224.5-.5v-22.5h6v22.5c0 .276.224.5.5.5s.5-.224.5-.5v-22.5h5.5c.276 0 .5-.224.5-.5s-.224-.5-.5-.5zm-13.5 12h-3.5c-3.032 0-5.5-2.468-5.5-5.5s2.468-5.5 5.5-5.5h3.5v11z"/></svg>

Before

Width:  |  Height:  |  Size: 364 B

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g><path d="M11 3c-6.065 0-11 4.935-11 11v1.5c0 3.032 2.468 5.5 5.5 5.5s5.5-2.468 5.5-5.5-2.468-5.5-5.5-5.5c-1.748 0-3.305.823-4.313 2.099.891-4.607 4.95-8.099 9.813-8.099.276 0 .5-.224.5-.5s-.224-.5-.5-.5zm-5.5 8c2.481 0 4.5 2.019 4.5 4.5s-2.019 4.5-4.5 4.5-4.5-2.019-4.5-4.5 2.019-4.5 4.5-4.5zM23.5 3c-6.065 0-11 4.935-11 11v1.5c0 3.032 2.468 5.5 5.5 5.5s5.5-2.468 5.5-5.5-2.468-5.5-5.5-5.5c-1.748 0-3.305.823-4.314 2.099.892-4.607 4.951-8.099 9.814-8.099.276 0 .5-.224.5-.5s-.224-.5-.5-.5zm-5.5 8c2.481 0 4.5 2.019 4.5 4.5s-2.019 4.5-4.5 4.5-4.5-2.019-4.5-4.5 2.019-4.5 4.5-4.5z"/></g></svg>

Before

Width:  |  Height:  |  Size: 689 B

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g><path d="M18.5 3c-3.032 0-5.5 2.468-5.5 5.5s2.468 5.5 5.5 5.5c1.748 0 3.305-.823 4.313-2.099-.891 4.607-4.95 8.099-9.813 8.099-.276 0-.5.224-.5.5s.224.5.5.5c6.065 0 11-4.935 11-11v-1.5c0-3.032-2.468-5.5-5.5-5.5zm0 10c-2.481 0-4.5-2.019-4.5-4.5s2.019-4.5 4.5-4.5 4.5 2.019 4.5 4.5-2.019 4.5-4.5 4.5zM6 3c-3.032 0-5.5 2.468-5.5 5.5s2.468 5.5 5.5 5.5c1.748 0 3.305-.823 4.314-2.099-.892 4.607-4.951 8.099-9.814 8.099-.276 0-.5.224-.5.5s.224.5.5.5c6.065 0 11-4.935 11-11v-1.5c0-3.032-2.468-5.5-5.5-5.5zm0 10c-2.481 0-4.5-2.019-4.5-4.5s2.019-4.5 4.5-4.5 4.5 2.019 4.5 4.5-2.019 4.5-4.5 4.5z"/></g></svg>

Before

Width:  |  Height:  |  Size: 696 B

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M23.854 23.146l-9.009-9.009A8.455 8.455 0 0 0 17 8.5C17 3.813 13.187 0 8.5 0S0 3.813 0 8.5 3.813 17 8.5 17a8.45 8.45 0 0 0 5.637-2.156l9.009 9.009a.5.5 0 1 0 .708-.707zM1 8.5C1 4.364 4.364 1 8.5 1S16 4.364 16 8.5 12.636 16 8.5 16 1 12.636 1 8.5z"></path></svg>

Before

Width:  |  Height:  |  Size: 342 B

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M23.5 13h-10.28c-.823-.61-1.728-1.166-2.623-1.715-2.621-1.607-5.097-3.125-5.097-5.785 0-3.248 3.444-3.5 4.5-3.5 3.988 0 4.5 1.603 4.5 3v1c0 .276.224.5.5.5s.5-.224.5-.5v-1c0-2.654-1.851-4-5.5-4-3.393 0-5.5 1.725-5.5 4.5 0 3.22 2.833 4.957 5.573 6.638.469.288.932.573 1.381.862h-10.954c-.276 0-.5.224-.5.5s.224.5.5.5h12.383c1.523 1.182 2.617 2.546 2.617 4.5 0 3.317-2.841 4.5-5.5 4.5-2.509 0-5.5-.694-5.5-4v-1c0-.276-.224-.5-.5-.5s-.5.224-.5.5v1c0 3.225 2.309 5 6.5 5 3.948 0 6.5-2.159 6.5-5.5 0-1.912-.853-3.326-2.085-4.5h9.085c.276 0 .5-.224.5-.5s-.224-.5-.5-.5z"/></svg>

Before

Width:  |  Height:  |  Size: 675 B

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g><path d="M17.885.147c-.195-.195-.512-.195-.707 0l-7.647 7.646-7.646-7.646c-.195-.195-.512-.195-.707 0s-.195.512 0 .707l7.646 7.646-7.646 7.646c-.195.195-.195.512 0 .707.097.098.225.147.353.147.128 0 .256-.049.354-.146l7.646-7.647 7.646 7.647c.098.097.226.146.354.146.128 0 .256-.049.354-.146.195-.195.195-.512 0-.707l-7.647-7.647 7.646-7.647c.196-.195.196-.511.001-.706zM22.484 23h-1.52l1.711-2.443c.09-.132.325-.48.325-1.008 0-.957-.78-1.736-1.74-1.736-.937 0-1.701.73-1.74 1.664-.011.275.203.509.479.521.283.004.509-.204.521-.48.016-.395.342-.705.74-.705.408 0 .74.33.74.736 0 .205-.075.333-.147.441l-2.258 3.224c-.107.153-.12.352-.034.518.086.166.257.27.443.27h2.48c.276 0 .5-.224.5-.5s-.223-.502-.5-.502z"/></g></svg>

Before

Width:  |  Height:  |  Size: 819 B

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g><path d="M17.854 7.147c-.195-.195-.512-.195-.707 0l-7.647 7.646-7.646-7.646c-.195-.195-.512-.195-.707 0s-.195.512 0 .707l7.646 7.646-7.647 7.646c-.195.195-.195.512 0 .707.098.098.226.147.354.147s.256-.049.354-.146l7.646-7.647 7.646 7.646c.098.098.226.147.354.147s.256-.049.354-.146c.195-.195.195-.512 0-.707l-7.647-7.647 7.647-7.647c.195-.195.195-.511 0-.706zM22.494 6.053h-1.521l1.709-2.441c.141-.204.326-.53.326-1.01 0-.957-.78-1.736-1.74-1.736-.936 0-1.701.731-1.74 1.665-.011.275.203.509.479.521.283-.003.509-.204.521-.48.016-.395.342-.706.74-.706.408 0 .74.33.74.736 0 .207-.078.339-.147.44l-2.258 3.224c-.107.153-.12.353-.034.518.086.166.257.27.443.27h2.482c.276 0 .5-.224.5-.5 0-.278-.223-.501-.5-.501z"/></g></svg>

Before

Width:  |  Height:  |  Size: 820 B

View File

@ -1 +0,0 @@
<svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g><path d="M23.5 23h-23c-.276 0-.5.224-.5.5s.224.5.5.5h23c.276 0 .5-.224.5-.5s-.224-.5-.5-.5zM1.5 1h2.5v11c0 4.411 3.589 8 8 8s8-3.589 8-8v-11h2.5c.276 0 .5-.224.5-.5s-.224-.5-.5-.5h-6c-.276 0-.5.224-.5.5s.224.5.5.5h2.5v11c0 3.859-3.141 7-7 7s-7-3.141-7-7v-11h2.5c.276 0 .5-.224.5-.5s-.224-.5-.5-.5h-6c-.276 0-.5.224-.5.5s.224.5.5.5z"/></g></svg>

Before

Width:  |  Height:  |  Size: 442 B