uikit 3.25.17-dev.80dfe87 → 3.25.17-dev.8c70e44

package/src/scss/components/marquee.scss

@@ -0,0 +1,136 @@
+@use "sass:meta";
+@use "sass:string";
+
+// Name:            Marquee
+// Description:     Component to create scrolling areas
+//
+// Component:       `uk-marquee`
+//
+// Sub-objects:     `uk-marquee-items`
+//
+// Modifiers:       `uk-marquee-vertical`
+//                  `uk-marquee-fade`
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+/* ========================================================================
+   Component: Marquee
+ ========================================================================== */
+
+/*
+ * 1. Fallback for Safari 15 and older
+ * 2. Clip child elements
+ *    `clip` prevents accidental scrolling through elements in slide getting focused
+ *    `clip` also works in only one direction
+ * 3. Prevent tab highlighting on iOS.
+ */
+
+.uk-marquee {
+    /* 1 */
+    overflow-x: hidden;
+    /* 2 */
+    overflow-x: clip;
+    /* 3 */
+    -webkit-tap-highlight-color: transparent;
+    @if(meta.mixin-exists(hook-marquee)) {@include hook-marquee();}
+}
+
+.uk-marquee-vertical {
+    overflow: visible;
+    overflow-y: hidden;
+    overflow-y: clip;
+}
+
+/*
+ * Fade out
+ */
+
+.uk-marquee-fade {
+    --uk-overflow-fade-size: 100px;
+    --uk-overflow-fade-direction: right;
+}
+.uk-marquee-fade.uk-marquee-vertical { --uk-overflow-fade-direction: bottom; }
+
+.uk-marquee-fade {
+    mask-image: linear-gradient(
+        to var(--uk-overflow-fade-direction),
+        rgba(0, 0, 0, var(--uk-overflow-fade-start-opacity)),
+        #000 var(--uk-overflow-fade-size),
+        #000 string.unquote('calc(100% - var(--uk-overflow-fade-size))'),
+        rgba(0, 0, 0, var(--uk-overflow-fade-end-opacity))
+    );
+}
+
+
+/* Items
+ ========================================================================== */
+
+/*
+ * 1. Create a containing block.
+ */
+
+.uk-marquee-items {
+    /* 1 */
+    position: relative;
+}
+
+/*
+ * 1. Reset list style without interfering with grid
+ * 2. Prevent displaying the callout information on iOS.
+ */
+
+.uk-marquee:not(.uk-marquee-vertical) .uk-marquee-items:not(.uk-grid) {
+    display: flex;
+    /* 1 */
+    margin: 0;
+    padding: 0;
+    list-style: none;
+    /* 2 */
+    -webkit-touch-callout: none;
+}
+
+.uk-marquee:not(.uk-marquee-vertical) .uk-marquee-items.uk-grid { flex-wrap: nowrap; }
+
+
+/* Item
+ ========================================================================== */
+
+/*
+ * 1. Let items take content dimensions (0 0 auto)
+ *    `max-width` needed to keep image responsiveness and prevent content overflow
+ * 2. Create position context
+ * 3. Create animation along offset-path
+ */
+
+.uk-marquee-items > * {
+    /* 1 */
+    flex: none !important;
+    box-sizing: border-box;
+    max-width: 100%;
+    /* 2 */
+    position: relative;
+    /* 3 */
+    offset-anchor: 0 0;
+    offset-rotate: 0deg;
+    offset-path: path(var(--uk-marquee-path));
+    animation: var(--uk-marquee-duration) linear calc(var(--uk-marquee-start) / -100 * var(--uk-marquee-duration)) infinite var(--uk-marquee-direction) uk-marquee;
+}
+
+@keyframes uk-marquee {
+    0% { offset-distance: 0; }
+    100% { offset-distance: 100%; }
+}
+
+
+// Hooks
+// ========================================================================
+
+@if(meta.mixin-exists(hook-marquee-misc)) {@include hook-marquee-misc();}
+
+// @mixin hook-marquee(){}
+// @mixin hook-marquee-misc(){}

