diff --git a/customize.dist/fonts/cptools/fonts/cptools.svg b/customize.dist/fonts/cptools/fonts/cptools.svg new file mode 100644 index 000000000..2ea458f12 --- /dev/null +++ b/customize.dist/fonts/cptools/fonts/cptools.svg @@ -0,0 +1,12 @@ + + + +Generated by IcoMoon + + + + + + + + \ No newline at end of file diff --git a/customize.dist/fonts/cptools/fonts/cptools.ttf b/customize.dist/fonts/cptools/fonts/cptools.ttf new file mode 100644 index 000000000..179ba4d98 Binary files /dev/null and b/customize.dist/fonts/cptools/fonts/cptools.ttf differ diff --git a/customize.dist/fonts/cptools/fonts/cptools.woff b/customize.dist/fonts/cptools/fonts/cptools.woff new file mode 100644 index 000000000..04cd47172 Binary files /dev/null and b/customize.dist/fonts/cptools/fonts/cptools.woff differ diff --git a/customize.dist/fonts/cptools/style.css b/customize.dist/fonts/cptools/style.css new file mode 100644 index 000000000..83c233e62 --- /dev/null +++ b/customize.dist/fonts/cptools/style.css @@ -0,0 +1,31 @@ +@font-face { + font-family: 'cptools'; + src: + url('fonts/cptools.ttf?dysqmo') format('truetype'), + url('fonts/cptools.woff?dysqmo') format('woff'), + url('fonts/cptools.svg?dysqmo#cptools') format('svg'); + font-weight: normal; + font-style: normal; +} + +.cptools { + /* use !important to prevent issues with browser extensions that change fonts */ + font-family: 'cptools' !important; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + + /* Better Font Rendering =========== */ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.cptools-template:before { + content: "\e900"; +} +.cptools-new-template:before { + content: "\e901"; +} diff --git a/customize.dist/src/less2/include/creation.less b/customize.dist/src/less2/include/creation.less index 0fca7797d..e5c71a3db 100644 --- a/customize.dist/src/less2/include/creation.less +++ b/customize.dist/src/less2/include/creation.less @@ -279,12 +279,12 @@ color: black; border: 1px solid transparent; - &.cp-creation-template-selected { + &.cp-creation-template-selected, &:hover { color: @creation-color !important; color: var(--creation-color) !important; background-color: @creation-bg-color !important; background-color: var(--creation-bg-color) !important; - .fa { + .fa, .cptools { color: @creation-color; color: var(--creation-color); } @@ -292,12 +292,6 @@ transition: all 0.1s; - &:hover { - //color: @colortheme_modal-fg; - background-color: @colortheme_form-border; - box-shadow: none; - } - align-items: center; img { @@ -317,7 +311,7 @@ margin-top: 5px; max-width: 100%; } - .fa { + .fa, .cptools { color: @creation-bg-color; color: var(--creation-bg-color); cursor: pointer; diff --git a/customize.dist/src/less2/include/font.less b/customize.dist/src/less2/include/font.less index 9247ae109..627a9a9f8 100644 --- a/customize.dist/src/less2/include/font.less +++ b/customize.dist/src/less2/include/font.less @@ -8,5 +8,11 @@ src: url("/customize/fonts/neuropolitical.ttf"); } +// Fonts need to go on the global scope +@font-tools { + font-family: CryptPadTools; + src: url("/customize/fonts/cryptpadtools.ttf"); +} + @import (once) '/customize/fonts/open-sans.less'; diff --git a/www/common/common-ui-elements.js b/www/common/common-ui-elements.js index 3d696df93..c837c23d9 100644 --- a/www/common/common-ui-elements.js +++ b/www/common/common-ui-elements.js @@ -13,6 +13,7 @@ define([ '/customize/messages.js', '/customize/application_config.js', '/bower_components/nthen/index.js', + 'css!/customize/fonts/cptools/style.css' ], function ($, Config, Util, Hash, Language, UI, Constants, Feedback, h, MediaTag, Clipboard, Messages, AppConfig, NThen) { var UIElements = {}; @@ -2045,12 +2046,14 @@ define([ allData.unshift({ name: Messages.creation_newTemplate, id: -1, - icon: h('span.fa.fa-bookmark') + //icon: h('span.fa.fa-bookmark') + icon: h('span.cptools.cptools-new-template') }); allData.unshift({ name: Messages.creation_noTemplate, id: 0, - icon: h('span.fa.fa-file') + //icon: h('span.fa.fa-file') + icon: UI.getFileIcon({type: type}) }); var redraw = function (index) { if (index < 0) { i = 0; } @@ -2066,7 +2069,7 @@ define([ }).appendTo($container); $span.data('id', obj.id); if (idx === selected) { $span.addClass('cp-creation-template-selected'); } - $span.append(obj.icon || UI.getFileIcon({type: type})); + $span.append(obj.icon || h('span.cptools.cptools-template')); $('', {'class': 'cp-creation-template-element-name'}).text(name) .appendTo($span); $span.click(function () {