SeedCode Support Forum

Me again

This page gives a lot of information but, I need more
https://www.seedcode.com/pmwiki/index.p ... eMaker.CSS

I was wondering, how to get rid of this in CSS ? Or script, this is no use for us.


I use the Live web demo to get some of the class name, but I can't see to get this sidebar menu section out of the way.
Since I remove the Horizon access for it in the open script, I should assume that the options for it should be gone too. (forget about the calendar icon, I found the class name for it )


Events side by side with similar color are hard to distinct one another. Background color is done in the CSS, I have tried the border-style command but it only works on the top and left sides of the event


Could you explain a little more how to use the CSS on (not-)mobile-device with examples ? Because the CSS is loading the sidebar menu like I wanted on FMP desktop, but on mobile I see the full items. I hide the sources and status, but they display on FMGo ?? I also set the default view when I switch to the calendar to be the week view... it display once, but after I don't get that option to see it again (day view also) in the FMGo menu. I can only select Horizon, Month and Ressources (that doesn't get the custom name that I set in the config)

Thanks

Hi jffortier,

Great questions. I'll dive in and get back to you with details on the CSS for these items.

Regards,

KC

Hi Jean-Francois,

The important thing to remember here is that sometimes your custom CSS will need the "!important" tag to override the default settings in the calendar. This is why the border settings were not overriding the whole border. Here's some CSS to add to your settings to accomplish what you're looking for (modify the border color and style as desired):

/* Hide Analytics Button */
.measure-button-container {
display: none !important;
}

/* Set event block border */
.fc-event {
border: 1px solid rgba(0,0,0,1) !important;
}

/* Hide Horizon Parameters */

.settings-container .form-horizontal .dbk_contentDivider:nth-child(6) {
display: none;
}
.settings-container .form-horizontal .pad:nth-child(7) {
display: none !important;
}


The .mobile-device and .not-mobile-device settings allow you to add that to the beginning of your class selector to apply your settings only to the mobile or non-mobile views.

If you've hidden the Week and Day view options from your menu in the "Load Calendar Settings - On Startup..." script, then you won't have buttons to navigate to them, but you can still go to those views through scripts (such as your Upon Opening script).

If you'd like to change the names for anything in the calendar, the best way to do this would be to use the translation settings, rather than CSS. More on this can be found here: https://www.seedcode.com/pmwiki/index.p ... ranslation

Let me know if that helps!

KC

Thanks

And the last part of the email, why do the FMGo version is not applying all the view for the calendar ? And why do the sidebar menu display filters and calendar when I removed them from the menu and they don't show up on the desktop version.

Hi Jean-Francois,

Some of the HTML Elements in the mobile version of DayBack might have different selectors. What is the specific CSS code you're adding that is not applying in the mobile view?

As far as the menu goes, the mobile menu is completely different than the desktop menu, so the different objects in there will need to be hidden separately in your CSS. I'd be happy to help you find the selectors to hide those sections if you can let me know which ones you'd like to hide.

Regards,

KC

haaaaa that explains it all!

So the changes made in the script to set the calendar views that I want is not transpose in FMGo.

No, I didn't made any changes in the CSS for mobile to view or not the calendar view (week, month, horizon...)

On desktop I Admin user see all views, this is done in script.
On FMGo I DON'T see the day or week view. I will see the week view, as the GoTo Calendar I use in my app set to display the week view, but if I change view, I can't bring it back with the sidebar.

I add this in the CSS to remove options in the sidebar menu, but it only work on the desktop version. I still see the filter and sources in FMGo.

.dbk_sidebar .filters, .dbk_sidebar .calendars {
display: none !important;
}
.tabButtonContainer button.settings {
width: 160px;
}
.tabButtonContainer button.mini-calendars {
width: 160px;
}

At the bottom of FMGo sidemenu, I see a section "Contact us and docs"... I don't see that in the desktop. But I have removed all the "?" with this code:
button.btn.btn-link.btn-help {
display: none;
}