package/src/scss/components/nav.scss

@@ -80,7 +80,7 @@ $nav-xlarge-font-size-l:                         8rem !default; // 128px
     align-items: center;
     /* 2 */
     column-gap: 0.25em;
-    /* 3*/
+    /* 3 */
     text-decoration: none;
 }
 

package/src/scss/components/padding.scss

@@ -53,20 +53,20 @@
 /* Remove
  ========================================================================== */
 
-.uk-padding-remove { padding: 0 !important; }
-.uk-padding-remove-top { padding-top: 0 !important; }
-.uk-padding-remove-bottom { padding-bottom: 0 !important; }
-.uk-padding-remove-left { padding-left: 0 !important; }
-.uk-padding-remove-right { padding-right: 0 !important; }
+.uk-padding-remove { padding: 0; }
+.uk-padding-remove-top { padding-top: 0; }
+.uk-padding-remove-bottom { padding-bottom: 0; }
+.uk-padding-remove-left { padding-left: 0; }
+.uk-padding-remove-right { padding-right: 0; }
 
 .uk-padding-remove-vertical {
-    padding-top: 0 !important;
-    padding-bottom: 0 !important;
+    padding-top: 0;
+    padding-bottom: 0;
 }
 
 .uk-padding-remove-horizontal {
-    padding-left: 0 !important;
-    padding-right: 0 !important;
+    padding-left: 0;
+    padding-right: 0;
 }
 
 

package/src/scss/components/utility.scss

@@ -16,9 +16,6 @@
 //                  `uk-object-*`
 //                  `uk-border-*`
 //                  `uk-box-shadow-*`
-//                  `uk-box-shadow-bottom`
-//                  `uk-dropcap`
-//                  `uk-logo`
 //                  `uk-blend-*`
 //                  `uk-transform-*`
 //                  `uk-transform-origin-*`
@@ -41,8 +38,6 @@
 
 
 
-
-
 /* ========================================================================
    Component: Utility
  ========================================================================== */
@@ -351,114 +346,6 @@
 .uk-box-shadow-hover-xlarge:hover { box-shadow: $global-xlarge-box-shadow; }
 
 
-/* Box-shadow bottom
- ========================================================================== */
-
-/*
- * 1. Set position.
- * 2. Set style
- * 3. Fix shadow being clipped in Safari if container is animated
- */
-
-@supports (filter: blur(0)) {
-
-    .uk-box-shadow-bottom {
-        display: inline-block;
-        position: relative;
-        z-index: 0;
-        max-width: 100%;
-        vertical-align: middle;
-    }
-
-    .uk-box-shadow-bottom::after {
-        content: "";
-        /* 1 */
-        position: absolute;
-        bottom: $box-shadow-bottom-bottom;
-        left: 0;
-        right: 0;
-        z-index: -1;
-        /* 2 */
-        height: $box-shadow-bottom-height;
-        border-radius: $box-shadow-bottom-border-radius;
-        background: $box-shadow-bottom-background;
-        filter: blur($box-shadow-bottom-blur);
-        /* 3 */
-        will-change: filter;
-        @if(meta.mixin-exists(hook-box-shadow-bottom)) {@include hook-box-shadow-bottom();}
-    }
-
-}
-
-
-/* Drop cap
- ========================================================================== */
-
-/*
- * 1. Firefox doesn't apply `::first-letter` if the first letter is inside child elements
- *    https://bugzilla.mozilla.org/show_bug.cgi?id=214004
- * 2. In Firefox, a floating `::first-letter` doesn't have a line box and there for no `line-height`
- *    https://bugzilla.mozilla.org/show_bug.cgi?id=317933
- */
-
-.uk-dropcap::first-letter,
-/* 1 */
-.uk-dropcap > p:first-of-type::first-letter {
-    display: block;
-    margin-right: $dropcap-margin-right;
-    float: left;
-    font-size: $dropcap-font-size;
-    line-height: $dropcap-line-height;
-    @if(meta.mixin-exists(hook-dropcap)) {@include hook-dropcap();}
-}
-
-/* 2 */
-@-moz-document url-prefix() {
-
-  .uk-dropcap::first-letter,
-  .uk-dropcap > p:first-of-type::first-letter { margin-top: 1.1%; }
-
-}
-
-
-/* Logo
- ========================================================================== */
-
-/*
- * 1. Style
- * 2. Required for `a`
- * 3. Behave like image but can be overridden through flex utility classes
- */
-
-.uk-logo {
-    /* 1 */
-    font-size: $logo-font-size;
-    font-family: $logo-font-family;
-    color: $logo-color;
-    /* 2 */
-    text-decoration: none;
-    @if(meta.mixin-exists(hook-logo)) {@include hook-logo();}
-}
-
-/* 3 */
-:where(.uk-logo) {
-    display: inline-block;
-    vertical-align: middle;
-}
-
-/* Hover */
-.uk-logo:hover {
-    color: $logo-hover-color;
-    /* 1 */
-    text-decoration: none;
-    @if(meta.mixin-exists(hook-logo-hover)) {@include hook-logo-hover();}
-}
-
-.uk-logo :where(img, svg, video) { display: block; }
-
-.uk-logo-inverse { display: none; }
-
-
 /* Disabled State
  ========================================================================== */
 
