Skip to main content

Workbooks
  • Knowledge Base
  • Customer Forum
  • Training
  • Support Portal
  • Support Processes
Login
  1. Home
  2. Support
  3. Knowledge Base
  4. Knowledge base
  5. Marketing
  6. Event Management
  7. The Event Management Portal
  8. Adding Custom CSS to the Event Portal
Support

Knowledge Base

Browse our knowledge base articles to quickly solve your issue.

  1. Home
  2. Support
  3. Knowledge Base
  4. Knowledge base
  5. Marketing
  6. Event Management
  7. The Event Management Portal
  8. Adding Custom CSS to the Event Portal
  • Welcome to the Knowledge Base
  • Introduction
    • Using the Knowledge Base
    • Editions & Licensing
      • Renewing Licences
    • Workflow
      • Queues
    • Logging In
      • Configuring Security Policies
      • Google Authentication
      • Login Protection
      • Microsoft Azure Active Directory
        • Link Workbooks to Microsoft Azure
        • Setting up User Templates
        • Locking down your Workbooks
    • Support Processes
  • Training
    • Training Videos
    • Training Courses
  • Getting Started
    • Supported browsers
    • Introduction
    • Desktop
      • Tips & Tricks on the Desktop
      • Welcome Messages & Bulletins
    • Records
      • External Links to Workbooks records
      • Tabs
        • Default Tab Views
        • Summary Timeline View
        • Overview Tab
      • Watching Records
      • Notes
    • Landing Pages
      • Bulk Actions
        • Scheduled Bulk Actions
      • Customising Views
        • Customising Columns
        • Filtering
          • Custom Filters
        • Calendar Views
        • Card View
          • Report Card View
          • Worked Examples of Card Views
      • Deleted Items
      • Edit Grids
      • Exporting Data
      • Exporting to MS Excel
    • Workbooks on Mobiles and Tablets
  • Preferences
    • Introduction to Preferences
    • Setting your Preferences
      • Email Accounts
      • Notifications & Reminders
  • Activities
    • Introduction to Activities
    • Using Activities
      • Meetings
        • Integrating Workbooks and Google Calendar
          • Installing and Managing Workbooks and Google Calendar Integration
          • Synchronising your Google Calendar with Workbooks
      • Follow-on Activities
  • Cases
    • Introduction to Cases
    • Displaying & Adding Cases
    • Managing Cases
    • Case Portal
      • Installation
        • Custom Fields
        • Case Portal Configuration
          • Company Details
          • General
            • Case Portal Reports
          • New Case
          • Help Text
          • Emails
          • Advanced Features
          • Field Mappings
          • Help Dialog
          • Product Area Questions
        • Case Portal Additional Features
          • Setting up Public/Private Activity creation
          • Setup Registration Emails from a Person
          • Automatic Emails on Case Status Change
      • Using the Case Portal
        • Case Updates - Public & Private Activities
        • Inviting a Person to the Case Portal
  • Email
    • Introduction to Email
    • Working With Emails
    • Email Signatures
    • Sending Bulk Email
    • Common Email Errors
    • Email Integrations
    • Mailing Lists
  • Forecasts & Quotas
    • Introduction to Forecasts & Quotas
    • Sales Forecasts
      • Adjusting Forecasts
      • Included Forecasts
    • Sales Quotas
  • Importing Data
    • Introduction to Importing
    • Preparing your Import Data
      • Import Templates
      • Compulsory fields for Import
    • Workbooks Import Wizard
      • Uploading your data
      • Defining Field Mappings
      • Extending your Import to other Record types
      • Checking for Duplicates
      • Running and Reviewing your Import
    • Managing your Imports
      • Undoing an Import
  • Leads
    • Introduction to Leads
    • Displaying & Adding Leads
    • Converting Leads
  • Marketing
    • Introduction to Marketing
    • Marketing Campaigns
      • Displaying & Adding Campaigns
      • Campaign Management
      • Campaign Membership
      • Tracking URLs on Campaigns
      • Integrating DotDigital and Workbooks
        • Configuring Workbooks and Dotmailer
      • Integrating MailChimp and Workbooks
        • Configuring Workbooks and MailChimp
    • Mailing Lists
      • Creating Mailing Lists
    • Products
      • Pricing Schemes
      • Supply Scheme
      • Product Bundles
    • Mailshots
      • Creating a Mailshot
    • Upload Library
      • Using the Upload Library
    • Templates
      • Creating Templates
      • Creating a Template to show multiple lines
      • Extra Template Placeholders
    • Using HubSpot with Workbooks
    • Event Management
      • Introduction to Event Management
      • Enabling the Event Management Module
      • Using Event Records
        • Event Records
        • Event Sessions
        • Event Speakers
        • Event Sponsors
        • Event Products
        • Event Tickets
        • Event Attendees
      • The Event Management Portal
        • Introduction to the Event Management Portal
        • Prerequisites for installation
        • Accessing the Plugin
        • Installing the Event Management Portal
        • Amending Event Portal Parameters
        • Adding Custom CSS to the Event Portal
      • On The Day Registration App
      • Setup On the Day Registration App
    • Compliance Records
      • Introduction to Compliance Records
      • Enabling Compliance Records
      • Creating Compliance Records
      • Using Compliance Records
    • Spotler Integration
      • What is Spotler?
      • Navigating your Spotler homepage
      • GatorMail
        • Introduction to GatorMail
        • Managing your GatorMail Account
          • Domain Setup
        • GatorMail Configuration
          • GatorMail Field Mappings
            • GatorMail Hard Bounces
          • Preference Centres & Landing Pages
            • Preference Centre Setup
        • Creating Emails in GatorMail
          • Imbedding Images and Videos
        • Sending Emails in GatorMail
          • Sending GatorMail Campaigns
            • Campaign Action Types
            • Ramp-up
            • Testing Campaigns and Emails
          • Using SendForensics
          • Understanding your Campaign results
        • Advanced Features
          • Gator Smart Forms
          • GatorMail - Dynamic Content
      • GatorLeads / Web Insights
        • Tracking Code
          • Restricting Page Tracking
        • Setting up the Plugin
        • Viewing Web Insights Data on your Form Layouts
        • Domain Names and Online Activities
        • Reporting incorrect Leads created through Web Insights
        • Reporting on Web Insights data
        • Using UTM Values
        • Why aren’t Online Activities being created in the database?
        • Why is GatorLeads recording online activities in a foreign language?
      • GatorSurvey
      • GatorWorkflow
        • Spotler Data Sync
        • Triggered Mailshots
      • GatorPopup
  • Opportunities
    • Introduction to Opportunities
    • Displaying & Adding Opportunities
    • Opportunity Line Items
    • Opportunity Relationships
  • Integrations
    • Mapping
      • Introduction to the Mapping Module
      • Using the Mapping Module
      • Using Mapping in Reports
        • Changing the size/colour of Map Pins
    • Electronic Signing Tools
      • Docusign Integration
        • DocuSign Functionality
          • Copy Document on Signature
          • Update Related Records
          • Sending Multiple Documents
          • People, Organisations & Cases with DocuSign
          • Invoice Payments with DocuSign
          • Managing DocuSign Documents
        • Setting up the DocuSign Integration
          • Authentication with DocuSign
          • Production vs Sandbox
          • Creating a Document with a DocuSign Template
          • Creating a Document with a Workbooks PDF
          • DocuSign Fields
          • DocuSign Settings
          • Form Layout Configuration
        • DocuSign - Worked Examples
          • Taking Payments
          • Updating Related Records
          • Multiple Document Sends
          • Creating a Template for Cases
          • Creating a Template for Organisations
          • Creating a Template for People
          • Unified PDF for Transaction Documents
        • DocuSign - Reporting
          • Multiple Send Report Grid
          • Document Review Report
          • Monitoring Integration Errors
      • Adobe Sign Integration
        • Introduction to Adobe Sign
        • Authentication with Adobe Sign
        • Installing the Integration
        • Integration Monitoring & Error Handling
        • Setup of Adobe Sign
        • Adobe Sign Fields & Form Layout Configuration
        • Optional Custom Fields for Adobe Sign
        • Adobe Sign Button Process
        • Using the Adobe Sign Integration
    • Creditsafe Integration
      • Installing the Creditsafe Plugin
      • Configuring Organisations to use the Creditsafe Integration
      • An example of how to use the Creditsafe Integration
    • Zapier
      • Introduction to Zapier
      • Available Triggers and Actions
      • Linking your Workbooks Account to Zapier
      • Setting up Zaps
        • Posted Invoices to Xero Invoices
        • Xero payments to Workbooks Tasks
        • New Case to Google Drive folder
        • New Case to Basecamp Project
        • New Workbooks Case to JIRA Ticket
        • Jira Issue to new Case
        • 123FormBuilder Form Entry to Case
        • Eventbrite Attendee to Sales Lead and Task
        • Facebook Ad Leads to Sales Leads
        • Wufoo Form Entry to Sales Lead
        • Posted Credit Note to Task
        • QuickBooks Online
          • Initial Setup
            • Authentication with QuickBooks Online
          • People & Organisations to QuickBooks Customers
          • POSTED Workbooks Invoice to QuickBooks Online
          • QuickBooks Online Payment to Workbooks Invoice & Task
          • QuickBooks Sales Tax Code Lookup
        • Survey Monkey responses to Tasks
      • Multistep Zaps
    • Email Integrations
      • Email Dropbox
        • Setting up your Dropbox
        • Using your Dropbox
      • Workbooks Exchange Server Sync
        • Supported email clients
        • Set Up
          • Setting up the WESS
          • Setting up the Outlook Add-In
          • Customising the WESS Add-In
          • How to change Authentication setup for WESS
            • O365 Exchange authentication Troubleshooting
        • What gets synchronised?
          • Synchronising with the WESS
          • Synchronising with the WESS Add-in
          • How to force a sync
          • Best practice
        • WESS Troubleshooting
      • Workbooks Outlook Connector
        • Introduction to the Outlook Connector
        • Before downloading the Outlook Connector
          • System Requirements
          • Enabling the Outlook Connector
        • Download/update the Outlook Connector
        • Installing the Outlook Connector
          • Uninstalling the Outlook Connector
        • Using the Outlook Connector
          • Configuring the Outlook Connector's Settings
          • Identifying Records in Workbooks created in Outlook
        • Outlook Connector Troubleshooting
    • Event & Webinar Integration Tools
      • GoToWebinar
        • Installation
          • GoToWebinar Fields & Processes
          • Setting up Process Buttons for GoToWebinar
        • Authentication
          • Multiple GoToWebinar Accounts
          • Removing GoToWebinar Accounts
        • Create/Update & Cancel Webinars from Events
        • Event Attendees as Webinar Registrants
        • Event Speakers as Webinar Panelists
        • Retrieve Webinar Data
      • ON24
        • Installation
          • ON24 Fields & Processes
          • Setting Up Process Buttons for ON24
        • Authentication with ON24
          • Removing ON24 Accounts
        • Create Webcasts from Events
        • Event Attendees as Webcast Registrants
        • Retrieve Webcast Data
          • Reporting: Survey Responses
          • Reporting: Poll Responses
        • Retrieve Survey Data
        • Engagement Hub Interactions
    • Microsoft Office
      • Azure Active Directory
      • Excel
      • Outlook
      • Power BI
      • SharePoint
        • Authentication
        • Installation
          • Custom Fields & Processes
          • SharePoint Integration Settings
        • Using the SharePoint Integration
      • Word
        • Introduction to the Word Add-in
        • Deploying the Word Add-in
        • Creating Word Add-in Templates
          • Example Word Add-in Templates
        • Using Word Add-in Templates
        • Word Add-in Tips and Tricks
    • Outreach
      • Installation
        • Outreach Fields & Processes
        • Create Outreach Custom Field Mappings
          • Configure Outreach Field Dynamic Picklist
        • Sync Outreach Mappings
      • Outreach Authentication
        • Remove Outreach Account
      • Sync People to Outreach Prospects
        • People Field Mappings
      • Sync Organisations to Outreach Accounts
        • Organisation Field Mappings
      • Sync Workbooks Opportunities to Outreach
        • Opportunity Field Mappings
      • Sync Tasks/Activities from Workbooks to Outreach
        • Follow-Up Activities created via Scheduled Process
      • Sync Outreach Sequences to Workbooks
      • Sync Outreach Sequence States to Workbooks
      • Sync Outreach Sequence Step Numbers to Workbooks
      • Sync Prospects/Accounts/Opportunities from Outreach to Workbooks
      • Sync Outreach Tasks/Calls/Meetings to Workbooks
    • Scribe/Workbooks Connector
      • Connection Setup
        • Microsoft SQL Server Connection Requirements
      • Connector Control Blocks
      • Worked Example - Create, Read, Update & Delete
    • RingCentral
      • Installation
        • RingCentral Integration Fields and Processes
      • RingCentral Authentication
        • Remove RingCentral Account
      • Creating Phone Call Activities
      • Click to Dial
  • People & Organisations
    • Introduction to People & Organisations
    • Organisations
      • Displaying & Adding Organisations
      • Customers & Suppliers
    • People
      • Displaying & Adding People
      • Adding People to Outlook
    • Relationships
      • Change Employer Wizard
      • Direct Relationships
      • Third Party Relationships
    • De-duplication and Merge
      • Workbooks Merging
      • Workbooks DQ
      • Data Quality
    • Using Postcode Lookup
    • Data Enrichment
      • Introduction to Data Enrichment
      • Setting up Data Enrichment
  • Snippets
  • Reporting
    • Introduction to Reporting
      • Creating Reports
        • Standard Workbooks Reports
        • Creating a Pre-populated Report
        • Creating a Report from a Template
          • Report Templates
        • Creating a Blank Report
        • Auto-refreshing Report Views
      • Sharing Reports
    • Using Reports
      • Reporting Explained
        • Adding Targets, Conditional Formatting and CSS Styling
          • Calculated Targets
          • Target Sets
            • Creating a Target set for Closed Cases per Customer Support Agent
            • Creating a Target set for Closed Sales amount per Sales Person by quarter
        • Reporting with multiple currencies
        • Drilling into Summary Views
        • Improving Report Performance & Run Time
      • Displaying reports within Record Views
      • Displaying Reports
        • Reporting Views (Reports on Landing Pages)
      • Adding a Report view to a Dashboard
    • Charts
      • Creating & Using Charts
        • Bar Charts
          • Targets on Bar Charts
        • Line Charts
        • Pie Charts
        • Dial Charts
    • Exporting Reports
      • Emailing Scheduled Reports
    • Advanced Reporting
      • Types of Split Columns
      • Using Calculated Columns
        • Introduction to the IF Statement
        • Introduction to the CASE Statement
        • Applying Search filters in Calculated Columns
        • Comments in Calculated Columns
        • Financial Year Reporting
        • Introduction to Date Functions in Reports
        • Using Calculated Criteria
        • Reporting on empty fields
      • Audit Reporting
  • Dashboards
    • Adding Elements to Dashboards
      • Configuring Dashboard Elements
    • Dashboard Views
    • Dashboard Fields
    • Creating a Sales Dashboard
    • Springboard
    • Adding a Dashboard as a Record Tab
  • Okta Authentication
  • Transaction Documents
    • Introduction to Transaction Documents
      • Displaying & Adding Transaction Documents
      • Copying Transaction Documents
      • Transaction Documents Fields Help
      • Transaction Documents Line Items Help
      • Printing & Sending Transaction Documents
      • Managing Transaction Document Currencies
      • Managing Transaction Document Statuses
      • Setting a Blank Default Currency on Transaction Documents
    • Credit Notes
    • Customer Orders
    • Invoices
    • Quotations
    • Supplier Orders
    • Contract Management
      • Displaying & Adding Contracts
      • Using Contracts with Cases
    • Sagelink
  • Auditing
    • Auditing
  • Configuration
    • Introduction to System Administration
      • Quick Start Wizard
    • Users & Security
      • Users
        • Setting up your Users
        • Disabling Users
        • Profile Pictures
      • User Groups
        • Capabilities
        • Creating & Modifying User Groups
      • Permissions
        • Sharing Policies & Mandatory Permissions
          • Configuring the Advanced Security Module
            • Configuring the Advanced Security Module: Segmenting Users by function
            • Configuring the Advanced Security Module: Segmenting Users by location
      • Account Settings
      • Licences & Modules
        • Multi Language
    • Database
      • Databases
      • Storage Usage
      • Prefixes & Numbering
        • Modifying Object References
      • Export Database
      • Database Settings
    • Accounting
      • Accounting Periods
      • Exchange Rates
        • Setting Exchange Rates
      • Tax Regimes
        • Setting Tax Rates
        • Sales Tax Rulesets
          • Using Sales Tax Rulesets
      • Own Organisations
        • Setting up your Own Organisation
    • Email & Integration
      • Email Settings
        • Setting up your Email Server
        • Using Workbooks Server to send Emails
      • API Keys
      • Web to Case and Web to Lead
        • Setting up a Web2Case Form
        • Setting up a Web2Lead Form
        • Using Web Forms in Workbooks
        • Editing a Web Key Form
      • Preference Centre
      • MailChimp & dotMailer
      • Loqate
      • Bank Account Validation
    • Customisation
      • Creating & Modifying Picklists
      • Desktop Preferences
      • Theme
      • Record Types
        • Creating Custom Fields
          • Dynamic Linked Items & Picklists
          • Constrained Dynamic Linked Items (DLI) & Picklists
          • Creating relationships with Dynamic Linked Items (DLIs)
          • Linking Custom Field Values
          • Showing Linked Records in Tabs
        • Report-based Custom Fields
          • Improving the Performance of Report Cells/Grids
        • Linked Fields & Reference Fields
        • Record Templates
        • Form Layouts
          • Customising an Organisation form
          • Displaying a Tab as a Side Panel
          • Card View
          • Read-only Assigned to Fields
        • Customising relationships between parties
          • Configuring Custom Party Relationships
        • Opportunity Stages
      • Custom Records
        • Enabling Custom Records
        • Creating Custom Record Types
          • Editing Custom Record Types
        • Using Custom Records
    • Automation
      • Plugins
        • Field Updater Plugin
        • File Storage Plugin
          • Using File Storage
          • Using SharePoint File Storage
        • Cognism Enrich Plugin
          • Using Cognism Enrich
        • Email to Case Plugin and Process
      • Processes
        • Process Logging
      • Workbooks Scripts
        • Script Library
        • How Workbooks Runs Scripts
        • Workbooks Script External Access
      • API Data
      • Triggers and Webhooks
        • Configuring Triggers and Webhooks
    • PDF Configuration
      • Modifying Document Templates
        • Adding Terms & Conditions to your Documents
        • Multi-line Value Tags
      • Modifying Default Colours & Images
      • Creating Custom Document Templates
  • Contact Support
    • Contacting Workbooks Support
    • Workbooks CRM Advisory Packs
    • Introduction to the Administrator Service
  • Releases & Roadmap
    • Roadmap
    • September 2022 Release
    • June 2022 Release
    • March 2022 Release
    • October 2021 Release
    • June 2021 Release
    • March 2021 Release
    • 2020 Releases
      • December 2020 Release
      • September 2020 Release
      • April 2020 Release
      • January 2020 Release
    • 2019 Releases
      • September 2019 Release
      • February 2019 - Event Management Release
      • January 2019 Release
    • 2018 Releases
      • October 2018 Release
      • May 2018 Release
      • February 2018 Release
      • January 2018 Release
    • 2017 Releases
      • November 2017 Release
      • September 2017 Release
      • June 2017 Release
      • March 2017 Release
    • 2016 Releases
      • December 2016 Release
      • August 2016 Release
      • January 2016 Release
  • Workbooks Glossary

