Saved: 2018-02-23 16:59
Torey Heinz
committed Feb 23, 2018
commit 14c35a291b197ea7000906c0b16789c6c4c166f0
Showing 12
changed files with
206 additions
and 99 deletions
app/content_types/images.yml
+72
-0
| @@ | @@ -0,0 +1,72 @@ |
| + | # Human readable name of this type |
| + | name: Images |
| + | |
| + | # Lowercase, underscored handle used to access this type |
| + | slug: images |
| + | |
| + | # Explanatory text displayed in the back-office |
| + | description: A description of the content type for the editors |
| + | |
| + | # Slug of field used to identify entries by default, such as the title |
| + | label_field_name: title |
| + | |
| + | # Valid values: manually, created_at, updated_at, or the slug of any field |
| + | order_by: manually |
| + | |
| + | # Valid values: asc (ascending) and desc (descending). Set to asc by default. |
| + | # order_direction: asc |
| + | |
| + | # Specify a field slug to group entries by that field in the back-office. |
| + | # group_by: <your field> |
| + | |
| + | # Activate public 'create' API (e.g for a contact form) |
| + | # public_submission_enabled: false |
| + | |
| + | # Array of emails to be notified of new entries made with the public API |
| + | # public_submission_accounts: ['john@example.com'] |
| + | |
| + | # Control the display of the content type in the back-office. |
| + | # display_settings: |
| + | # seo: false # display the SEO tab for the content entries |
| + | # advanced: false # display the Advanced tab for the content entries |
| + | # position: 1 # position in the sidebar menu |
| + | # hidden: false # hidden for authors? |
| + | |
| + | # By default, the back-office displays the _label property (see label_field_name) of the content entry. This can be modified by writing your own Liquid template below: |
| + | # entry_template: '<a href="{{ link }}">{{ entry._label }}</a>' # The default template |
| + | |
| + | # A list describing each field |
| + | fields: |
| + | - title: # The lowercase, underscored name of the field |
| + | label: Title # Human readable name of the field |
| + | type: string |
| + | hint: Explanatory text displayed in the back office |
| + | localized: false |
| + | |
| + | - project: |
| + | label: Project |
| + | type: belongs_to |
| + | class_name: projects |
| + | inverse_of: images |
| + | |
| + | - service: |
| + | label: Service |
| + | type: belongs_to |
| + | class_name: services |
| + | inverse_of: images |
| + | |
| + | - file: # The lowercase, underscored name of the field |
| + | label: File # Human readable name of the field |
| + | type: file |
| + | required: false |
| + | hint: Explanatory text displayed in the back office |
| + | localized: false |
| + | |
| + | - category: |
| + | label: Category |
| + | type: select |
| + | required: true |
| + | select_options: ['Before', 'After'] |
| + | |
| + | |
| + | |
app/content_types/project_images.yml
+0
-65
| @@ | @@ -1,65 +0,0 @@ |
| - | # Human readable name of this type |
| - | name: Project images |
| - | |
| - | # Lowercase, underscored handle used to access this type |
| - | slug: project_images |
| - | |
| - | # Explanatory text displayed in the back-office |
| - | description: A description of the content type for the editors |
| - | |
| - | # Slug of field used to identify entries by default, such as the title |
| - | label_field_name: title |
| - | |
| - | # Valid values: manually, created_at, updated_at, or the slug of any field |
| - | order_by: manually |
| - | |
| - | # Valid values: asc (ascending) and desc (descending). Set to asc by default. |
| - | # order_direction: asc |
| - | |
| - | # Specify a field slug to group entries by that field in the back-office. |
| - | # group_by: <your field> |
| - | |
| - | # Activate public 'create' API (e.g for a contact form) |
| - | # public_submission_enabled: false |
| - | |
| - | # Array of emails to be notified of new entries made with the public API |
| - | # public_submission_accounts: ['john@example.com'] |
| - | |
| - | # Control the display of the content type in the back-office. |
| - | # display_settings: |
| - | # seo: false # display the SEO tab for the content entries |
| - | # advanced: false # display the Advanced tab for the content entries |
| - | # position: 1 # position in the sidebar menu |
| - | # hidden: false # hidden for authors? |
| - | |
| - | # By default, the back-office displays the _label property (see label_field_name) of the content entry. This can be modified by writing your own Liquid template below: |
| - | # entry_template: '<a href="{{ link }}">{{ entry._label }}</a>' # The default template |
| - | |
| - | # A list describing each field |
| - | fields: |
| - | - project: |
| - | label: Project |
| - | type: belongs_to |
| - | class_name: projects |
| - | inverse_of: images |
| - | |
| - | - file: # The lowercase, underscored name of the field |
| - | label: File # Human readable name of the field |
| - | type: file |
| - | required: false |
| - | hint: Explanatory text displayed in the back office |
| - | localized: false |
| - | |
| - | - category: |
| - | label: Category |
| - | type: select |
| - | required: true |
| - | select_options: ['Before', 'After'] |
| - | |
| - | - title: # The lowercase, underscored name of the field |
| - | label: Title # Human readable name of the field |
| - | type: string |
| - | hint: Explanatory text displayed in the back office |
| - | localized: false |
| - | |
| - | |
app/content_types/services.yml
+5
-0
| @@ | @@ -68,3 +68,8 @@ fields: |
| # If you want to manage the entries of the relationship directly from the source entry | |
| ui_enabled: true | |
| + | - images: |
| + | label: Images |
| + | type: has_many |
| + | class_name: images |
| + | inverse_of: service |
app/views/pages/index.liquid
+1
-1
| @@ | @@ -15,7 +15,7 @@ is_layout: false |
| </h1> | |
| <p>West Michigan's Premier Shop for All Your Canvas and Upholstery Needs.</p> | |
| <p class="cta"> | |
| - | <a href="#" class="button secondary"><strong>Get a Free Estimate</strong></a> |
| + | <a href="#" class="button"><strong>Get a Free Estimate</strong></a> |
| </p> | |
| </div> | |
| </header> | |
app/views/pages/layouts/application.liquid
+5
-7
| @@ | @@ -38,13 +38,11 @@ is_layout: true |
| </div> | |
| </div> | |
| <!-- End Top Bar --> | |
| - | <div class="wrapper row column"> |
| - | <div class=""> |
| - | {% block main %} |
| - | <h1>{% editable_text "heading", line_break: false, format: 'raw', rows: 1 %}{% endeditable_text %}</h1> |
| - | {% editable_text content %}Lorem ipsum{% endeditable_text %} |
| - | {% endblock %} |
| - | </div> |
| + | <div class="row column"> |
| + | {% block main %} |
| + | <h1>{% editable_text "heading", line_break: false, format: 'raw', rows: 1 %}{% endeditable_text %}</h1> |
| + | {% editable_text content %}Lorem ipsum{% endeditable_text %} |
| + | {% endblock %} |
| <footer class="text-center"> | |
| <p class="lead">Canvas Innovations</p> | |
| </footer> | |
app/views/pages/services.liquid
+32
-0
| @@ | @@ -0,0 +1,32 @@ |
| + | --- |
| + | title: Services |
| + | --- |
| + | {% extends 'layouts/application' %} |
| + | {% block 'main' %} |
| + | {{ 'foundation6/motion.min.css' | stylesheet_tag }} |
| + | <div class="orbit" role="region" aria-label="Favorite Space Pictures" data-orbit data-box-of-bullets="orbit-nav"> |
| + | <div class="orbit-wrapper"> |
| + | <div class="orbit-controls"> |
| + | <button class="orbit-previous"><span class="show-for-sr">Previous Slide</span>◀︎</button> |
| + | <button class="orbit-next"><span class="show-for-sr">Next Slide</span>▶︎</button> |
| + | </div> |
| + | <ul class="orbit-container"> |
| + | {% for service in contents.services %} |
| + | <li class="orbit-slide"> |
| + | <figure class="orbit-figure"> |
| + | <img class="orbit-image" src="https://placehold.it/1200x600/999?text={{ service.title }}" alt="{{ service.title }}"> |
| + | <figcaption class="orbit-caption">{{ service.brief }}</figcaption> |
| + | </figure> |
| + | </li> |
| + | {% endfor %} |
| + | </ul> |
| + | </div> |
| + | <nav class="orbit-nav" > |
| + | {% for service in contents.services %} |
| + | <img data-slide="{{ forloop.index0 }}" class="thumbnail" src="{{ service.featured_image.url | resize: '400x225#' }}"> |
| + | {% endfor %} |
| + | </nav> |
| + | </div> |
| + | |
| + | {% endblock %} |
| + | |
app/views/pages/services/content_type_template.liquid
+20
-7
| @@ | @@ -9,13 +9,26 @@ content_type: services |
| <h1>{{ service.title }}</h1> | |
| </div> | |
| </header> | |
| - | |
| - | {{ service.description }} |
| - | <h2>Projects</h2> |
| - | <ul> |
| - | {% for project in service.projects %} |
| - | <li><a href="{% path_to project %}">{{ project.title }}</a></li> |
| + | <p class="lead text-center">{{ service.brief }}<hr style="width:25%"></p> |
| + | <div class="row column callout"> |
| + | <div class="column medium-5"> |
| + | <div class="card"> |
| + | <img class="" src="{{ service.images.first.file.url }}"> |
| + | </div> |
| + | </div> |
| + | <div class="column medium-7"> |
| + | {{ service.description }} |
| + | <p class="cta text-center"> |
| + | <a href="#" class="button"><strong>Get a Free Estimate</strong></a> |
| + | </p> |
| + | </div> |
| + | </div> |
| + | <div class="row column callout medium-up-5"> |
| + | {% for image in service.images %} |
| + | <div class="column column-block"> |
| + | <img class="" src="{{ image.file.url }}"> |
| + | </div> |
| {% endfor %} | |
| - | </ul> |
| + | </div> |
| {% endblock %} | |
data/images.yml
+65
-0
| @@ | @@ -0,0 +1,65 @@ |
| + | - "Image 1": |
| + | category: Before |
| + | service: 'boat-enclosures' |
| + | project: 'project-1' |
| + | file: /samples/000_0018.jpg |
| + | |
| + | - "Image 2": |
| + | category: Before |
| + | service: 'boat-enclosures' |
| + | project: 'project-1' |
| + | file: /samples/000_0019.jpg |
| + | |
| + | - "Image 3": |
| + | category: After |
| + | service: 'boat-enclosures' |
| + | project: 'project-1' |
| + | file: /samples/000_0026.jpg |
| + | |
| + | - "Image 4": |
| + | category: After |
| + | service: 'boat-enclosures' |
| + | project: 'project-1' |
| + | file: /samples/000_0028.jpg |
| + | |
| + | - "Image 5": |
| + | service: 'boat-enclosures' |
| + | project: 'project-1' |
| + | file: /samples/000_0045.jpg |
| + | |
| + | - "Image 6": |
| + | service: 'boat-enclosures' |
| + | project: 'project-1' |
| + | file: /samples/000_0039.jpg |
| + | - "Image 7": |
| + | service: 'boat-enclosures' |
| + | project: 'project-1' |
| + | file: /samples/000_0018.jpg |
| + | - "Image 8": |
| + | service: 'boat-enclosures' |
| + | project: 'project-1' |
| + | file: /samples/000_0034.jpg |
| + | - "Image 9": |
| + | service: 'boat-enclosures' |
| + | project: 'project-1' |
| + | file: /samples/000_0030.jpg |
| + | - "Image 10": |
| + | service: 'boat-enclosures' |
| + | project: 'project-1' |
| + | file: /samples/000_0028.jpg |
| + | - "Image 11": |
| + | service: 'boat-enclosures' |
| + | project: 'project-1' |
| + | file: /samples/000_0019.jpg |
| + | - "Image 12": |
| + | service: 'boat-enclosures' |
| + | project: 'project-1' |
| + | file: /samples/000_0026.jpg |
| + | - "Image 13": |
| + | service: 'boat-enclosures' |
| + | project: 'project-1' |
| + | file: /samples/100_1304.jpg |
| + | - "Image 14": |
| + | service: 'boat-enclosures' |
| + | project: 'project-1' |
| + | file: /samples/000_0045.jpg |
data/project_images.yml
+0
-19
| @@ | @@ -1,19 +0,0 @@ |
| - | - "Project Image 1": |
| - | project: project-1 |
| - | category: Before |
| - | file: /samples/000_0018.jpg |
| - | |
| - | - "Project Image 2": |
| - | project: project-1 |
| - | category: Before |
| - | file: /samples/000_0019.jpg |
| - | |
| - | - "Project Image 3": |
| - | project: project-1 |
| - | category: After |
| - | file: /samples/000_0026.jpg |
| - | |
| - | - "Project Image 4": |
| - | project: project-1 |
| - | category: After |
| - | file: /samples/000_0028.jpg |
public/javascripts/vendor/motion-ui.js
+1
-0
| @@ | @@ -0,0 +1 @@ |
| + | !function(n,e){"function"==typeof define&&define.amd?define(["jquery"],e):"object"==typeof exports?module.exports=e(require("jquery")):n.MotionUI=e(n.jQuery)}(this,function(n){"use strict";function e(e,a,r,u){function s(){e||a.hide(),m(),u&&u.apply(a)}function m(){a[0].style.transitionDuration=0,a.removeClass(d+" "+c+" "+r)}if(a=n(a).eq(0),a.length){if(null===o)return e?a.show():a.hide(),void u();var d=e?i[0]:i[1],c=e?t[0]:t[1];m(),a.addClass(r),a.css("transition","none"),requestAnimationFrame(function(){a.addClass(d),e&&a.show()}),requestAnimationFrame(function(){a[0].offsetWidth,a.css("transition",""),a.addClass(c)}),a.one("transitionend",s)}}!function(){Date.now||(Date.now=function(){return(new Date).getTime()});for(var n=["webkit","moz"],e=0;e<n.length&&!window.requestAnimationFrame;++e){var i=n[e];window.requestAnimationFrame=window[i+"RequestAnimationFrame"],window.cancelAnimationFrame=window[i+"CancelAnimationFrame"]||window[i+"CancelRequestAnimationFrame"]}if(/iP(ad|hone|od).*OS 6/.test(window.navigator.userAgent)||!window.requestAnimationFrame||!window.cancelAnimationFrame){var t=0;window.requestAnimationFrame=function(n){var e=Date.now(),i=Math.max(t+16,e);return setTimeout(function(){n(t=i)},i-e)},window.cancelAnimationFrame=clearTimeout}}();var i=["mui-enter","mui-leave"],t=["mui-enter-active","mui-leave-active"],o=function(){var n={transition:"transitionend",WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"otransitionend"},e=window.document.createElement("div");for(var i in n)if("undefined"!=typeof e.style[i])return n[i];return null}(),a={animateIn:function(n,i,t){e(!0,n,i,t)},animateOut:function(n,i,t){e(!1,n,i,t)}};return a}); |
public/stylesheets/app.scss
+4
-0
| @@ | @@ -100,4 +100,8 @@ header { |
| font-family: $header-font-family; | |
| } | |
| + | .content { |
| + | background-color: $light-gray; |
| + | } |
| + | |
| @import "featured_services"; | |
public/stylesheets/foundation6/motion.min.css
+1
-0
| @@ | @@ -0,0 +1 @@ |
| + | .slide-in-down.mui-enter{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:translateY(-100%);transform:translateY(-100%);transition-property:opacity,-webkit-transform;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;-webkit-backface-visibility:hidden;backface-visibility:hidden}.slide-in-left.mui-enter,.slide-in-up.mui-enter{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform;-webkit-backface-visibility:hidden}.slide-in-down.mui-enter.mui-enter-active{-webkit-transform:translateY(0);transform:translateY(0)}.slide-in-left.mui-enter{-webkit-transform:translateX(-100%);transform:translateX(-100%);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;backface-visibility:hidden}.slide-in-left.mui-enter.mui-enter-active{-webkit-transform:translateX(0);transform:translateX(0)}.slide-in-up.mui-enter{-webkit-transform:translateY(100%);transform:translateY(100%);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;backface-visibility:hidden}.slide-in-right.mui-enter,.slide-out-down.mui-leave{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform;-webkit-backface-visibility:hidden}.slide-in-up.mui-enter.mui-enter-active{-webkit-transform:translateY(0);transform:translateY(0)}.slide-in-right.mui-enter{-webkit-transform:translateX(100%);transform:translateX(100%);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;backface-visibility:hidden}.slide-in-right.mui-enter.mui-enter-active{-webkit-transform:translateX(0);transform:translateX(0)}.slide-out-down.mui-leave{-webkit-transform:translateY(0);transform:translateY(0);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;backface-visibility:hidden}.slide-out-right.mui-leave,.slide-out-up.mui-leave{transition-property:opacity,-webkit-transform;-webkit-backface-visibility:hidden;transition-duration:.5s;transition-timing-function:linear}.slide-out-down.mui-leave.mui-leave-active{-webkit-transform:translateY(100%);transform:translateY(100%)}.slide-out-right.mui-leave{-webkit-transform:translateX(0);transform:translateX(0);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;backface-visibility:hidden}.slide-out-right.mui-leave.mui-leave-active{-webkit-transform:translateX(100%);transform:translateX(100%)}.slide-out-up.mui-leave{-webkit-transform:translateY(0);transform:translateY(0);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;backface-visibility:hidden}.slide-out-up.mui-leave.mui-leave-active{-webkit-transform:translateY(-100%);transform:translateY(-100%)}.slide-out-left.mui-leave{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:translateX(0);transform:translateX(0);transition-property:opacity,-webkit-transform;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;-webkit-backface-visibility:hidden;backface-visibility:hidden}.fade-in.mui-enter,.fade-out.mui-leave{transition-property:opacity;transition-duration:.5s;transition-timing-function:linear}.slide-out-left.mui-leave.mui-leave-active{-webkit-transform:translateX(-100%);transform:translateX(-100%)}.fade-in.mui-enter{opacity:0}.fade-in.mui-enter.mui-enter-active,.fade-out.mui-leave{opacity:1}.fade-out.mui-leave.mui-leave-active{opacity:0}.hinge-in-from-top.mui-enter{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:perspective(2000px) rotateX(-90deg);transform:perspective(2000px) rotateX(-90deg);-webkit-transform-origin:top;transform-origin:top;transition-property:opacity,-webkit-transform;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.hinge-in-from-bottom.mui-enter,.hinge-in-from-right.mui-enter{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform}.hinge-in-from-top.mui-enter.mui-enter-active{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);opacity:1}.hinge-in-from-right.mui-enter{-webkit-transform:perspective(2000px) rotateY(-90deg);transform:perspective(2000px) rotateY(-90deg);-webkit-transform-origin:right;transform-origin:right;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.hinge-in-from-right.mui-enter.mui-enter-active{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);opacity:1}.hinge-in-from-bottom.mui-enter{-webkit-transform:perspective(2000px) rotateX(90deg);transform:perspective(2000px) rotateX(90deg);-webkit-transform-origin:bottom;transform-origin:bottom;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.hinge-in-from-left.mui-enter,.hinge-in-from-middle-x.mui-enter{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform}.hinge-in-from-bottom.mui-enter.mui-enter-active{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);opacity:1}.hinge-in-from-left.mui-enter{-webkit-transform:perspective(2000px) rotateY(90deg);transform:perspective(2000px) rotateY(90deg);-webkit-transform-origin:left;transform-origin:left;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.hinge-in-from-left.mui-enter.mui-enter-active{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);opacity:1}.hinge-in-from-middle-x.mui-enter{-webkit-transform:perspective(2000px) rotateX(-90deg);transform:perspective(2000px) rotateX(-90deg);-webkit-transform-origin:center;transform-origin:center;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.hinge-in-from-middle-y.mui-enter,.hinge-out-from-top.mui-leave{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform}.hinge-in-from-middle-x.mui-enter.mui-enter-active{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);opacity:1}.hinge-in-from-middle-y.mui-enter{-webkit-transform:perspective(2000px) rotateY(-90deg);transform:perspective(2000px) rotateY(-90deg);-webkit-transform-origin:center;transform-origin:center;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.hinge-in-from-middle-y.mui-enter.mui-enter-active{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);opacity:1}.hinge-out-from-top.mui-leave{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);-webkit-transform-origin:top;transform-origin:top;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.hinge-out-from-bottom.mui-leave,.hinge-out-from-right.mui-leave{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform}.hinge-out-from-top.mui-leave.mui-leave-active{-webkit-transform:perspective(2000px) rotateX(-90deg);transform:perspective(2000px) rotateX(-90deg);opacity:0}.hinge-out-from-right.mui-leave{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);-webkit-transform-origin:right;transform-origin:right;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.hinge-out-from-right.mui-leave.mui-leave-active{-webkit-transform:perspective(2000px) rotateY(-90deg);transform:perspective(2000px) rotateY(-90deg);opacity:0}.hinge-out-from-bottom.mui-leave{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);-webkit-transform-origin:bottom;transform-origin:bottom;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.hinge-out-from-left.mui-leave,.hinge-out-from-middle-x.mui-leave{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform}.hinge-out-from-bottom.mui-leave.mui-leave-active{-webkit-transform:perspective(2000px) rotateX(90deg);transform:perspective(2000px) rotateX(90deg);opacity:0}.hinge-out-from-left.mui-leave{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);-webkit-transform-origin:left;transform-origin:left;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.hinge-out-from-left.mui-leave.mui-leave-active{-webkit-transform:perspective(2000px) rotateY(90deg);transform:perspective(2000px) rotateY(90deg);opacity:0}.hinge-out-from-middle-x.mui-leave{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);-webkit-transform-origin:center;transform-origin:center;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.hinge-out-from-middle-y.mui-leave,.scale-in-up.mui-enter{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform}.hinge-out-from-middle-x.mui-leave.mui-leave-active{-webkit-transform:perspective(2000px) rotateX(-90deg);transform:perspective(2000px) rotateX(-90deg);opacity:0}.hinge-out-from-middle-y.mui-leave{-webkit-transform:perspective(2000px) rotate(0);transform:perspective(2000px) rotate(0);-webkit-transform-origin:center;transform-origin:center;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.hinge-out-from-middle-y.mui-leave.mui-leave-active{-webkit-transform:perspective(2000px) rotateY(-90deg);transform:perspective(2000px) rotateY(-90deg);opacity:0}.scale-in-up.mui-enter{-webkit-transform:scale(.5);transform:scale(.5);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.scale-in-down.mui-enter,.scale-out-up.mui-leave{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform}.scale-in-up.mui-enter.mui-enter-active{-webkit-transform:scale(1);transform:scale(1);opacity:1}.scale-in-down.mui-enter{-webkit-transform:scale(1.5);transform:scale(1.5);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.scale-in-down.mui-enter.mui-enter-active{-webkit-transform:scale(1);transform:scale(1);opacity:1}.scale-out-up.mui-leave{-webkit-transform:scale(1);transform:scale(1);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.scale-out-down.mui-leave,.spin-in.mui-enter{transition-duration:.5s;transition-timing-function:linear;transition-property:opacity,-webkit-transform}.scale-out-up.mui-leave.mui-leave-active{-webkit-transform:scale(1.5);transform:scale(1.5);opacity:0}.scale-out-down.mui-leave{-webkit-transform:scale(1);transform:scale(1);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.scale-out-down.mui-leave.mui-leave-active{-webkit-transform:scale(.5);transform:scale(.5);opacity:0}.spin-in.mui-enter{-webkit-transform:rotate(-.75turn);transform:rotate(-.75turn);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.spin-in-ccw.mui-enter,.spin-out.mui-leave{transition-property:opacity,-webkit-transform;transition-duration:.5s;transition-timing-function:linear}.spin-in.mui-enter.mui-enter-active{-webkit-transform:rotate(0);transform:rotate(0);opacity:1}.spin-out.mui-leave{-webkit-transform:rotate(0);transform:rotate(0);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.spin-out.mui-leave.mui-leave-active{-webkit-transform:rotate(.75turn);transform:rotate(.75turn);opacity:0}.spin-in-ccw.mui-enter{-webkit-transform:rotate(.75turn);transform:rotate(.75turn);transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:0}.spin-in-ccw.mui-enter.mui-enter-active{-webkit-transform:rotate(0);transform:rotate(0);opacity:1}.spin-out-ccw.mui-leave{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:rotate(0);transform:rotate(0);transition-property:opacity,-webkit-transform;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;opacity:1}.spin-out-ccw.mui-leave.mui-leave-active{-webkit-transform:rotate(-.75turn);transform:rotate(-.75turn);opacity:0}.slow{transition-duration:750ms!important}.linear{transition-timing-function:linear!important;-webkit-animation-timing-function:linear!important;animation-timing-function:linear!important}.ease{transition-timing-function:ease!important;-webkit-animation-timing-function:ease!important;animation-timing-function:ease!important}.ease-in{transition-timing-function:ease-in!important;-webkit-animation-timing-function:ease-in!important;animation-timing-function:ease-in!important}.ease-out{transition-timing-function:ease-out!important;-webkit-animation-timing-function:ease-out!important;animation-timing-function:ease-out!important}.ease-in-out{transition-timing-function:ease-in-out!important;-webkit-animation-timing-function:ease-in-out!important;animation-timing-function:ease-in-out!important}.bounce-in{transition-timing-function:cubic-bezier(.485,.155,.24,1.245)!important;-webkit-animation-timing-function:cubic-bezier(.485,.155,.24,1.245)!important;animation-timing-function:cubic-bezier(.485,.155,.24,1.245)!important}.bounce-out{transition-timing-function:cubic-bezier(.485,.155,.515,.845)!important;-webkit-animation-timing-function:cubic-bezier(.485,.155,.515,.845)!important;animation-timing-function:cubic-bezier(.485,.155,.515,.845)!important}.bounce-in-out{transition-timing-function:cubic-bezier(.76,-.245,.24,1.245)!important;-webkit-animation-timing-function:cubic-bezier(.76,-.245,.24,1.245)!important;animation-timing-function:cubic-bezier(.76,-.245,.24,1.245)!important}.short-delay{transition-delay:.3s!important;-webkit-animation-delay:.3s!important;animation-delay:.3s!important}.long-delay{transition-delay:.7s!important;-webkit-animation-delay:.7s!important;animation-delay:.7s!important}.shake{-webkit-animation-name:shake-7;animation-name:shake-7}@-webkit-keyframes shake-7{0%,10%,20%,30%,40%,50%,60%,70%,80%,90%{-webkit-transform:translateX(7%);transform:translateX(7%)}15%,25%,35%,45%,5%,55%,65%,75%,85%,95%{-webkit-transform:translateX(-7%);transform:translateX(-7%)}}@keyframes shake-7{0%,10%,20%,30%,40%,50%,60%,70%,80%,90%{-webkit-transform:translateX(7%);transform:translateX(7%)}15%,25%,35%,45%,5%,55%,65%,75%,85%,95%{-webkit-transform:translateX(-7%);transform:translateX(-7%)}}.spin-cw{-webkit-animation-name:spin-cw-1turn;animation-name:spin-cw-1turn}@-webkit-keyframes spin-cw-1turn{0%{-webkit-transform:rotate(-1turn);transform:rotate(-1turn)}100%{-webkit-transform:rotate(0);transform:rotate(0)}}.spin-ccw{-webkit-animation-name:spin-cw-1turn;animation-name:spin-cw-1turn}@keyframes spin-cw-1turn{0%,100%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.wiggle{-webkit-animation-name:wiggle-7deg;animation-name:wiggle-7deg}@-webkit-keyframes wiggle-7deg{40%,50%,60%{-webkit-transform:rotate(7deg);transform:rotate(7deg)}35%,45%,55%,65%{-webkit-transform:rotate(-7deg);transform:rotate(-7deg)}0%,100%,30%,70%{-webkit-transform:rotate(0);transform:rotate(0)}}@keyframes wiggle-7deg{40%,50%,60%{-webkit-transform:rotate(7deg);transform:rotate(7deg)}35%,45%,55%,65%{-webkit-transform:rotate(-7deg);transform:rotate(-7deg)}0%,100%,30%,70%{-webkit-transform:rotate(0);transform:rotate(0)}}.shake,.spin-ccw,.spin-cw,.wiggle{-webkit-animation-duration:.5s;animation-duration:.5s}.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.slow{-webkit-animation-duration:750ms!important;animation-duration:750ms!important}.fast{transition-duration:250ms!important;-webkit-animation-duration:250ms!important;animation-duration:250ms!important} |