@@ -536,19 +423,4 @@
 @if(meta.mixin-exists(hook-utility-misc)) {@include hook-utility-misc();}
 
 // @mixin hook-panel-scrollable(){}
-// @mixin hook-box-shadow-bottom(){}
-// @mixin hook-dropcap(){}
-// @mixin hook-logo(){}
-// @mixin hook-logo-hover(){}
 // @mixin hook-utility-misc(){}
-
-
-// Inverse
-// ========================================================================
-
-
-
-
-// @mixin hook-inverse-dropcap(){}
-// @mixin hook-inverse-logo(){}
-// @mixin hook-inverse-logo-hover(){}

package/src/scss/mixins-theme.scss

@@ -824,6 +824,20 @@
 @mixin hook-dropbar-left(){ box-shadow: $dropbar-left-box-shadow; }
 @mixin hook-dropbar-right(){ box-shadow: $dropbar-right-box-shadow; }
 @mixin hook-dropbar-misc(){}
+@mixin hook-dropcap(){
+    // Prevent line wrap
+    margin-bottom: -2px;
+}
+@mixin hook-dropcap-misc(){}
+@mixin hook-inverse-dropcap(){}
+@mixin hook-inverse-component-dropcap(){
+
+    .uk-dropcap::first-letter,
+    .uk-dropcap p:first-of-type::first-letter {
+        @if(meta.mixin-exists(hook-inverse-dropcap)) {@include hook-inverse-dropcap();}
+    }
+
+}
 @mixin hook-dropdown(){ box-shadow: $dropdown-box-shadow; }
 @mixin hook-dropdown-dropbar(){ box-shadow: none; }
 @mixin hook-dropdown-dropbar-large(){}
@@ -836,6 +850,8 @@
 @mixin hook-dropdown-misc(){}
 @mixin hook-dropnav-misc(){}
 @mixin hook-flex-misc(){}
+@mixin hook-floating-shadow(){}
+@mixin hook-floating-shadow-misc(){}
 @mixin hook-form-range(){}
 @mixin hook-form-range-track(){ border-radius: $form-range-track-border-radius; }
 @mixin hook-form-range-track-focus(){}
@@ -1325,6 +1341,27 @@
 
     .uk-list-striped > :nth-of-type(odd) { background-color: $inverse-list-striped-background; }
 
