Skip to content

Instantly share code, notes, and snippets.

@rpCal
Created May 7, 2020 10:47
Show Gist options
  • Save rpCal/c7dc9b873905c16ab42c5fa4391b3647 to your computer and use it in GitHub Desktop.
Save rpCal/c7dc9b873905c16ab42c5fa4391b3647 to your computer and use it in GitHub Desktop.
client bo-meeting embed styles
<script src="https://client.bo.timecutcloud.com/bo-meeting/load.js"></script>
<div id="bo-meeting-root" data-hash="YToxOntzOjc6InNpdGVfaWQiO3M6NToiMTAyMjkiO30"></div>
<style>
.bo-meeting-root-vars.bo-meeting-root-vars-container *{
--bo-meeting--color-primary: #43a75e;
}
</style>
@rpCal
Copy link
Author

rpCal commented May 7, 2020

LIST OF CSS VARIABLES TO UPDATE:

.bo-meeting-root-vars * {
  --bo-meeting--font-primary: "Roboto", sans-serif;
  --bo-meeting--color-primary: #e29663;
  --bo-meeting--color-gray: #707070;
  --bo-meeting--color-light-gray: #efefef;
  --bo-meeting--color-clear-gray: #d4d4d4;
  --bo-meeting--color-input-gray: #dcdcdc;
  --bo-meeting--color-black: #000;
  --bo-meeting--color-white: #fff;
  --bo-meeting--color-danger: #e41413;

  --bo-meeting--link-color: var(--bo-meeting--color-primary);
  --bo-meeting--text-color: var(--bo-meeting--color-gray);

  --bo-meeting--header-color: var(--bo-meeting--color-black);
  --bo-meeting--header-font: var(----bo-meeting--font-primary);

  --bo-meeting--pagination-disabled: var(--bo-meeting--color-light-gray);
  --bo-meeting--pagination-active: var(--bo-meeting--color-primary);

  --bo-meeting--btn-close-color: var(--bo-meeting--color-black);

  --bo-meeting--btn-font: var(--bo-meeting--font-primary);
  --bo-meeting--btn-background: var(--bo-meeting--color-white);
  --bo-meeting--btn-color: var(--bo-meeting--color-primary);
  --bo-meeting--btn-border: 1px solid var(--bo-meeting--color-primary);
  --bo-meeting--btn-border-radius: 20px;

  --bo-meeting--btn-hover-background: var(--bo-meeting--color-primary);
  --bo-meeting--btn-hover-color: var(--bo-meeting--color-white);
  --bo-meeting--btn-hover-border: 1px solid var(--bo-meeting--color-primary);
  --bo-meeting--btn-hover-border-radius: var(--bo-meeting--btn-border-radius);

  --bo-meeting--btn-disabled-background: var(--bo-meeting--color-white);
  --bo-meeting--btn-disabled-color: var(--bo-meeting--color-input-gray);
  --bo-meeting--btn-disabled-border: 1px solid
    var(--bo-meeting--color-input-gray);
  --bo-meeting--btn-disabled-border-radius: var(
    --bo-meeting--btn-border-radius
  );

  --bo-meeting--btn-disabled-hover-background: var(
    --bo-meeting--color-light-gray
  );
  --bo-meeting--btn-disabled-hover-color: var(--bo-meeting--color-white);
  --bo-meeting--btn-disabled-hover-border: 1px solid
    var(--bo-meeting--color-light-gray);
  --bo-meeting--btn-disabled-hover-border-radius: var(
    --bo-meeting--btn-border-radius
  );

  --bo-meeting--btn-inverted-font: var(--bo-meeting--font-primary);
  --bo-meeting--btn-inverted-background: var(--bo-meeting--color-primary);
  --bo-meeting--btn-inverted-color: var(--bo-meeting--color-white);
  --bo-meeting--btn-inverted-border: 1px solid var(--bo-meeting--color-primary);
  --bo-meeting--btn-inverted-border-radius: 20px;

  --bo-meeting--modal-size-width: 488px;
  --bo-meeting--modal-size-height: 488px;
  --bo-meeting--transition: background 0.4s, color 0.4s, border 0.4s;
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment