npm - benivo-ui-library - Versions diffs - 1.2.5 - Mend

benivo-ui-library 1.2.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (26) hide show

package/variables.less ADDED Viewed

@@ -0,0 +1,469 @@
+// Variables
+// All variables
+//
+//local variables
+@gpresourceUrl: "https://gpresource.blob.core.windows.net";
+// Breakpoints
+@xl: ~"only screen and (min-width : 1200px)";
+@lg: ~"only screen and (min-width : 992px)";
+@md: ~"only screen and (min-width : 768px)";
+@sm: ~"only screen and (min-width : 576px)";
+@xs: ~"only screen and (max-width : 575px)";
+@xl-max: ~"only screen and (max-width : 1199px)";
+@lg-max: ~"only screen and (max-width : 991px)";
+@md-max: ~"only screen and (max-width : 767px)";
+//Containers
+@container-max-width: 1164px;
+@gatter: 12px;
+//Content
+@content-max-width: 710px;
+// Color system
+//
+@white: #fff;
+@black: #000;
+@yellow: #ffbd1e;
+@green: #2a966a;
+@text-color: #4f5a65;
+@primary-color: #2a966a;
+@secondary-color: #1692ff;
+@si-color: #eb3426;
+@error-color: #ef5350;
+@danger-color: #a94442;
+@danger-background-color: #f2dede;
+@danger-border-color: #ebccd1;
+@success-color: #155724;
+@success-background-color: #d4edda;
+@success-border-color: #c3e6cb;
+@notification-color: #ef5350;
+@light-gray-bg: #f9fafb;
+@light-gray-border: #ced0da;
+@light-gray-text: #979797;
+@bold-gray: #333333;
+//Icons
+//
+@chat-icon-img: url('@{gpresourceUrl}/assets/img/icons/integrations-freshchat%403x.jpg');
+@si-icon-img: url('@{gpresourceUrl}/assets/img/icons/si-icon.svg');
+@si-icon-img-white: url('@{gpresourceUrl}/assets/img/icons/si-icon-white.svg');
+@google-icon: url('@{gpresourceUrl}/assets/img/icons/google-icon.png');
+@lock-icon: url('@{gpresourceUrl}/assets/img/icons/lock-icon.svg');
+// Spacing
+@spacer: 1rem;
+// Borders
+@borders: solid 1px #d5dce3;
+@border-radius: 4px;
+// Box shadow
+@box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.05);
+// Body
+//
+// Settings for the `<body>` element.
+@body-bg: @white;
+@body-color: @text-color;
+// Links
+//
+// Style anchor elements.
+@link-color: @secondary-color;
+@link-decoration: none;
+@link-hover-color: @link-color;
+@link-hover-decoration: underline;
+@link-transition: all 0.2s ease-out;
+@link-style: normal;
+@link-weight: @font-weight-normal;
+// Fonts
+//
+// Font, line-height, and color for body text, headings, and more.
+// stylelint-disable value-keyword-case
+@font-family: proxima-nova, sans-serif;
+// stylelint-enable value-keyword-case
+@font-size: 1rem; // Assumes the browser default, typically `16px`
+@font-size-extra-lg: (@font-size * 1.625); //26px
+@font-size-lg: (@font-size * 1.25);
+@font-size-sm: (@font-size * .875); //14px
+@lg-font-size: @font-size * 1.375; //22px
+@small-font-size: .875rem; //14px
+@extra-small-font-size: .75rem; //12px
+@extra-small-line-height: 1.5;
+@font-weight-light: 300;
+@font-weight-normal: 400;
+@font-weight-medium: 500;
+@font-weight-semibold: 600;
+@font-weight-bold: 700;
+@font-weight: @font-weight-normal;
+@line-height: 1.4;
+@letter-spacing: 1;
+// Headdings
+@headings-margin-top: (@spacer * 1.25);
+@headings-margin-bottom: (@spacer * 1.375);
+@headings-font-family: inherit;
+@headings-font-weight: @font-weight-semibold;
+@headings-line-height: 1.4;
+@headings-color: inherit;
+@heading-text-transform: none;
+@h1-font-size: @font-size * 2.25; // 36px
+@h1-font-family: @headings-font-family;
+@h1-font-weight: @headings-font-weight;
+@h1-line-height: @headings-line-height;
+@h1-text-transform: @heading-text-transform;
+@h1-color: @headings-color;
+@h2-font-size: @font-size * 1.625; //26px
+@h2-font-family: @headings-font-family;
+@h2-font-weight: @headings-font-weight;
+@h2-line-height: @headings-line-height;
+@h2-text-transform: @heading-text-transform;
+@h2-color: @headings-color;
+@h3-font-size: @font-size * 1.375; //22px
+@h3-font-family: @headings-font-family;
+@h3-font-weight: @headings-font-weight;
+@h3-line-height: @headings-line-height;
+@h3-text-transform: @heading-text-transform;
+@h3-color: @headings-color;
+@h4-font-size: @font-size * 1.25; //20px
+@h5-font-size: @font-size * 1.125; //18px
+@h6-font-size: @font-size; //16px
+@h6-font-family: @headings-font-family;
+@h6-font-weight: @headings-font-weight;
+@h6-line-height: @headings-line-height;
+@h6-text-transform: @heading-text-transform;
+@h6-color: @headings-color;
+// Blockquots
+@blockquote-quots-color: #c6c8c9;
+@blockquote-small-color: @text-color;
+@blockquote-font-size: (@font-size * 1.25);
+@blockquote-border: 0;
+@blockquote-color: @text-color;
+@blockquote-font-size: @font-size * 1.2;
+@blockquot-font-weight: @font-weight-light;
+@blockquote-margin: 0 0 @spacer * 1.5;
+@blockquote-padding-top: @spacer * 2;
+@blockquote-padding-bottom: @spacer * 2.5;
+@blockquote-line-height: 1;
+@blockquote-text-transform: none;
+@blockquote-width: 100%;
+@blockquote-text-align: center;
+// Paragraphs
+@mark-padding: .2em;
+@mark-bg: #fcf8e3;
+// Horizontal rule
+@hr-margin-y: @spacer * 2;
+@hr-border-width: .2em;
+@hr-border-color: @text-color;
+// Custom scrollbar
+@custom-scrollbar-track-color: #ced0da;
+@custom-scrollbar-thumb-color: #b1b4c1;
+// List
+@dt-font-weight: @font-weight-bold;
+@list-inline-padding: .5rem;
+// Table
+@tabel-border: 3px solid #f4f7f6;
+@tabel-padding: 12px 10px;
+@tabel-font-size: @small-font-size;
+@tabel-font-weight: @font-weight-normal;
+@table-th-color: @text-color;
+@table-th-font-size: @extra-small-font-size;
+@table-th-text-transform: uppercase;
+@tabel-th-font-weight: @font-weight-bold;
+// Si-icon
+@si-width: 1.5rem;
+@si-height: 1.25rem;
+//
+// Buttons
+//
+@btn-font-family: @font-family;
+@btn-font-weight: @font-weight-normal;
+@btn-font-size: 0.875rem;
+@btn-line-height: 1;
+@btn-letter-spaceing: normal;
+@btn-text-decoration: none;
+@btn-text-style: normal;
+@btn-text-transform: none;
+@btn-brd-radius: .25rem;
+@btn-brd: 1px;
+@btn-brd-color: rgba(0, 0, 0, 0.12);
+@btn-border: @btn-brd solid @btn-brd-color;
+@btn-transition: all 0.2s ease-out;
+@btn-mrg-right: @spacer;
+@btn-min-width: 150px;
+// Default Button
+@default-btn-bg-color: @primary-color;
+@default-btn-bg-gradient: none;
+@default-btn-brd-color: @default-btn-bg-color;
+@default-btn-text-color: #ffffff;
+@default-btn-hover-bg-color: @default-btn-bg-color;
+@default-btn-hover-bg-gradient: none;
+@default-btn-hover-brd-color: @default-btn-hover-bg-color;
+@default-btn-hover-text-color: @default-btn-text-color;
+// Secondary Button
+@secondary-btn-bg: #ffffff;
+@secondary-btn-bg-gradient: none;
+@secondary-btn-brd-color: @default-btn-bg-color;
+@secondary-btn-text-color: @text-color;
+@secondary-btn-hover-bg: @default-btn-bg-color;
+@secondary-btn-hover-bg-gradient: none;
+@secondary-btn-hover-brd-color: @secondary-btn-hover-bg;
+@secondary-btn-hover-text-color: #ffffff;
+// Button sizes
+@btn-padding: .75rem 2.1rem;
+@btn-xs-padding: .25rem 2.1rem;
+@btn-sm-padding: .438rem 2.1rem;
+@btn-md-padding: .75rem 2.1rem;
+@btn-lg-padding: .938rem 2.1rem;
+@btn-xl-padding: .1rem 2.1rem;
+//
+// Forms
+//
+//form label
+@form-label-font-size: .875rem;
+@form-label-font-wight: @font-weight-semibold;
+//Form fields
+@form-border-color: rgba(0, 0, 0, 0.15);
+@form-border-radius: @border-radius;
+@form-box-shadow: none;
+@form-txt-color: inherit;
+@form-line-height: 1.4;
+@form-font-family: inherit;
+@form-font-size: 1rem;
+@form-font-weight: @font-weight-normal;
+@form-placeholder-color: #ced0da;
+//Form select
+@form-select-option-bg: @white;
+@form-select-option-bg-hover: rgba(0, 0, 0, 0.1);
+@form-select-scrl-tick: rgba(206, 208, 218, 0.3);
+@form-select-scrl-thumb: #b1b4c1;
+// Form radiobutton and checkbpx
+@form-checkbox-brd: 1px solid @form-border-color;
+@form-checkbox-active-color: @primary-color;
+//
+// Datepicker
+//
+@calendarBg: #ffffff;
+@calendarBorder: solid 1px #dfe3e9;
+@calendarBoxShadow: 0 1px 4px 0 rgba(0, 0, 0, 0.08);
+@calendarColor: @text-color;
+@calendarFont: @font-family;
+@calendarFontWeight: @font-weight-normal;
+@calendarFontSize: .85rem; // 14px
+@calendarHeaderBg: @calendarBg;
+@calendarHeaderColor: @calendarColor;
+@calendarHeaderFontSize: @calendarFontSize;
+@calendarWeekDaysBorder: 1px solid rgba(223, 227, 233, 0.5);
+@calendarWeekDaysFontSize: 10px;
+@calendarDayBorder: 1px solid transparent;
+@calendarDayBrdRadius: 50%;
+@calendarActiveDayColor: #ffffff;
+@calendarActiveDayBrd: @primary-color;
+@calendarActiveDayBg: @primary-color;
+@calendarHoverDayColor: @primary-color;
+@calendarHoverDayBg: #ffffff;
+@calendarHoverDayBrd: @primary-color;
+@calendarDayFontWeight: @font-weight-bold;
+@calendarActiveIcon: @calendarActiveDayBg;
+@calendarIconColor: @text-color;
+//
+//Header
+//
+@header-bg-color: @white;
+@header-box-shadow: 0 1px 0 rgba(79, 90, 101, 0.1);
+@header-height: 70px;
+@header-bg-gradient: none;
+@header-bg-gradient-str: transparent;
+@header-bg-gradient-end: transparent;
+@header-icon-color: @nav-color;
+//Branding
+@branding-img-url: "";
+@branding-padding-top: 15px;
+@branding-padding-bottom: @branding-padding-top;
+//Navigation
+@nav-color: @text-color;
+@nav-font-weight: @font-weight-normal;
+@nav-font-family: @font-family;
+@nav-font-style: normal;
+@nav-active-color: @nav-color;
+@nav-active-brd-color: @primary-color;
+@nav-text-transform: none;
+@nav-buttons-border: 1px solid @nav-buttons-border-color;
+@nav-buttons-border-color: lighten(@nav-color, 50%);
+//
+// Footer
+//
+@footer-height: 105px;
+@footer-height-mobile: 182px;
+@footer-bg: @white;
+@footer-bg-gradient: none;
+@footer-bg-gradient-str: transparent;
+@footer-bg-gradient-end: transparent;
+@footer-font-size: @small-font-size;
+@footer-line-height: 1.83;
+@footer-text-color: @text-color;
+@footer-copyright-color: lighten(@text-color, 30%);
+//Footer link
+@footer-link-color: @link-color;
+@footer-link-decoration: none;
+@footer-link-hover-color: @footer-link-color;
+@footer-link-hover-decoration: underline;
+//Footer Logo
+@footer-logo-justify-content: center;
+@footer-logo-margin: @spacer @spacer @spacer 0;
+@footer-bnv-logo-powered-by-light: url('@{gpresourceUrl}/assets/img/footer/benivo-powered-logo-white.svg');
+@footer-bnv-logo-powered-by-dark: url('@{gpresourceUrl}/assets/img/footer/benivo-powered-logo-dark.svg');
+@footer-bnv-logo-width: 101px;
+@footer-bnv-logo-height: 40px;
+@footer-is-logo-dark: true; // true or false
+@footer-partner-is-logo-exist: false; // true or false
+@footer-partner-is-logo-dark: false; // true or false
+@footer-partner-logo-image: url('https://flatclubqa.blob.core.windows.net/gopremiumimages/google/plus-relocation-logo.png');
+@footer-partner-logo-width: 140px;
+@footer-partner-logo-height: 28px;
+//
+//Progress Bar
+//
+@progress-transition: all .6s ease;
+@progress-bar-height: 8px;
+@progress-bar-radius: 16px;
+@progress-bar-bg-color: rgba(132,148,165,.2);
+@progress-bar-success-bg: @primary-color;
+@progress-bar-precent-color: @text-color;
+//
+//Star Rate
+//
+@star-icon-size: 16px;
+@star-icon-size-big: 35px;
+@star-empty: url('@{gpresourceUrl}/assets/img/rate/star-empty.svg');
+@star-half: url('@{gpresourceUrl}/assets/img/rate/star-half.svg');
+@star-filled: url('@{gpresourceUrl}/assets/img/rate/star-filled.svg');
+//
+// Sections
+//
+@content-block-borders: @borders;
+@content-block-border-radius: @border-radius;
+@content-block-box-shadow: @box-shadow;
+//
+// Testimonials
+//
+@testimonials-font-family: @font-family;
+@testimonials-font-weight: @font-weight-medium;
+@testimonials-font-style: italic;
+@testimonials-text-align: left;
+@testimonials-quote-display: block; // for signup
+@testimonials-icon-quote-position: center;
+@testimonials-icon-quote-color: inherit;
+@testimonial-color: #ffffff;
+//
+// Banner & Card
+//
+@banner-title-color: @text-color;
+@card-title-color: @banner-title-color;
+/*
+ * PAGES
+ *
+    1. Signup Page
+        1.1 Signup left container
+        1.2 signup left heading
+        1.3 Signup left content
+        1.4 Signup service list
+        1.5 Signup right content
+        1.6 Signup footer
+*/
+//
+// 1. Signup Page
+//
+@signup-bg-color: transparent;
+@signup-img: url('@{gpresourceUrl}/assets/img/default/signup_bg.jpg');
+@signup-img-overlay-gradient: none;
+@signup-img-overlay-gradient-str: transparent;
+@signup-img-overlay-gradient-end: transparent;
+@signup-img-overlay-opacity: 0;
+@signup-img-position: 0;
+@signup-img-repeat: no-repeat;
+@signup-img-size: cover;
+// 1.1 Signup left container
+// 1.2 signup left heading
+@signup-left-heading-color: #ffffff;
+@signup-left-heading-txt-align: center;
+@signup-left-heading-txt-transform: @heading-text-transform;
+@signup-left-heading-second-txt: @font-weight-light;
+@signup-left-heading-second-color: @signup-left-heading-color;
+// 1.3 Signup left content
+@signup-left-content-color: #ffffff;
+@signup-left-content-text-align: left;
+// 1.4 Signup service list
+@signup-service-list-txt-font-weight: @font-weight-normal;
+@signup-service-list-hilighted-txt-color: inherit;
+@signup-service-list-hilighted-font-weight: @font-weight-semibold;
+// 1.5 Signup right
+@signup-right-heading-txt-align: left;
+@signup-right-heading-txt-transform: @heading-text-transform;
+// 1.6 Signup footer
+@signup-footer-is-logo-dark: false; // true or false
+@signup-footer-partner-logo-image: @footer-partner-logo-image;
+@signup-footer-partner-is-logo-dark: @footer-partner-is-logo-dark; // true or false
+@signup-footer-txt-align: left;
+/*
+    2. Onboarding
+        2.1 Calendar
+        2.2 Testimonials
+*/
+@onboarding-title-align: center;
+// 2.1 Calendar
+@calendar-start-brd-color: #dfe3e9;
+@calendar-start-day-bg-color: @text-color;
+@calendar-selected-day-color: #ffffff;
+@calendar-selected-day-bg-color: @primary-color;
+// 2.2 Testimonials
+@ob-testimonial-size: @font-size;
+// market education
+@me-title-align: center;
+@me-text-align: center;
+//
+//Home Page
+//
+@home-bg-color: #f7f9fa;
+@home-content-alignment: center;
+// home banner
+@home-banner-position: center;
+@home-banner-content-alignment: center;
+@home-banner-title-pad-y: 3px;
+@home-banner-title-pad-x: 50px;
+@home-banner-title-border-radius: 20px;
+@home-banner-title-bg: @white;
+@home-banner-title-color: @text-color;
+@home-banner-title-color-mobile: #fff;
+@home-banner-img: url('@{gpresourceUrl}/assets/img/home/top-banner.jpg');
+@home-banner-title-font-size: @h3-font-size;
+@home-banner-title-font-family: @h3-font-family;
+@home-banner-title-font-weight: @h3-font-weight;
+@home-banner-title-font-style: normal;
+@home-banner-title-transform: none;