+}
+@mixin hook-logo(){}
+@mixin hook-logo-hover(){}
+@mixin hook-logo-misc(){}
+@mixin hook-inverse-logo(){}
+@mixin hook-inverse-logo-hover(){}
+@mixin hook-inverse-component-logo(){
+
+    .uk-logo {
+        color: $inverse-logo-color;
+        @if(meta.mixin-exists(hook-inverse-logo)) {@include hook-inverse-logo();}
+    }
+
+    .uk-logo:hover {
+        color: $inverse-logo-hover-color;
+        @if(meta.mixin-exists(hook-inverse-logo-hover)) {@include hook-inverse-logo-hover();}
+    }
+
+    .uk-logo:has(.uk-logo-inverse) > :not(picture:has(.uk-logo-inverse:not([uk-svg]))):not(.uk-logo-inverse):not([uk-svg]) { display: none; }
+    .uk-logo-inverse:not([uk-svg]) { display: block; }
+
 }
 @mixin hook-margin-misc(){}
 @mixin hook-marker(){
@@ -1348,6 +1385,8 @@
     }
 
 }
+@mixin hook-marquee(){}
+@mixin hook-marquee-misc(){}
 @mixin hook-modal(){}
 @mixin hook-modal-dialog(){}
 @mixin hook-modal-full(){}
@@ -2241,38 +2280,7 @@
 }
 @mixin hook-transition-misc(){}
 @mixin hook-panel-scrollable(){}
-@mixin hook-box-shadow-bottom(){}
-@mixin hook-dropcap(){
-    // Prevent line wrap
-    margin-bottom: -2px;
-}
-@mixin hook-logo(){}
-@mixin hook-logo-hover(){}
 @mixin hook-utility-misc(){}
-@mixin hook-inverse-dropcap(){}
-@mixin hook-inverse-logo(){}
-@mixin hook-inverse-logo-hover(){}
-@mixin hook-inverse-component-utility(){
-
-    .uk-dropcap::first-letter,
-    .uk-dropcap p:first-of-type::first-letter {
-        @if(meta.mixin-exists(hook-inverse-dropcap)) {@include hook-inverse-dropcap();}
-    }
-
-    .uk-logo {
-        color: $inverse-logo-color;
-        @if(meta.mixin-exists(hook-inverse-logo)) {@include hook-inverse-logo();}
-    }
-
-    .uk-logo:hover {
-        color: $inverse-logo-hover-color;
-        @if(meta.mixin-exists(hook-inverse-logo-hover)) {@include hook-inverse-logo-hover();}
-    }
-
-    .uk-logo:has(.uk-logo-inverse) > :not(picture:has(.uk-logo-inverse)):not(.uk-logo-inverse) { display: none; }
-    .uk-logo-inverse { display: block; }
-
-}
 @mixin hook-visibility-misc(){}
 @mixin hook-width-misc(){}
 @mixin hook-inverse() {
@@ -2288,6 +2296,7 @@
     @include hook-inverse-component-countdown();
     @include hook-inverse-component-divider();
     @include hook-inverse-component-dotnav();
+    @include hook-inverse-component-dropcap();
     @include hook-inverse-component-form-range();
     @include hook-inverse-component-form();
     @include hook-inverse-component-grid();
@@ -2298,6 +2307,7 @@
     @include hook-inverse-component-leader();
     @include hook-inverse-component-link();
     @include hook-inverse-component-list();
+    @include hook-inverse-component-logo();
     @include hook-inverse-component-marker();
     @include hook-inverse-component-nav();
     @include hook-inverse-component-navbar();
@@ -2310,5 +2320,4 @@
     @include hook-inverse-component-text();
     @include hook-inverse-component-thumbnav();
     @include hook-inverse-component-totop();
-    @include hook-inverse-component-utility();
 }

package/src/scss/mixins.scss

