Kennisbank
Search…
Planning
Taken
Administratie
Integratie in website aanpassen
Wij raden het gebruik van SDK Versie 1 af, deze krijgt op korte termijn geen ondersteuning meer. Voor het integreren van Recranet in een website adviseren we het gebruik van SDK Elements.
Om de layout en de stijl van Recranet goed te integreren met de layout en stijl van de website bieden we de mogelijkheid om de css van de Recranet Online boeken module aan te passen.
Dit is mogelijk via het Recranet dashboard onder 'Instellingen' -> 'Integratie in uw website'. Met de knop 'Optie toevoegen' kan vervolgens een aangepaste optie worden ingevoerd.
De volgende opties zijn beschikbaar:
Optie
Standaard waarde
rn-include-fonts
true
rn-include-fancybox
true
rn-collapse-panels
true
rn-readmore-background
true
rn-margin
15px
rn-margin-large
30px
rn-padding-small
15px
rn-padding
24px
rn-brand-primary
#004A7F
rn-text-color
#666
rn-btn-background-color
#f5f5f5
rn-btn-border-color
transparent
rn-btn-color
#555
rn-btn-primary-background-color
rn-brand-primary
rn-btn-primary-border-color
transparent
rn-btn-primary-color
#fff
rn-search-form-button-background
rn-btn-primary-background-color
rn-quantity-form-minus-background-color
#f5f5f5
rn-quantity-form-minus-border-color
#ddd
rn-quantity-form-minus-color
#777
rn-quantity-form-plus-background-color
#8BC34A
rn-quantity-form-plus-border-color
darken(rn-quantity-form-plus-background-color, 5%)
rn-quantity-form-plus-color
#fff
rn-font-size
15px
rn-font-size-large
18px
rn-line-height-base
1.5
rn-line-height
floor((rn-font-size * rn-line-height-base))
rn-btn-font-size
15px
rn-btn-small-font-size
15px
rn-btn-extra-small-font-size
12px
rn-headings-font-family
inherit
rn-headings-font-weight
400
rn-headings-line-height
100%
rn-headings-font-style
normal
rn-headings-color
rn-brand-primary
rn-headings-text-shadow
none
rn-font-size-h1
floor((rn-font-size * 1.6))
rn-font-size-h2
floor((rn-font-size * 1.4))
rn-font-size-h3
floor((rn-font-size * 1.25))
rn-font-size-h4
floor((rn-font-size * 1.1))
rn-font-size-h5
rn-font-size
rn-font-size-h6
ceil((rn-font-size * 0.85))
rn-color-h1
rn-headings-color
rn-color-h2
rn-headings-color
rn-color-h3
rn-headings-color
rn-color-h4
rn-headings-color
rn-color-h5
rn-headings-color
rn-color-h6
rn-headings-color
rn-availability-calendar-available
#8BC34A
rn-availability-calendar-selected
#0277BD
rn-availability-calendar-assigned
#F44336
rn-availability-calendar-limited
#FF9800
rn-availability-calendar-disabled
#F5F5F5
rn-alert-background
#FF9800
rn-alert-notice-background
#2c84cb
rn-border
#ddd
rn-border-radius
4px
rn-box-shadow
0 1px 3px rgba(0,0,0,0.12)
rn-form-input-height
34px
rn-form-padding-vertical
6px
rn-form-padding-horizontal
12px
rn-form-font-size
14px
rn-form-line-height
1.5
rn-form-input-color
#555
rn-form-input-bg
#fff
rn-form-input-border
#ccc
rn-form-input-border-focus
#66afe9
rn-form-placeholder-color
#999
rn-form-input-bg-disabled
#eee
rn-label-color
#555
rn-table-bg
transparent
rn-table-bg-accent
#f5f5f5
rn-table-border-color
#ddd
rn-table-cell-padding
8px
rn-table-font-size
14px
rn-table-scrollbar-thumb-bg
rgba(0,0,0,.3)
rn-panel-heading-color
rn-headings-color
rn-panel-background
#fff
rn-panel-border
1px solid #eee
rn-panel-light-grey-background
rn-panel-background
rn-panel-light-grey-border
rn-panel-border
rn-panel-padding
30px
rn-grid-item-header-color
rn-brand-primary
rn-grid-item-background
#fff
rn-grid-item-border
1px solid #eee
rn-grid-item-title-font-size
17px
rn-grid-item-title-font-weight
600
rn-grid-item-content-color
rn-text-color
rn-calendar-heading-color
rn-headings-color
rn-calendar-heading-font-size
16px
rn-calendar-month-background
#fff
rn-calendar-month-border
1px solid #eee
rn-calendar-month-width
342px
rn-calendar-month-padding-vertical
0
rn-calendar-month-padding-horizontal
20px
rn-panel-affix-top
rn-margin-large
rn-list-checks-icon-color
#999
Last modified 4mo ago
Copy link