Dependencies updated

- Symfony, UIkit, JS libraries and etc. - Fixed styles (UIkit 3.5)
uatrend · Jun 17, 2020 · fe1fa1f · fe1fa1f
1 parent d675e05
commit fe1fa1f
Show file tree

Hide file tree

Showing 35 changed files with 1,282 additions and 742 deletions.
diff --git a/README.md b/README.md
@@ -11,10 +11,9 @@
 
 # Pagekit
 
-[![Symfony](https://img.shields.io/badge/symfony-5.0.8-blue)](https://github.com/symfony/symfony)
-[![Vue](https://img.shields.io/badge/vue-2.6.11-lightgreen)](https://github.com/vuejs/vue)
-[![UIkit](https://img.shields.io/badge/uikit-3.4.6-blue)](https://github.com/uikit/uikit)
-[![Build Status](https://travis-ci.org/uatrend/pagekit.svg?branch=develop)](https://travis-ci.org/uatrend/pagekit)
+[![Symfony](https://img.shields.io/badge/symfony-5.1.2-blue)](https://github.com/symfony/symfony)
+[![Vue](https://img.shields.io/badge/vue-2.6.11-green)](https://github.com/vuejs/vue)
+[![UIkit](https://img.shields.io/badge/uikit-3.5.4-blue)](https://github.com/uikit/uikit)
 [![Discord](https://img.shields.io/badge/chat-on%20discord-7289da.svg)](https://discord.gg/e7Kw47E)
 
 [Homepage](http://pagekit.com) - Official home page.

diff --git a/app/system/modules/theme/less/components/accordion.less b/app/system/modules/theme/less/components/accordion.less
@@ -69,22 +69,11 @@
  ========================================================================== */
 
 .uk-accordion-content {
+    display: flow-root;
     margin-top: @accordion-content-margin-top;
     .hook-accordion-content;
 }
 
-/*
- * Micro clearfix
- */
-
-.uk-accordion-content::before,
-.uk-accordion-content::after {
-    content: "";
-    display: table;
-}
-
-.uk-accordion-content::after { clear: both; }
-
 /*
  * Remove margin from the last-child
  */

diff --git a/app/system/modules/theme/less/components/article.less b/app/system/modules/theme/less/components/article.less
@@ -14,7 +14,7 @@
 
 @article-margin-top:                            @global-large-margin;
 
-@article-title-font-size-m:                     @global-xxlarge-font-size;
+@article-title-font-size-m:                     @global-2xlarge-font-size;
 @article-title-font-size:                       @article-title-font-size-m * 0.85;
 @article-title-line-height:                     1.2;
 
@@ -28,21 +28,10 @@
  ========================================================================== */
 
 .uk-article {
+    display: flow-root;
     .hook-article;
 }
 
-/*
- * Micro clearfix
- */
-
-.uk-article::before,
-.uk-article::after {
-    content: "";
-    display: table;
-}
-
-.uk-article::after { clear: both; }
-
 /*
  * Remove margin from the last-child
  */

diff --git a/app/system/modules/theme/less/components/base.less b/app/system/modules/theme/less/components/base.less
@@ -42,7 +42,7 @@
 @base-heading-color:                            @global-emphasis-color;
 @base-heading-text-transform:                   none;
 @base-heading-margin-top:                       @global-medium-margin;
-@base-h1-font-size-m:                           @global-xxlarge-font-size;
+@base-h1-font-size-m:                           @global-2xlarge-font-size;
 @base-h1-font-size:                             @base-h1-font-size-m * 0.85;
 @base-h1-line-height:                           1.2;
 @base-h2-font-size-m:                           @global-xlarge-font-size;
@@ -115,12 +115,6 @@ body { margin: 0; }
 /* Links
  ========================================================================== */
 
-/*
- * Remove gaps in links underline in iOS 8+ and Safari 8+.
- */
-
-a { -webkit-text-decoration-skip: objects; }
-
 /*
  * Remove the outline on focused links when they are also active or hovered
  */
@@ -154,14 +148,13 @@ a:hover,
  ========================================================================== */
 
 /*
- * 1. Add an underline text decoration in Safari, Edge and IE.
- * 2. Add `dotted` style in Safari.
- * Note: The shorthand declaration `underline dotted` is not supported in Safari, Edge and IE.
+ * 1. Add the correct text decoration in Edge.
+ * 2. The shorthand declaration `underline dotted` is not supported in Safari.
  */
 
 abbr[title] {
     /* 1 */
-    text-decoration: underline;
+    text-decoration: underline dotted;
     /* 2 */
     -webkit-text-decoration-style: dotted;
 }
@@ -295,11 +288,17 @@ video {
 svg:not(:root) { overflow: hidden; }
 
 /*
- * Hide `alt` text for lazy load images
- * Selector for background while loading img[data-src*='.jpg'][src*='data:image'] { background: grey; }
+ * 1. Fix lazy loading images if parent element is set to `display: inline` and has `overflow: hidden`.
+ * 2. Hide `alt` text for lazy loading images.
+ * Note: Selector for background while loading img[data-src*='.jpg'][src*='data:image'] { background: grey; }
  */
 
-img:not([src]) { visibility: hidden; }
+img:not([src]) {
+    /* 1 */
+    min-width: 1px;
+    /* 2 */
+    visibility: hidden;
+}
 
 /*
  * Iframe
@@ -447,21 +446,17 @@ dd { margin-left: 0; }
  ========================================================================== */
 
 /*
- * 1. Add the correct box sizing and height in Firefox.
- * 2. Show the overflow in Edge and IE.
- * 3. Add the correct text-align in Edge and IE.
- * 4. Style
+ * 1. Show the overflow in Chrome, Edge and IE.
+ * 2. Add the correct text-align in Edge and IE.
+ * 3. Style
  */
 
 hr, .uk-hr {
     /* 1 */
-    box-sizing: content-box;
-    height: 0;
-    /* 2 */
     overflow: visible;
-    /* 3 */
+    /* 2 */
     text-align: inherit;
-    /* 4 */
+    /* 3 */
     margin: 0 0 @base-hr-margin-vertical 0;
     border: 0;
     border-top: @base-hr-border-width solid @base-hr-border;

diff --git a/app/system/modules/theme/less/components/breadcrumb.less b/app/system/modules/theme/less/components/breadcrumb.less
@@ -19,6 +19,7 @@
 
 @breadcrumb-divider:                                "/";
 @breadcrumb-divider-margin-horizontal:              20px;
+@breadcrumb-divider-font-size:                      @breadcrumb-item-font-size;
 @breadcrumb-divider-color:                          @global-muted-color;
 
 
@@ -72,7 +73,8 @@
 }
 
 /* Active */
-.uk-breadcrumb > :last-child > * {
+.uk-breadcrumb > :last-child > span,
+.uk-breadcrumb > :last-child > a:not([href]) {
     color: @breadcrumb-item-active-color;
     .hook-breadcrumb-item-active;
 }
@@ -86,6 +88,7 @@
     content: @breadcrumb-divider;
     display: inline-block;
     margin: 0 @breadcrumb-divider-margin-horizontal;
+    font-size: @breadcrumb-divider-font-size;
     color: @breadcrumb-divider-color;
     .hook-breadcrumb-divider;
 }

diff --git a/app/system/modules/theme/less/components/button.less b/app/system/modules/theme/less/components/button.less
@@ -87,11 +87,12 @@
  * 3. Address `overflow` set to `hidden` in IE.
  * 4. Correct `font` properties and `color` not being inherited for `button`.
  * 5. Remove the inheritance of text transform in Edge, Firefox, and IE.
- * 6. Style
- * 7. `line-height` is used to create a height because it also centers the text vertically for `a` elements.
+ * 6. Remove default style for `input type="submit"`in iOS.
+ * 7. Style
+ * 8. `line-height` is used to create a height because it also centers the text vertically for `a` elements.
  *    Better would be to use height and flexbox to center the text vertically but flexbox doesn't work in Firefox on `button` elements.
- * 8. Align text if button has a width
- * 9. Required for `a`.
+ * 9. Align text if button has a width
+ * 10. Required for `a`.
  */
 
 .uk-button {
@@ -107,16 +108,19 @@
     /* 5 */
     text-transform: none;
     /* 6 */
+    -webkit-appearance: none;
+    border-radius: 0;
+    /* 7 */
     display: inline-block;
     box-sizing: border-box;
     padding: 0 @button-padding-horizontal;
     vertical-align: middle;
     font-size: @button-font-size;
-    /* 7 */
-    line-height: @button-line-height;
     /* 8 */
-    text-align: center;
+    line-height: @button-line-height;
     /* 9 */
+    text-align: center;
+    /* 10 */
     text-decoration: none;
     .hook-button;
 }

diff --git a/app/system/modules/theme/less/components/card.less b/app/system/modules/theme/less/components/card.less
@@ -98,16 +98,19 @@
  ========================================================================== */
 
 .uk-card-body {
+    display: flow-root;
     padding: @card-body-padding-vertical @card-body-padding-horizontal;
     .hook-card-body;
 }
 
 .uk-card-header {
+    display: flow-root;
     padding: @card-header-padding-vertical @card-header-padding-horizontal;
     .hook-card-header;
 }
 
 .uk-card-footer {
+    display: flow-root;
     padding: @card-footer-padding-vertical @card-footer-padding-horizontal;
     .hook-card-footer;
 }
@@ -123,24 +126,6 @@
 
 }
 
-/*
- * Micro clearfix
- */
-
-.uk-card-body::before,
-.uk-card-body::after,
-.uk-card-header::before,
-.uk-card-header::after,
-.uk-card-footer::before,
-.uk-card-footer::after {
-    content: "";
-    display: table;
-}
-
-.uk-card-body::after,
-.uk-card-header::after,
-.uk-card-footer::after { clear: both; }
-
 /*
  * Remove margin from the last-child
  */

diff --git a/app/system/modules/theme/less/components/comment.less b/app/system/modules/theme/less/components/comment.less
@@ -45,31 +45,18 @@
  ========================================================================== */
 
 .uk-comment-body {
+    display: flow-root;
     overflow-wrap: break-word;
     word-wrap: break-word;
     .hook-comment-body;
 }
 
 .uk-comment-header {
+    display: flow-root;
     margin-bottom: @comment-header-margin-bottom;
     .hook-comment-header;
 }
 
-/*
- * Micro clearfix
- */
-
-.uk-comment-body::before,
-.uk-comment-body::after,
-.uk-comment-header::before,
-.uk-comment-header::after {
-    content: "";
-    display: table;
-}
-
-.uk-comment-body::after,
-.uk-comment-header::after { clear: both; }
-
 /*
  * Remove margin from the last-child
  */

diff --git a/app/system/modules/theme/less/components/container.less b/app/system/modules/theme/less/components/container.less
@@ -20,7 +20,8 @@
 @container-max-width:                   1200px;
 @container-xsmall-max-width:            750px;
 @container-small-max-width:             900px;
-@container-large-max-width:             1600px;
+@container-large-max-width:             1400px;
+@container-xlarge-max-width:            1600px;
 
 @container-padding-horizontal:          15px;
 @container-padding-horizontal-s:        @global-gutter;
@@ -37,6 +38,7 @@
  */
 
 .uk-container {
+    display: flow-root;
     /* 1 */
     box-sizing: content-box;
     max-width: @container-max-width;
@@ -66,18 +68,6 @@
 
 }
 
-/*
- * Micro clearfix
- */
-
-.uk-container::before,
-.uk-container::after {
-    content: "";
-    display: table;
-}
-
-.uk-container::after { clear: both; }
-
 /*
  * Remove margin from the last-child
  */
@@ -103,6 +93,8 @@
 
 .uk-container-large { max-width: @container-large-max-width; }
 
+.uk-container-xlarge { max-width: @container-xlarge-max-width; }
+
 .uk-container-expand { max-width: none; }
 
 
@@ -142,6 +134,9 @@
     .uk-container-expand-left.uk-container-large,
     .uk-container-expand-right.uk-container-large { max-width: ~'calc(50% + (@{container-large-max-width} / 2) - @{container-padding-horizontal-m})'; }
 
+    .uk-container-expand-left.uk-container-xlarge,
+    .uk-container-expand-right.uk-container-xlarge { max-width: ~'calc(50% + (@{container-xlarge-max-width} / 2) - @{container-padding-horizontal-m})'; }
+
 }