Forum Discussion

IvanWeiss's avatar
IvanWeiss
Qrew Captain
6 years ago

Making a button header look better

I have a complex project form and there are buttons all over.  What I realized is navigation was really choppy so I am creating a Quick Action section at the top.  However, as you can see from this screenshot, because it is in a section header the buttons are aligning which is great but they are stretching the button size and creating bay boxes.    Plus, ideally, i would want them horizontally centered.

I am going to have two rows of buttons, and I dont need them all lined up each other.  But I do want the width of each button to match, ideally.

Any ideas on how to fix this and/or just in general make this look better on a form?
  • Try using a formula rich text field and placing your buttons in an HTML table. I did this with icons and formula text fields to create a rich visual for ergonomics:


    I started out by making smaller combination fields; example [L Wrist_combo]:

    "<div align=\"center\" >"
    
    &
    
    List("<br>",
    "L Wrist",
    "Risk = " & ToText([L Wrist Total]),
    [L Wrist Risk Icon],
    [L Wrist Risk Rating])​

    Then combined the smaller combos; example [Visualization_combo]:

    "<table style=width:100%>
      <tr>
        <td style=width:100% colspan=7 align=center> "&[Overall_combo]&" </td>
      </tr>
      <tr style=width:100% align=center>
        <td "&[L Wrist_combo]&" </td>
        <td "&[L Elbow_combo]&" </td>
        <td "&[L Shoulder_combo]&" </td>
        <td "&[Neck_combo]&" </td>
        <td "&[R Shoulder_combo]&" </td>
        <td "&[R Elbow_combo]&" </td>
        <td "&[R Wrist_combo]&" </td>
      </tr>
      <tr>
        <td style=width:100% colspan=7 align=center><img src = https://XXXX.quickbase.com/up/XXXX/g/rb/eg/va/5%20Joints.jpg height=200;></td>
      </tr>
      <tr>
        <td style=width:100% colspan=7 align=center> "&[Back_combo]&"</td>
      </tr>
    </table>"​


    You can do this with buttons that are formula rich text buttons; I was not able to get this to work with formula URL buttons.

    Example:


    "<table style=width:100%>
      <tr>
        <td style=width:100% colspan=3 align=center> "&[save]&" </td>
      </tr>
      <tr style=width:100% align=center>
        <td "&[change]&" </td>
        <td "&[change2]&" </td>
      </tr>
    </table>"​


    ------------------------------
    Adam Keever
    ------------------------------