Latest Contributions by KlaraSchmitt

@GeneH_Chesco  You can add fonts to the Hub site theme by going to the site editor, then selecting theme, and then scrolling down past the list of colors where we have two fields for setting base font and heading font. Select the gear icon and this will launch a model where you can add your Google fonts.   ... View more

Hello @MathieuVillemont, You can use select any of the calcite components, including the calcite icons, in Hub via our Text Card. You just have to switch to Edit in HTML first and then you can paste in the component code. Edit 02/26/24: It turns out I was incorrect when I stated that any of the calcite components could be used. For a list of supported components see: https://doc.arcgis.com/en/hub/sites/add-text-and-images.htm#ESRI_SECTION1_3E6FBF82D17C476D9A7AA6F432E38CAA in Hub documentation or https://enterprise.arcgis.com/en/sites/latest/sites/add-text-and-images.htm#ESRI_SECTION1_3E6FBF82D17C476D9A7AA6F432E38CAA in Enterprise Sites documentation. ... View more

Hello, We've been looking into this and while initially I could reproduce on an Android tablet, my version of Chrome was two years out-of-date and updating to the latest version fixed it. If you are still having this issue, could you please let us know the model and screen resolution of the tablet you are using as well as the version numbers for Safari and Chrome? ... View more

If you're doing this in the Header CSS box then you don't need the <style></style> tags I reference above. If you're doing this in a Text Card on the site or page that displays below the header then you can put <style></style> tags in the HTML box, which signals to the browser that you're using embedded CSS. You'd then put your CSS rules between those style tags. ... View more

You should be able to use #navbar {position:fixed; top: 25px;} within your <style></style> to achieve a sticky effect. While there is a Boostrap class that does this, I would be wary of using it as people who've tried it in our application have found it often ends up affecting their ability to edit anything inside the layout editor because we also use the same class to position our edit navbar and there's a bit of conflict between the two. The top property is adjustable. I simply chose that number because it leaves space for the global navbar (22px) if you have that enabled. ... View more

That is not an ArcGIS Hub Site. It's a WordPress site. It simply has the word 'hub' in its name. Based on their code, it looks like they are using an auto-play video embed, which as I have previously explained, we do not support. If you wish to see how a site is operating or want to compare it to your own, you can right-click the webpage and then select Inspect to open up the source code for HTML and CSS. ... View more

If you have a row set to layout: box, the max width of the row is 1170px with 15px of padding on either side. If you are using layout: wide, then the max width of the row will be the width of the viewport (browser) minus 15px of padding on either side. But the grid is responsive, so if you adjust your viewport, then the grid will resize, which will shrink the row width and possibly the application width depending on how you have your application configured. If you have used HTML to force a 400px width on the application card, then you may see no changes. If you are using an application card with a spacer card, then the application card may grow smaller to maintain an ~50% layout. If you are using an application card and the spacer card is hidden on mobile, then the application card will expand to fill the full-width of the row and will be the size of the viewport. ... View more

I would recommend using media queries to target the different viewport sizes straight from within the style tags in your HTML code. The structure would be something like: #navbar { /* general CSS rules here */  @media (max-width: 560px) {   /* mobile breakpoint - add CSS overrides */  }  @media (max-width: 768px) {   /* tablet breakpoint - add CSS overrides */ } } You have two ways of writing media queries. I'm using max-width, which means I have the desktop viewport CSS set first and then overrides for mobile and tablet. You can also use min-width if you are starting from a mobile first general CSS bucket. ... View more

No. If you have it autoplay, it's longer than 5 seconds. Gifs also technically require play / pause / hide controls when autoplaying or lasting longer than 5 seconds, which is why you don't see them frequency used in Hub either. ... View more

We do not support moving backgrounds in Hub as it goes against WCAG (Web Content Accessibility Guidelines). All moving content that lasts longer than five seconds requires controls to pause, stop, or hide the content and we do not have those types of controls for background images. https://www.w3.org/TR/UNDERSTANDING-WCAG20/time-limits-pause.html In addition, automatically moving content can be detrimental for those with vestibular disorders, which is why we don't even support auto-playing videos embedded through our video card. ... View more

You could take a look at this site and try to duplicate their floating button: https://alohachallenge.hawaii.gov/ ... View more

We only rely on it for advanced DIY functionality. You can build a Hub site without code. This is an improvement from when I first started and you had to use markdown to build your whole site layout. Many of the features that used to require code in the early days of our site builder are now represented by actual layout cards and can be filled out through form fields. People do make some really nice sites using HTML & CSS, but that could be done with or without Hub. It is more related to their knowledge of HTML & CSS. I don't know off the top of my head if ESRI offers that type of training, but there are a lot of free resources on the web for learning the basics of HTML & CSS. I like https://css-tricks.com/guides/  If you look for the csstricks tag on some of my posts, I've published several posts with code snippets for some types of stylized cards and if you want basic components like buttons, we're starting to transition to the Calcite framework. (My one caveat about using these is that they are something called web components, which won't mean much to you at the moment. But in a nutshell, web components are easy to get up-and-running because they have a bunch of built in configurations, but they are very hard to style visually because they don't support CSS overwrites.) While we do use Bootstrap for our grid, it isn't really necessary to know, because the drag and drop editor can be used with grids and cards to automatically handle reflow. If you want a more thorough explanation of how the grid works, I give an overview of it in this post: https://community.esri.com/t5/arcgis-hub-questions/how-to-get-all-cards-in-a-text-box-to-dynamically/m-p/1169903/highlight/true#M5223 with a link to the Bootstrap documentation. You will not be able to do javascript within our application, because while our app is built using lot of javascript, embedding third party javascript is a security risk, so we don't allow it. ... View more