@@ -604,6 +604,17 @@
 @mixin hook-dropbar-left(){}
 @mixin hook-dropbar-right(){}
 @mixin hook-dropbar-misc(){}
+@mixin hook-dropcap(){}
+@mixin hook-dropcap-misc(){}
+@mixin hook-inverse-dropcap(){}
+@mixin hook-inverse-component-dropcap(){
+
+    .uk-dropcap::first-letter,
+    .uk-dropcap p:first-of-type::first-letter {
+        @if(meta.mixin-exists(hook-inverse-dropcap)) {@include hook-inverse-dropcap();}
+    }
+
+}
 @mixin hook-dropdown(){}
 @mixin hook-dropdown-dropbar(){}
 @mixin hook-dropdown-dropbar-large(){}
@@ -616,6 +627,8 @@
 @mixin hook-dropdown-misc(){}
 @mixin hook-dropnav-misc(){}
 @mixin hook-flex-misc(){}
+@mixin hook-floating-shadow(){}
+@mixin hook-floating-shadow-misc(){}
 @mixin hook-form-range(){}
 @mixin hook-form-range-track(){}
 @mixin hook-form-range-track-focus(){}
@@ -1064,6 +1077,27 @@
 
     .uk-list-striped > :nth-of-type(odd) { background-color: $inverse-list-striped-background; }
 
+}
+@mixin hook-logo(){}
+@mixin hook-logo-hover(){}
+@mixin hook-logo-misc(){}
+@mixin hook-inverse-logo(){}
+@mixin hook-inverse-logo-hover(){}
+@mixin hook-inverse-component-logo(){
+
+    .uk-logo {
+        color: $inverse-logo-color;
+        @if(meta.mixin-exists(hook-inverse-logo)) {@include hook-inverse-logo();}
+    }
+
+    .uk-logo:hover {
+        color: $inverse-logo-hover-color;
+        @if(meta.mixin-exists(hook-inverse-logo-hover)) {@include hook-inverse-logo-hover();}
+    }
+
+    .uk-logo:has(.uk-logo-inverse) > :not(picture:has(.uk-logo-inverse:not([uk-svg]))):not(.uk-logo-inverse):not([uk-svg]) { display: none; }
+    .uk-logo-inverse:not([uk-svg]) { display: block; }
+
 }
 @mixin hook-margin-misc(){}
 @mixin hook-marker(){}
@@ -1085,6 +1119,8 @@
     }
 
 }
+@mixin hook-marquee(){}
+@mixin hook-marquee-misc(){}
 @mixin hook-modal(){}
 @mixin hook-modal-dialog(){}
 @mixin hook-modal-full(){}
@@ -1849,35 +1885,7 @@
 }
 @mixin hook-transition-misc(){}
 @mixin hook-panel-scrollable(){}
-@mixin hook-box-shadow-bottom(){}
-@mixin hook-dropcap(){}
-@mixin hook-logo(){}
-@mixin hook-logo-hover(){}
 @mixin hook-utility-misc(){}
