1

Fonts, Colors and Borders

Hello,

 

I uploaded an interactive CSS generator database titled "Theme Helper" in the Webinar EN 2021 team. It is very slow to respond online in the browser, but responds instantly as a local database in the Mac app. It responds pretty quickly when I log in to the team with the Mac app. Here are a couple of screenshots...

15 replies

null
    • Ninox partner
    • RoSoft_Steven.1
    • 2 yrs ago
    • Reported - view

    Nice, thanks Sean.

    • Nick
    • 2 yrs ago
    • Reported - view

    Thanks for sharing Sean!

    • Sean
    • 2 yrs ago
    • Reported - view

    Steven and Nick,

     

    You're welcome. I'd love to know why they decided to limit the formatting options in the name of "branding". The possibilities are clearly far greater than what they have made available.

    • rogerblewitt
    • 2 yrs ago
    • Reported - view

    Sean, this looks great. Do you know how I can get access to the Webinar EN 2021 team (I only have access to the Ninox Beta Team at the moment)? Failing that, is there any way to get a complete a list as possible of the class names for the fields?

    • Sean
    • 2 yrs ago
    • Reported - view

    Hi Roger, thank you. You can send an email to support to request access to the Webinar EN 2021 team and I recommend you request access to the Webinar DE 2021 team because it has the most up-to-date version of the 0001_Ninox-Reference database.

     

    If you get access to the team, you can see all the class names I've gathered in the ClassesDMC table; otherwise, you can use "Show Page Source" in your browser to view the class names.

     

    For anyone that downloads the database, there could be a performance issue in the Mac app because I put "do as server" in the following fields...

    CSS - All

    CSS - Nav-App UI

    CSS - Nav-Form & Labels

    CSS - Input

    CSS - Boolean

    CSS - Choice

    CSS - MC

    CSS - RV

    CSS - Formula

    • Sean
    • 2 yrs ago
    • Reported - view

    Just delete "do as server" if you are using the database in the Mac app.

    • Nick_Massie
    • 2 yrs ago
    • Reported - view

    I have also used this and also have started hiding all the tabs and files for a cleaner UI.  this is possible because of this database  Thanks Sean!!! 

    • Nick_Massie
    • 2 yrs ago
    • Reported - view

    Screen Shot 2021-10-24 at 11.50.39 AM

    • Sean
    • 2 yrs ago
    • Reported - view

    Nick, you're welcome. Thanks for commenting 

    • Sean
    • 1 yr ago
    • Reported - view

    I've uploaded another copy of this database and named it Theme Helper Reload because someone trashed the original. I guess this is why we can't have nice things.

    • Fred
    • 1 yr ago
    • Reported - view

    Can you upload it here? It won't get deleted by anyone. :)

      • Sean
      • 1 yr ago
      • Reported - view

      Fred Good point! I don't think Ninox was using the current forum when I first uploaded the database. This database is unlocked so if anyone wants to make modifications they can.

    • Fred
    • 1 yr ago
    • Reported - view

    Oops, didn't notice the date of the post. Thanks.

    • Ninox developper
    • Jacques_TUR
    • 1 yr ago
    • Reported - view

    Thank you sean for reporting this great customization tool. However, I noticed that the theme only works on the page where the html is. It's normal, because the <style> tag doesn't have a scope on the whole page. 

    So I found a code that allows to modify the styles of the page. So when a style initializes, it stays modified until the database is closed. It's a code in french that I found here : https://www.zonecss.fr/cours-css-javascript/acceder-aux-css-en-javascript.html

      function modifier(sChemin, sPropriete, sVal){
      var bFind = false,
          aStyleSheets = document.styleSheets,
          exp_reg =  new RegExp(sChemin,"gi");
      //console.log(aStyleSheets);
      // si la css est externe et d'un autre nom de domaine
      // cssRules: lève une DOMException: "The operation is insecure."
      // code: 18
      // message: "The operation is insecure."
      // name: "SecurityError"
      //
      for(var i = 0; i < aStyleSheets.length; ++i){
        try{
          var aCssRules =  aStyleSheets[i].cssRules;
          for(var j = 0; j < aCssRules.length; ++j){
            console.log(aCssRules[j].selectorText);
            if(exp_reg.test(aCssRules[j].selectorText)){
              aCssRules[j].style[sPropriete] = sVal;
              console.log("Trouvé", aCssRules[j].style[sPropriete]);
              bFind = true;
            }//if
          }//for
        }catch(error) {
          //cssRules: lève une DOMException: "The operation is insecure."
          //console.log(error);
          continue
        }
      }
      return bFind;
    }
    
    // expemple to modify selected tab color :
    modifier('.tab.selected', 'color', 'red');
    

    I added a CSS boy of page formula that modifies the style sheet of the web page (see the attached application)

      • Sean
      • 1 yr ago
      • Reported - view

      Jacques TUR Thank you for the code. I looked for something that would prevent the need to have the CSS style information in a Formula field for every Tab and Table that users wanted to format a year ago when I posted this and didn't find anything that would work. I got feedback from 4 users at that time (the most recent being 10 months ago) and no questions or feature requests so I lost interest. I think a partial explanation can be attributed to something blackie said, "Whatever you post just gets lost in the sauce."

       

      There are some problems with the way the code you provided is implemented. The whole point of the database is to generate CSS style information found on the CSS Formula Tab that can be copy and pasted into a Formula field. I think that's where the JavaScript needs to go.

       

      You can see from the screenshot you posted that some of styling effects aren't the same as those from the original database...

      I'm sure that with enough effort it can be worked out, but I don't think I'm the one to do it. I was pursuing JavaScript up to about 8 months ago, but I read about Dart / Flutter and I have been focusing my limited free time on it.

       

      You can see from the screenshot above that Ninox has changed the class names for the Reference field table view. It used to look like this...

      I'm going to update the database to include the new classes when I can.

       

      Sand dan Glokta: "Why do I do this?"

Content aside

  • 1 Likes
  • 1 yr agoLast active
  • 15Replies
  • 1247Views
  • 3 Following