Adding Custom CSS to the Event Portal

CSS configuration available in the parameters of the Event Portal or on an individual Event Record. This CSS is configured to work with Bootstrap 4 so if you are uploading your own custom CSS you must ensure that it is compatible with this. If however you do not already have your own Bootstrap 4 CSS file that can be used we have provided you with information below on configuration and storage.

Sample File

We have created a sample SCSS file that has been specifically designed for our Event Management Portal. This is available for download here. Alterations can then be made to the SCSS file amending the names of the colours being used within the file then compile the file to become a CSS file. 

Instructions of how to compile a CSS file from the SCSS file can be found in the comments at the top of the file.

How should I store my amended CSS File?

Once you have downloaded and amended the Sample File we recommend that you store this in the Workbooks Upload Library, you will need to ensure that the public resource checkbox is checked. If this is not checked this CSS will only be available to Workbooks users.

Once you have uploaded the file this will generated an External URL. This URL will need to be set in one of two places depending on how you want to use this. If this CSS will be applied to all Events then this URL needs to be entered into the Custom CSS Parameter within the Event Management Plugin, however if this is only going to apply to a single Event then it will need to be added to the Custom CSS Field on the Event Record.

Additional Changes to the Event Management CSS

We have outlined below all of the elements within the Event Management Portal and all of the aspects that can be changed with the CSS File. This will provide you with the ability to retain the look and feel of your website within the Event Portal so it appears as a seamless transition for any user.