So I understand that the sidebar menu on FMGo is not at all affected by any setup done on the CSS for desktop using the same code to hide items.

For the name change, I don't understand. I know about the translation CSS file, I use it, as the original french translation is not the best as for understanding.

There's a place that I replaced the "resource" with the name I want to use and it work on the desktop version, but not in FMGo, I still see "resoures view" not the text I choose. If I tap on the "n Resources >" the menu that open show the translation work I choose.

One think I have notice, some of the translation are not available to edit inside dbk-translation.js file... I spyed in the web-calendar.js and some of the translation are inside that file, and not in the one we can edit !! Like the choice "Month: Fit to screen" that is only on FMGo, I added in the custom translation file and now I fixed the grammatical error.

If you want, I will take some screen capture from the desktop vs mobile to show what's missing/showing that was removed from either CSS or config script.

You must find me annoying with all my little picky issues! That's the fun of doing business with a french-Canadian speaking customer !!

Hi Jean-Francois,

The mobile version of DayBack doesn't currently have the week view. Originally we decided that view wasn't as useful on mobile but we have reconsidered so we will be adding that to the sidebar selection along with the other views. This will be done in a future update that should be coming soon.

Since there are no tab buttons in the sidebar on mobile, hiding the different sections is a bit different than the desktop version. To hide the list of calendars on mobile this is the css:

.sidebar-calendars {
display: none;
}

Hiding filters would be:

.sidebar-filters {
display: none;
}

and hiding settings would be (this will also hide the "Contact Us & Docs" section):

.sidebar-settings {
display: none;
}

"Resource View" would be a different translation than "Resource". So you will need to locate the "Resource View" translation and translate that separately.

There shouldn't be any differences in the available translations but there are some terms used in the mobile version that are not in the desktop version so you may need to translate those specifically.

Hope that helps!

Thanks Tanner,

I will check for that update, I haven't check the FMGo look on an iPad, only my iPhone8+, week view is pretty limited, but give us a good view of the work ahead.

As for the translation, I understand that the sidebar menu translation may be different. My point was (sorry sometime I think in french and the translation may sound different!) a lot of items in the calendar FMGo version are not available to translate in the .js file. It's not that I need to do multiple translation inside that file for the same or similar wording, it's not just there to translate.

Jean-Francois,
Sorry I may have misunderstood your issue with translations a little bit. If you have updated your copy of DayBack it will most likely have an older translation file it is using. We don't automatically replace the translations to prevent overwriting custom translations or edited translations.

So if you have been running DayBack for a bit it is very possible that we have added a few new translated terms that wouldn't show in your translation file. Looking at a stock copy of DayBack is a great way to get those new terms added if you notice anything not translated. We don't add translation terms often so there shouldn't be too many not added to your file.

Hope that helps!

Good,

But this .js file could be updated the same way you update the CSS file ? it's just text, no ?

Only adding the new text to translate at the bottom (in the english original section only) in between
/* Updated as 10.44 */
/* end update 10.44 */

You do it with the CSS and updating doesn't modify all the custom CCS we do, right ? I hope so, because I add/modify a lot of it !!

I started implement DayBack at 10.41? 10.42?

How do we know what was added? it will be added up at the end ? or it will be inserted everywhere ?

I steel some of the things I wanted from the web-calendar.js and copy it in my own translation .js file.

Thanks,

Hi Jean-Francois,

When we release updates to DayBack, we don't automatically update the CSS file or the custom translation files, as we expect that customers will be making changes to them. Instead, we include the steps to make only the specific changes (additions/removals) in each of the files in the Version History.

The only files we overwrite automatically when updating are the core web-calendar.js and other core files, not your custom CSS or Translation files.

Since you're modifying the French section of the translation file, if you see a word that can be translated in the English section, just copy that to the French section and translate it as desired. Keep in mind that there are both a "Resource" and "Resources" translation, so you might just need to add the "Resources" one to the French section in your file, similar to outlined in the docs here: https://www.seedcode.com/pmwiki/index.p ... eLanguages

Regards,

KC