-@mixin hook-inverse-dropcap(){}
-@mixin hook-inverse-logo(){}
-@mixin hook-inverse-logo-hover(){}
-@mixin hook-inverse-component-utility(){
-
-    .uk-dropcap::first-letter,
-    .uk-dropcap p:first-of-type::first-letter {
-        @if(meta.mixin-exists(hook-inverse-dropcap)) {@include hook-inverse-dropcap();}
-    }
-
-    .uk-logo {
-        color: $inverse-logo-color;
-        @if(meta.mixin-exists(hook-inverse-logo)) {@include hook-inverse-logo();}
-    }
-
-    .uk-logo:hover {
-        color: $inverse-logo-hover-color;
-        @if(meta.mixin-exists(hook-inverse-logo-hover)) {@include hook-inverse-logo-hover();}
-    }
-
-    .uk-logo:has(.uk-logo-inverse) > :not(picture:has(.uk-logo-inverse)):not(.uk-logo-inverse) { display: none; }
-    .uk-logo-inverse { display: block; }
-
-}
 @mixin hook-visibility-misc(){}
 @mixin hook-width-misc(){}
 @mixin hook-inverse() {
@@ -1893,6 +1901,7 @@
     @include hook-inverse-component-countdown();
     @include hook-inverse-component-divider();
     @include hook-inverse-component-dotnav();
+    @include hook-inverse-component-dropcap();
     @include hook-inverse-component-form-range();
     @include hook-inverse-component-form();
     @include hook-inverse-component-grid();
@@ -1903,6 +1912,7 @@
     @include hook-inverse-component-leader();
     @include hook-inverse-component-link();
     @include hook-inverse-component-list();
+    @include hook-inverse-component-logo();
     @include hook-inverse-component-marker();
     @include hook-inverse-component-nav();
     @include hook-inverse-component-navbar();
@@ -1915,5 +1925,4 @@
     @include hook-inverse-component-text();
     @include hook-inverse-component-thumbnav();
     @include hook-inverse-component-totop();
-    @include hook-inverse-component-utility();
 }

package/src/scss/variables-theme.scss

@@ -387,6 +387,9 @@ $dropbar-color-mode: dark !default;
 $dropbar-focus-outline: $base-focus-outline !default;
 $dropbar-large-padding-top: 40px !default;
 $dropbar-large-padding-bottom: $dropbar-large-padding-top !default;
+$dropcap-margin-right: 10px !default;
+$dropcap-font-size: (($global-line-height * 3) * 1em) !default;
+$dropcap-line-height: 1 !default;
 $dropdown-margin: $global-small-margin !default;
 $dropdown-viewport-margin: 15px !default;
 $dropdown-min-width: 200px !default;
@@ -413,6 +416,11 @@ $dropdown-nav-divider-border: $global-border !default;
 $dropdown-nav-sublist-item-color: $global-muted-color !default;
 $dropdown-nav-sublist-item-hover-color: $global-color !default;
 $dropnav-dropbar-z-index: $global-z-index - 20 !default;
+$floating-shadow-height: 30px !default;
+$floating-shadow-bottom: (-$floating-shadow-height) !default;
+$floating-shadow-border-radius: 100% !default;
+$floating-shadow-background: #444 !default;
+$floating-shadow-blur: 20px !default;
 $form-range-track-height: 3px !default;
 $form-range-track-background: color.adjust($global-muted-background, $lightness: -5%) !default;
 $form-range-track-focus-background: color.adjust($form-range-track-background, $lightness: -5%) !default;
@@ -655,6 +663,12 @@ $inverse-list-secondary-color: $inverse-global-primary-background !default;
 $inverse-list-divider-border: $inverse-global-border !default;
 $inverse-list-striped-background: $inverse-global-muted-background !default;
 $inverse-list-bullet-icon-color: $inverse-global-color !default;
+$logo-font-size: $global-large-font-size !default;
+$logo-font-family: $global-font-family !default;
+$logo-color: $global-emphasis-color !default;
+$logo-hover-color: $global-emphasis-color !default;
+$inverse-logo-color: $inverse-global-emphasis-color !default;
+$inverse-logo-hover-color: $inverse-global-emphasis-color !default;
 $margin-margin: $global-margin !default;
 $margin-xsmall-margin: 5px !default;
 $margin-small-margin: $global-small-margin !default;
@@ -1163,16 +1177,7 @@ $box-shadow-bottom-bottom: (-$box-shadow-bottom-height) !default;
 $box-shadow-bottom-border-radius: 100% !default;
 $box-shadow-bottom-background: #444 !default;
 $box-shadow-bottom-blur: 20px !default;