General layout

Screen Width
.container - controls the width of the content, uses @media queries to specify the max-width based on the width of the browser.

Buttons

  • .btn - generic properties
  • .btn-primary - buttons like 'Register', 'Continue as Guest' etc
  • .btn-outline-info - buttons like 'Events' in the navigation menu at the top of the screen
  • .btn-info - buttons like 'Biography' in Speakers section of the event details page
  • .btn-success - buttons like 'Checkout', 'Confirm' etc

Navigation Menu

This includes the navigation bar at the top of the screen as well as the event navigation (Select Tickets, Order Details etc).

  • .navbar-light .navbar-nav .nav-link (anchor tags) - mostly in the event details but also used for the guest / user button.
  • .navbar-light .navbar-nav .active > .nav-link - sets the active item when registering for an event.

The light grey background is defined by the bg-light class - note: this class also defines the alternating sections when showing the details for an event.

Page Header

The "Upcoming events" title and the name of the event for other pages are defined using a <h1> tag which can be modified, the black border that gets added when there is a banner image is not currently configurable.

When showing a page for a specific event, the date and time defined using a <h3> tag which can be modified, this also has the subheader class which but as above, the black border cannot be changed.

Compliance Statement
Background colour defined using the footer class.

Alerts

Alerts within the process are defined using the following classes...

  • .alert - generic properties
  • .alert-success - defines the green text, background and border colours shown for success messages
  • .alert-danger - defines the red text, background and border colours shown for error messages
  • .alert-info - defines the blue(ish) text, background and border colours shown for information messages

