Purpose Website UI Kit

1.1.1 - 6th September 2018

Small fixes

• FIX: sticky navigation remaining stuck problem when the top bar was removed
• FIX: some spacing optimization made on page headers

1.1.0 - 3th September 2018

Highlights

• E-commerce module added (files begin with shop-*.html)
• Board pages added (Overview, Projects, Tasks, Connections)
• Public profile page added for registered users
• Fixed tongue border that appeared sometimes
• Added top bar feature for selecting language, search, cart and user account
• Sticky navigation via class .navbar-fixed-top applied on the main navbar container
• Togglable global search feature with suggestions from the navbar search button

Header

• NEW: added top bar feature for selecting language, search, cart and user account
• NEW: added .dropdown-menu-arrow modifier class for applying arrow indicators on any dropdown
• NEW: Sticky navigation via class .navbar-fixed-top applied on the main navbar container
• NEW: togglable global search feature with suggestions from the navbar search button

• NEW: toggable slidebar for additional content such as user fast login or shopping cart

• UPDATE: theme’s logo
• UPDATE: class .navbar-transparent is depracated and was replaced with .header-transparent which is applied on the header tag that contains the top bar and the main navigation

• UPDATE: the animation for dropdown-menu included in the main navbar, are made via class .dropdown-animate applied next to the .dropdown

• ENHANCE: the transparency of the header is now maintaned also on mobile resolutions
• ENHANCE: removed class .list-group-item-action from the main navbar dropdown
• ENHANCE: added dropdown menu toggle option on hover with animation (made default) via class .dropdown-animate with the data-toggle="hover" on
• ENHANCE: the main navbar’s collapsing animation has been modified for a more smooth transition and ux

Sections

• UPDATE: removed the border-bottom-left-radius form .section-rotate on under large resolutions

Background image holder (.bg-img-holder)

• ENHANCE: added data-bg-position attribute on .bg-img-holder in order to easily position the background image (e.g data-bg-position=”center center”, data-bg-positon=”bottom 0”)

HTML

• NEW: e-commerce module added (files begin with shop-*.html)
• NEW: cart pages (cart items and empty cart)

• NEW: e-commerce checkout pages (customer, shipping, payment)

• NEW: Board pages (Overview, Projects, Tasks, Connections) - in Account Pages
• NEW: Public profile page for registered users
• NEW: Updates layout for the account pages (Profile, Settings, Billing, Notifications)
• NEW: added password reset page for each login/register style (recover-*.html)
• UPDATE: enhanced design for login and register pages
• RENAME: account-settings.html renamed to account-profile.html

• ENHANCE: the “Change avatar” button is now working as a file input

• UPDATE: landing-1.html has been restyled
• UPDATE: landing-2.html has been restyled

SASS

• UPDATE: _icons.scss was renamed to _icon.scss for better name consistency
• NEW: added $icon-border-width for outlined icons (e.g 3px)
• NEW: added icon mixin (purpose/mixins/_icon.scss) to add icon color variations (related to component _icon.scss)

• NEW: icon modifier classes added next to .icon-shape in order to add a background or border (e.g icon-green or icon-outline-purple)

• ENHANCE: new color palette for the main colors (red, blue, green, orange, yellow, pink, purple, teal) that affect also the status colors (warning, danger, info and success)
• UPDATE: changed the $card-border-radius with the value of $border-radius-lg
• UPDATE: changed the $body-color with the value of $gray-600

• UPDATE: changed the $lead-font-size to 1.125rem

• UPDATE: shape-fill-* and stroke-* were modified to take the colors from the $colors object and not the $theme-colors so you can benefit of all the available colors (e.g shape-fill-danger becamse shape-fill-red and so on)

• UPDATE: .alpha-* modifier classes for opacities where renamed to .opacity-* for better name consistency and also moved to a sepparate utility file in utilities/_opacity.scss

• NEW: added .bg-absolute-cover class for adding cover backgrounds inside relative sections that take the full size of its container

• NEW: z-index utility classes added in the purpose/utitlies folder (e.g zindex-100) to add a z-index=100 on the desired element

• NEW: new component created - collage, in purpose/_collage.scss with the corresponding class name .collage - that allows you to create modern overlayed images with SVG backgrounds (it’s still in progress, which means we still have a lot to do with it + new options to add)

• NEW: product card with action buttons and color options

• NEW: new component create - ribbon, in purpose/_ribbon.scss with the corresponding class name .ribbon - that allow you to apply ribbon on any card with many style to choose from

• UPDATE: .timeline-axis-step was changed to .timeline-step

• NEW: timeline step variations - .timeline-step-dot, .timeline-step-icon

• UPDATE: avatars - .avatar-overlapped was renamed to .avatar-group

• UPDATE: .card-icon-actions was renamed to .icon-actions

• NEW: added a new utility file for images (utilities/_image.scss) for image alignment and filter management

• UPDATE: [data-link=”1”] was replaced with the .link-underline-* modifier class that allows you to use any of the theme’s color

• NEW: new mixin for links added in purpose/mixins/_link.scss

• UPDATE: .bg-img-holder received new options that are activated with js. In order to use it (for previous versions) add also the data-bg-size="contain" on the same element.

• UPDATED: modified $badge-padding-x value

Vendors and Resources

• NEW: Font Awesome Pro is used for the preview version. If you want to get more icon styles, purchase a license from their official website or our docs
• NEW: Wavify plugin added for custom wave animations (e.g: shop-products.html)
• NEW: Datepicker plugin added with single and range options
• NEW: 20 clothing SVG icons (assets/icons/clothing) used in the e-commerce module
• UPDATE: updated Bootstrap to 4.1.3 (from 4.1.1)
• UPDATE: Font Awesome to 5.2 (from 5.0.12)

Files

• UPDATE: Bootstrap js files were moved to /assets/vendore/bootstrap (was in /assets/js/)

1.0.1 - 21th June 2018

Documentation

• UPDATE: updated File Structure section

Gulp

• UPDATE: Optimized the gulp build command

Scss

• FIX:Solved the $icon-size variable issue that was appearing in the compiled CSS file.

1.0.0

Initial release.