Is it possible to override "Roboto" Font by any other webfont? - google-mirror-api

According to base style https://mirror-api-playground.appspot.com/assets/css/base_style.css the "Roboto" is the default Glass font.
Is it possible to use some other webfont (override the Roboto)?
I am sure that ingress player would like to change "Roboto" for "coda_regular"

Importing font is not supported by the Mirror API and the only font available in the client is indeed Roboto.

Related

How to change Keycloak logo on the Admin console page in keycloak.v2 theme

I am trying to find a way to replace Keycloak image on the Admin console page using Keycloak.v2 theme which is the default theme starting from Keycloak 19.
Note that replacing themes\keycloak.v2\account\resources\public\logo.svg didn't really help.
In Keycloak, one of the ways you can change the Keycloak logo is by overriding a theme. The benefit of doing it this way over forking and building the entire keycloak-admin-ui repo is you can control and focus only on customizing the components you want, cutting down the size of your new theme and reducing unnecessary duplication.
For your specific use-case (tested in Keycloak 20.0.1), I did the following to change the Keycloak Logo on the Admin Console Page:
Per the Theme Guide for Keycloak, custom themes can be added to keycloak by placing them into /opt/keycloak/themes. After Keycloak starts the theme can then be selected in the Realm Settings. Therefore, I created a new folder in /opt/keycloak/themes for my custom theme, called myCustomTheme.
The new folder will contain the theme definition for different parts of Keycloak. Since we only care about changing the logo in the Admin Console, we create a folder in /opt/keycloak/theme/myCustomTheme for overriding the Admin Console Theme. Per the defined set of theme types, this folder should be called admin. This is so that when you are selecting themes in Realm Settings within the Admin Console, the MyCustomTheme option will be listed under the Admin Console section (see images below).
Inside of /opt/keycloak/theme/myCustomTheme/admin is where the theme overriding begins. A configuration file called theme.properties should be created. This file is the first thing read by Keycloak when loading your theme and contains information about the theme environment. For more detailed information, see the description of Theme Properties.
Since we are overriding the keycloak.v2 theme, we add the parent field to the properties file, specifying the base theme we are inheriting from. We set it to keycloak.v2, so that myCustomTheme will inherit the keycloak.v2 theme for all of its components unless we are overriding something specific.
parent=keycloak.v2
This next step required a bit of exploration and trial-and-error of how the default keycloak.v2 theme is structured, but I found that the place where the Keycloak logo is defined for keycloak.v2 is in keycloak.v2/admin/resources/logo.svg. Therefore, for myCustomTheme, all one would have to do to use a custom logo that overrides the default keycloak.v2 one is add a resources folder to /opt/keycloak/theme/myCustomTheme/admin and add the custom SVG image as a file called logo.svg.
Note that this is different than what the Keycloak Docs suggest, which has you creating the same resources folder but also an img folder inside of it which would contain your images. I suspect this has to do with the fact that we are overriding an image instead of adding one, and the keycloak.v2 theme code does not follow its own guide and instead places its logo in resources instead of resources/img.
Start Keycloak, go to the Admin Console, sign in and go to Realm Settings > Themes > Admin Console theme, and select myCustomTheme. Refresh and you should see your icon change now.
Below is the results of doing the above, showing my resulting folder structure and the Before/After of replacing the Keycloak logo with some random SVG I got from public domain:
Folder structure: https://ibb.co/h9kZqb3
Before/After: https://ibb.co/cJ6t434
The new admin UI (starting from keycloak 19) has been delivered through keycloak-admin-ui.jar. In order to customize any UI components, it has to be done by forking this repo and build on your own.

React Native Not Supporting the font 'Neusa'

I am developing an React native app and I am using some custom fonts in the app. I successfully imported installed liked the fonts and it is working fine. But one font name neusa not working(Not showing). When font is called it loading only default font. i am sure all custom fonts i am using is .ttf. All other fonts i downloaded from google fonts but not this one. can any one please suggest a way to fix it
The link i followed
If you are 100% that you followed the guide to the letter then the problem might be that you are using the wrong fontFamily. Not all fonts have the font family equalto their names. This happens a lot with FontAwesome.
Upload your font here: http://torinak.com/font/lsfont.html
It should tell you the fontFamily that you need to use. Otherwise you could log the font names that RN is detecting but that involves a little more work

React native application theming

I have a question related to React Native.
I have existing application that should be themed and theming should be part of the configurable settings. There should be 3 aspects of such theming: changing colors/theme, changing logo and add custom fonts
I see this is a way that there will be settings view where:
there will be possibility to upload image, image will be stored in filesystem in ios and android and then used as a brand logo
there will be multiple settings regarding some primary, secondary, buttons colors as hash values, or maybe some color picker component
The most complicated stuff is having custom fonts that can be configured by user in setting view of application. Anybody have experience with doing such a thing?
Any thought/suggestions in above points will be helpful. Like links to native libraries for both platform or any tips from more experiences React Native developers
The best ways I see to achieve what you want are :
Use https://github.com/itinance/react-native-fs to access file system so you can easily store and access the logo that the user want. If the image has some size restrictions you could as well store your image Base64 string in AsyncStorage but this is not recommended.
You can have a kind of theming system by using a global style file that your screens use, the values requested (for example "dark", "light" etc...) can be store in AsyncStorage.
Do you want the user to be able to use his own personal font ? I don't think this is possible. If you want to have multiple fonts and the user can choose which font will be used in a list for example you can follow this tutorial to install custom fonts : https://medium.com/#kswanie21/custom-fonts-in-react-native-tutorial-for-ios-android-76ceeaa0eb78. Then all you want to do is use your theming system to select the fontFamily that your text elements will be using !
Let me know if I'm not clear enough or you need advices, I recently did what you try to achieve :)

How to use custom fonts in React for Web Apps (without additional CSS file)?

How can I use custom fonts with React for Web Apps? I do not want to use a CSS file but keep everything in the Component JS file.
I have tried everything and nothing seams to work or at least they are not consistent (sometimes they work sometimes they do not load on ipads or certain computers)?
If anyone can point me in the right direction that would be great.
I have tried doing something like this and it worked for me
Add a CDN for fonts if you are using google fonts or something like:
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i" rel="stylesheet">
and then in your CSS use the font-family property and there enter the font you are trying to access from google fonts and it will be working fine. If you want to change the thickness then use the font-weight to manage that.

Adding layout templates to WebSphere Portal theme ear

Question: How do I refer to my layout files form the changeLayout.json and layout.json files if the layout-template files are held in a theme ear/ear?
Background:
I'm developing a custom theme with custom layouts in Portal v8. I'm using the ear method for the theme deployment,s o I've got everything segregated into MyThemeDynamic.war and MyThemeStatic.war I've added my layout files to MyThemeStatic.war/themes/MyTheme/layout-templates
When I set the default layout template in the XMLAccess import, I can successfully see my custom layout.
But If I try to change the layout, it reverts back to the Portal 8.0 theme defaults.
I've tried several ways of referring to my layout files from layout.json.
I saw this: http://tinyurl.com/ch2nczp
but it prevents the default theme from working properly, and I want to keep both the default and this new custom theme.
I've also tried adding references to the xml access, as suggested here: https://www.ibm.com/developerworks/forums/thread.jspa?messageID=14909102&#14909102
I feel like I'm close, but I'm missing something.
I combined static and dynamic theme assets into a single war file following these instructions:
http://www-10.lotus.com/ldd/portalwiki.nsf/dx/Create_a_custom_theme_without_WebDAV_with_8.0
That was ultimately what worked.

Resources