List of all events

The dates in the timeline use the following classes:

  • .badge - generic badge properties
  • .badge-pill - defines the curved ends
  • .badge-primary - sets the colours

The timeline calendar icons use the following classes:

  • .timeline-point - generic properties
  • .timeline-point-primary - sets the colours

The events within the timeline are defined using the following classes:

  • .timeline-event - container that defines the background, border details etc
  • .timeline-heading - element that contains the banner logo
  • .timeline-body - element that contains the link to the event
  • .timeline-footer - element that contains the event date

The additional link between the calendar icon and the event are styled using the class path timeline .timeline-item > .timeline-event:before.

Note: All of the timeline prefixed CSS classes are defined within the page itself so any overrides may need to be given more granularity in order to take precedence, e.g.

 

#main_content .timeline .timeline-item > .timeline-event {
border: 1px solid green;
}
#main_content .timeline .timeline-item > .timeline-event:before {
border-left-color: green;
border-right-color: green;
}

Event details page

General styling

Each section is defined using cards which utilises the following classes (all nested within each other):

  • .card
  • .card-body
  • .card-title

Note: these cards also use the border-0 class to turn off the border at this top level, other cards defined within the page will contain a border as defined by the card class.

The title is defined using a <h2> tag as well as the card-title class.

The light grey background on alternating sections are defined by the bg-light class.

