openaire-library/connect/community/CustomizationOptions.ts

export class CustomizationOptions {
  mainColor: string;
  secondaryColor: string;
  backgrounds:{
    panels: {
      onDarkBackground: boolean,
      background: {
        color: string; //background
        borderStyle: string;
        borderColor: string;
        borderWidth: number;
      }
    }
    homeBanner:{
      onDarkBackground: boolean,
      background: {
        color: string; //background
        borderStyle: string;
        borderColor: string;
        borderWidth: number;
      }
    }
    lightPageBackground:{
      background: {
        color: string; //background
        borderStyle: string;
        borderColor: string;
        borderWidth: number;
      }
    }

  };
  panel: {
    onDarkBackground: boolean,
    background: {
      color: string; //background
      borderStyle: string;
      borderColor: string;
      borderWidth: number;
    }
    , fonts: {
      color: string;
      family: string;
      size: number;
      weight: number;
    },
    title: {
      color: string;
      family: string;
      size: number;
      weight: number;
    },
/*    panelElements: {
      backgroundColor: string;
      borderColor: string;
      color: string;
    }*/
  };

 /* box: {
    borderColor: string;
    borderStyle: string;
    borderWidth: number;
    borderRadius: number;
  }
  ;*/
  links: {
    darkBackground: {
      family: string;
      size: number;
      weight: number;
      color: string;

      onHover: {
        color: string;
      };
    };
    lightBackground: {
      color: string;
      onHover: {
        color: string;
      };
    };
  };
  buttons: {
    darkBackground: {
      backgroundColor: string;
      color: string;
      borderStyle: string;
      borderColor: string;
      borderWidth: number;
      borderRadius: number;
      onHover: {
        backgroundColor: string;
        color: string;
        borderColor: string;
      };
    };
    lightBackground: {
      backgroundColor: string;
      color: string;
      borderStyle: string;
      borderColor: string;
      borderWidth: number;
      borderRadius: number;
      onHover: {
        backgroundColor: string;
        color: string;
        borderColor: string;
      };
    };
  };


  constructor() {

    this.mainColor = '#4687E6';
    this.secondaryColor = '#2D72D6';
    this.panel = {
      onDarkBackground: true,
      background: {
        color: '#4687E6',
        borderStyle: 'solid',
        borderColor: "#4687E6",
        borderWidth: 0
      }, fonts: {
        color: '#ffffff',
        family: 'Open Sans',
        size: 14,
        weight: 400
      },
      title: {
        color: '#ffffff',
        family: 'Open Sans',
        size: 18,
        weight: 700
      },

    /*  panelElements: {
        backgroundColor: 'rgba(255, 255, 255, 0.5)',
        borderColor: 'rgba(255, 255, 255, 0.5)',
        color: '#ffffff'
      }*/
    };

   /* this.box = {
      borderColor:  '#4C9CD5',
      borderStyle: 'solid',
      borderWidth: 2,
      borderRadius: 6,
    };*/
    this.links = {
      darkBackground: {
        family: 'Open Sans',
        size: 14,
        weight: 400,
        color: 'rgba(255, 255, 255, 0.98)',
        onHover: {
          color: 'rgba(255, 255, 255, 0.5)',
        },
      },
      lightBackground: {
        color: '#4687E6',
        onHover: {
          color: '#2D72D6'
        },
      }
    };

    this.buttons = {
      darkBackground: {
        backgroundColor: "#ffffff",
        color:"#000000",
        borderStyle:"solid",
        borderColor: "#ffffff",
        borderWidth: 1,
        borderRadius: 500,
        onHover: {
          backgroundColor: "#eeeeee",
          color: "#000000",
          borderColor: "#eeeeee",
        }
      },
      lightBackground: {
        backgroundColor: '#4687E6',
        color: '#ffffff',
        borderStyle: "solid",
        borderColor: "#4687E6",
        borderWidth: 1,
        borderRadius: 500,
        onHover: {
          backgroundColor: '#2D72D6',
          color: '#ffffff',
          borderColor: "#2D72D6",
        }
      }

    };
  }

}