-$dropcap-margin-right: 10px !default;
-$dropcap-font-size: (($global-line-height * 3) * 1em) !default;
-$dropcap-line-height: 1 !default;
-$logo-font-size: $global-large-font-size !default;
-$logo-font-family: $global-font-family !default;
-$logo-color: $global-emphasis-color !default;
-$logo-hover-color: $global-emphasis-color !default;
 $dragover-box-shadow: 0 0 20px rgba(100,100,100,0.3) !default;
-$inverse-logo-color: $inverse-global-emphasis-color !default;
-$inverse-logo-hover-color: $inverse-global-emphasis-color !default;
 $deprecated: false !default;
 $breakpoint-small: 640px !default;
 $breakpoint-medium: 960px !default;

package/src/scss/variables.scss

@@ -386,6 +386,9 @@ $dropbar-color-mode: dark !default;
 $dropbar-focus-outline: $base-focus-outline !default;
 $dropbar-large-padding-top: 40px !default;
 $dropbar-large-padding-bottom: $dropbar-large-padding-top !default;
+$dropcap-margin-right: 10px !default;
+$dropcap-font-size: (($global-line-height * 3) * 1em) !default;
+$dropcap-line-height: 1 !default;
 $dropdown-margin: $global-small-margin !default;
 $dropdown-viewport-margin: 15px !default;
 $dropdown-min-width: 200px !default;
@@ -412,6 +415,11 @@ $dropdown-nav-divider-border: $global-border !default;
 $dropdown-nav-sublist-item-color: $global-muted-color !default;
 $dropdown-nav-sublist-item-hover-color: $global-color !default;
 $dropnav-dropbar-z-index: $global-z-index - 20 !default;
+$floating-shadow-height: 30px !default;
+$floating-shadow-bottom: (-$floating-shadow-height) !default;
+$floating-shadow-border-radius: 100% !default;
+$floating-shadow-background: #444 !default;
+$floating-shadow-blur: 20px !default;
 $form-range-track-height: 3px !default;
 $form-range-track-background: color.adjust($global-muted-background, $lightness: -5%) !default;
 $form-range-track-focus-background: color.adjust($form-range-track-background, $lightness: -5%) !default;
@@ -653,6 +661,12 @@ $inverse-list-secondary-color: $inverse-global-primary-background !default;
 $inverse-list-divider-border: $inverse-global-border !default;
 $inverse-list-striped-background: $inverse-global-muted-background !default;
 $inverse-list-bullet-icon-color: $inverse-global-color !default;
+$logo-font-size: $global-large-font-size !default;
+$logo-font-family: $global-font-family !default;
+$logo-color: $global-emphasis-color !default;
+$logo-hover-color: $global-emphasis-color !default;
+$inverse-logo-color: $inverse-global-emphasis-color !default;
+$inverse-logo-hover-color: $inverse-global-emphasis-color !default;
 $margin-margin: $global-margin !default;
 $margin-xsmall-margin: 5px !default;
 $margin-small-margin: $global-small-margin !default;
@@ -1161,16 +1175,7 @@ $box-shadow-bottom-bottom: (-$box-shadow-bottom-height) !default;
 $box-shadow-bottom-border-radius: 100% !default;
 $box-shadow-bottom-background: #444 !default;
 $box-shadow-bottom-blur: 20px !default;
-$dropcap-margin-right: 10px !default;
-$dropcap-font-size: (($global-line-height * 3) * 1em) !default;
-$dropcap-line-height: 1 !default;
-$logo-font-size: $global-large-font-size !default;
-$logo-font-family: $global-font-family !default;
-$logo-color: $global-emphasis-color !default;
-$logo-hover-color: $global-emphasis-color !default;
 $dragover-box-shadow: 0 0 20px rgba(100,100,100,0.3) !default;
-$inverse-logo-color: $inverse-global-emphasis-color !default;
-$inverse-logo-hover-color: $inverse-global-emphasis-color !default;
 $deprecated: false !default;
 $breakpoint-small: 640px !default;
 $breakpoint-medium: 960px !default;