diff --git a/bundles/org.openhab.ui.basic/gulpfile.js b/bundles/org.openhab.ui.basic/gulpfile.js index 19909d3833..e05cb18302 100644 --- a/bundles/org.openhab.ui.basic/gulpfile.js +++ b/bundles/org.openhab.ui.basic/gulpfile.js @@ -17,7 +17,9 @@ var paths = { FontLibs: [ './node_modules/material-design-icons/iconfont/MaterialIcons-Regular.woff*', - './node_modules/material-design-icons/iconfont/MaterialIcons-Regular.ttf' + './node_modules/material-design-icons/iconfont/MaterialIcons-Regular.ttf', + './node_modules/framework7-icons/fonts/Framework7Icons-Regular.woff*', + './node_modules/framework7-icons/fonts/Framework7Icons-Regular.ttf' ] }; diff --git a/bundles/org.openhab.ui.basic/package-lock.json b/bundles/org.openhab.ui.basic/package-lock.json index 1427da5adb..df8b0e878e 100644 --- a/bundles/org.openhab.ui.basic/package-lock.json +++ b/bundles/org.openhab.ui.basic/package-lock.json @@ -8,6 +8,7 @@ "name": "org.openhab.ui.basic", "version": "4.0.0", "dependencies": { + "framework7-icons": "^5.0.5", "gulp": "^4.0.2", "gulp-eslint": "^6.0.0", "gulp-sass": "^5.0.0", @@ -2143,6 +2144,14 @@ "node": ">=0.10.0" } }, + "node_modules/framework7-icons": { + "version": "5.0.5", + "resolved": "https://registry.npmjs.org/framework7-icons/-/framework7-icons-5.0.5.tgz", + "integrity": "sha512-bvHMLyujV9TFuudehd3ORZ/EvNp19Ir3ckVzYAOf3MkLymHba/9oHLsgopCh0x5UsrYZUpkrE+fd7ggj5y4wRw==", + "engines": { + "node": ">= 0.10.0" + } + }, "node_modules/fs-minipass": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/fs-minipass/-/fs-minipass-2.1.0.tgz", @@ -8314,6 +8323,11 @@ "map-cache": "^0.2.2" } }, + "framework7-icons": { + "version": "5.0.5", + "resolved": "https://registry.npmjs.org/framework7-icons/-/framework7-icons-5.0.5.tgz", + "integrity": "sha512-bvHMLyujV9TFuudehd3ORZ/EvNp19Ir3ckVzYAOf3MkLymHba/9oHLsgopCh0x5UsrYZUpkrE+fd7ggj5y4wRw==" + }, "fs-minipass": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/fs-minipass/-/fs-minipass-2.1.0.tgz", diff --git a/bundles/org.openhab.ui.basic/package.json b/bundles/org.openhab.ui.basic/package.json index 1014b4e55b..2778423b17 100644 --- a/bundles/org.openhab.ui.basic/package.json +++ b/bundles/org.openhab.ui.basic/package.json @@ -11,6 +11,7 @@ "gulp-sass": "^5.0.0", "gulp-uglify": "^3.0.2", "material-design-icons": "^3.0.1", + "framework7-icons": "^5.0.5", "node-sass": "^8.0.0" } } diff --git a/bundles/org.openhab.ui.basic/src/main/java/org/openhab/ui/basic/internal/render/AbstractWidgetRenderer.java b/bundles/org.openhab.ui.basic/src/main/java/org/openhab/ui/basic/internal/render/AbstractWidgetRenderer.java index 96be74dfe1..ce09d970ab 100644 --- a/bundles/org.openhab.ui.basic/src/main/java/org/openhab/ui/basic/internal/render/AbstractWidgetRenderer.java +++ b/bundles/org.openhab.ui.basic/src/main/java/org/openhab/ui/basic/internal/render/AbstractWidgetRenderer.java @@ -61,6 +61,7 @@ public abstract class AbstractWidgetRenderer implements WidgetRenderer { private static final String ICON_SOURCE_IF = "if"; private static final String ICON_SOURCE_ICONIFY = "iconify"; private static final String ICON_SOURCE_MATERIAL = "material"; + private static final String ICON_SOURCE_FRAMEWORK7 = "f7"; private static final String ICON_SET_OH_CLASSIC = "classic"; private static final String DEFAULT_ICON_SOURCE = ICON_SOURCE_OH; private static final String DEFAULT_ICON_SET = ICON_SET_OH_CLASSIC; @@ -176,6 +177,9 @@ private String preprocessIcon(String originalSnippet, Widget w, boolean ignoreSt case ICON_SOURCE_MATERIAL: iconSnippet = getSnippet("icon_material"); break; + case ICON_SOURCE_FRAMEWORK7: + iconSnippet = getSnippet("icon_framework7"); + break; default: break; } diff --git a/bundles/org.openhab.ui.basic/src/main/resources/snippets/icon_framework7.html b/bundles/org.openhab.ui.basic/src/main/resources/snippets/icon_framework7.html new file mode 100644 index 0000000000..fac2b9ce0a --- /dev/null +++ b/bundles/org.openhab.ui.basic/src/main/resources/snippets/icon_framework7.html @@ -0,0 +1 @@ +%icon_name% \ No newline at end of file diff --git a/bundles/org.openhab.ui.basic/src/main/resources/snippets/main.html b/bundles/org.openhab.ui.basic/src/main/resources/snippets/main.html index bbe93bf1d4..c9285bb78e 100644 --- a/bundles/org.openhab.ui.basic/src/main/resources/snippets/main.html +++ b/bundles/org.openhab.ui.basic/src/main/resources/snippets/main.html @@ -25,6 +25,7 @@ + diff --git a/bundles/org.openhab.ui.basic/src/main/resources/web/framework7-icons.css b/bundles/org.openhab.ui.basic/src/main/resources/web/framework7-icons.css new file mode 100644 index 0000000000..0c95e3cf39 --- /dev/null +++ b/bundles/org.openhab.ui.basic/src/main/resources/web/framework7-icons.css @@ -0,0 +1,33 @@ +@font-face { + font-family: 'Framework7 Icons'; + font-style: normal; + font-weight: 400; + src: local('Framework7 Icons'), + local('Framework7Icons-Regular'), + url('fonts/Framework7Icons-Regular.woff2') format('woff2'), + url('fonts/Framework7Icons-Regular.woff') format('woff'), + url('fonts/Framework7Icons-Regular.ttf') format('truetype'); +} + +.f7-icons, +.framework7-icons { + font-family: 'Framework7 Icons'; + font-weight: normal; + font-style: normal; + font-size: 28px; + line-height: 1; + letter-spacing: normal; + text-transform: none; + display: inline-block; + white-space: nowrap; + word-wrap: normal; + direction: ltr; + -webkit-font-smoothing: antialiased; + text-rendering: optimizeLegibility; + -moz-osx-font-smoothing: grayscale; + -webkit-font-feature-settings: 'liga'; + -moz-font-feature-settings: 'liga=1'; + -moz-font-feature-settings: 'liga'; + font-feature-settings: 'liga'; + text-align: center; +} diff --git a/bundles/org.openhab.ui.basic/web-src/_layout.scss b/bundles/org.openhab.ui.basic/web-src/_layout.scss index 9deeae9af6..d07ef391a2 100644 --- a/bundles/org.openhab.ui.basic/web-src/_layout.scss +++ b/bundles/org.openhab.ui.basic/web-src/_layout.scss @@ -170,6 +170,16 @@ font-size: 28px; } } + .f7-icons { + font-size: 32px; + vertical-align: middle; + html:not(.ui-icons-enabled) & { + display: none; + } + html.ui-layout-condensed & { + font-size: 28px; + } + } } &__label { @media screen and (max-width: $layout-tablet-size-threshold) {