Agenda Section

The table here does not have any specific classes set but this can be styled using the parent 'agenda' id. e.g.

#agenda table { ... }
#agenda table td { ... }

Speakers Section

Each speaker is defined using a card (see above) with the addition of the card-footer class that us used to style the grey background in the bar underneath the card - actually defines black with a 12.5% opacity to simply darken the footer.

The speaker image style is controlled by the speaker_img class but as this is defined within the page itself any overrides may need to be given more granularity in order to take precedence, e.g.

#speakers .speaker_img { ... }
#speakers .speaker_img img { ... }

The speaker info is defined within a speaker_info class and uses <h5> tags for the names and <small> for their details. Similarly to speaker_img, overrides to this class need to be given more granularity.

The buttons in the speaker cards use the btn-info as defined above.

The link buttons in the card footer are anchor tags that can be styled using the card-link class.

Venue Section

The information, address and directions are displayed using cards with the addition of the following classes to those mentioned above...

  • .card-group - controls how the three cards sit together in one line
  • .card-header - defines the grey background in the bar above the card - actually defines black with a 13% opacity to simply darken the header

Sponsors Section

Uses cards with no borders.

Select Tickets Page

The list of available tickets / products table specifies the following classes...

  • .table
  • .table-sm
  • .table-striped

These three classes are then used in conjunction with the with appropriate child HTML elements to style the table, including striping the rows.

Order details

Uses cards and bg-light for the layout.

The item count in the Cart is defined as a badge (see List of all events) but this one uses the badge-info class to define the colours.

Confirmation / Payment page

The Customer and Event details are defined using cards.

The Customer card defines both the text-white and bg-info classes which sets the background colour and white text (the header then being 13% opacity black over the top).

The Event card defines both the text-white and bg-secondary classes which sets the background colour and white text (the header then being 13% opacity black over the top).

The tickets / products table is styled the same as for the Select tickets page.

The payment button uses the btn-info class

Attendees page

The individual attendee forms are defined as cards (see above)

The cards also have the border-info class set to colour just the border and then use the text-white and bg-info classes for colour the header.

When the attendee details are specified then the header uses the bg-success class to set the background colour which is what turns if green.

  • Amending Event Portal Parameters
  • On The Day Registration App

© 2023 Workbooks.com - privacy & terms
  • Linkedin
  • Twitter
  • Youtube
  • Facebook