@enigmatry/entry-components 1.15.1-preview.3 → 1.15.1-preview.6

package/header/styles/partials/core/components/buttons/_general.scss

@@ -1,42 +0,0 @@
-@use '../../../../../../styles/modules/variables' as vars;
-@use '../../../../../../styles/modules/typography/fonts' as fonts;
-
-.button, %button {
-	// @include fonts.main-bolded-font(14px);
-	display: inline-block;
-	position: relative;
-	padding: 10px 20px;
-	transition: vars.$default-transition;
-	border: 1px solid transparent;
-	background-color: transparent;
-	color: vars.$font-color-light;
-	line-height: 1.25;
-	text: {
-		align: center;
-		decoration: none;
-	}
-
-	&:disabled {
-		background-color: vars.$disabled;
-		cursor: not-allowed;
-
-		/* stylelint-disable-next-line selector-max-pseudo-class */
-		&:hover {
-			background-color: vars.$disabled;
-		}
-	}
-}
-
-.entry-button-primary, .entry-button-accent {
-	@extend %button;
-}
-
-.action-buttons {
-	.button {
-		margin-left: 12px;
-
-        .first-button {
-            margin-left: 0;
-        }
-	}
-}

package/header/styles/partials/core/components/buttons/_index.scss

@@ -1 +0,0 @@
-@use 'general';

package/header/styles/partials/core/components/headers/_general.scss

@@ -1,9 +0,0 @@
-@use '../../../../../../styles/modules/variables' as vars;
-
-.entry-header {
-	padding: 24px vars.$default-gap;
-
-	.content {
-		padding-top: 20px;
-	}
-}

package/header/styles/partials/core/components/headers/_index.scss

@@ -1 +0,0 @@
-@use 'general';

package/header/styles/partials/core/elements/_index.scss

@@ -1 +0,0 @@
-@use 'headings';

package/header/styles/partials/core/elements/headings.scss

@@ -1,3 +0,0 @@
-h1, h2, h3, h4, h5, h6 {
-	margin: 0;
-}

package/header/styles/partials/core/layouts/_alignment.scss

@@ -1,6 +0,0 @@
-@use '@enigmatry/scss-foundation/src/modules/display/items';
-
-// TODO: remove this once https://jira.enigmatry.com/browse/ETL-480 is done 
-.space-between {
-	@include items.fully-align(center, space-between);
-}

package/header/styles/partials/core/layouts/_index.scss

@@ -1 +0,0 @@
-@use 'alignment';

package/header/styles/partials/main.scss

@@ -1 +0,0 @@
-@use 'core';

package/styles/_generate.scss

@@ -1,15 +0,0 @@
-@use '../dialog/styles/modules/generator' as dialog;
-@use '../dialog/styles/partials/main.scss' as dialogPartials;
-@use '../header/styles/modules/generator' as header;
-@use '../header/styles/partials/main.scss' as headerPartials;
-@use '../toolbar/styles/modules/generate' as toolbar;
-@use '../toolbar/styles/partials/main.scss' as toolbarPartials;
-@use './modules/generate' as modules;
-@use 'sass:map';
-
-@mixin generate($theme, $font-config: null) {
-    @include modules.generate($font-config);
-    @include dialog.generate(map.get($theme, dialog));
-    @include header.generate(map.get($theme, header));
-    @include toolbar.generate(map.get($theme, toolbar));
-}

package/styles/modules/_breakpoints.scss

@@ -1,37 +0,0 @@
-@use 'sass:list';
-@use 'sass:string';
-@use 'sass:map';
-@use './variables' as vars;
-
-@forward '@enigmatry/scss-foundation/src/modules/layout/grid' with (
-	$breakpoints: vars.$breakpoints
-);
-@use '@enigmatry/scss-foundation/src/modules/layout/grid' as breakpoints;
-
-@mixin apply-on-mobile() {
-	@include breakpoints.apply-on(mobile) {
-		@content;
-	}
-}
-
-@mixin apply-on-tablet() {
-	@include breakpoints.apply-on(tablet) {
-		@content;
-	}
-}
-
-@mixin apply-on-desktop() {
-	@include breakpoints.apply-on(desktop) {
-		@content;
-	}
-}
-
-@mixin apply-on-large-desktop() {
-	@include breakpoints.apply-on(largeDesktop) {
-		@content;
-	}
-}
-
-@mixin set-up() {
-	@include breakpoints.set-up();
-}

package/styles/modules/_generate.scss

@@ -1,5 +0,0 @@
-@use './typography/generate' as typography;
-
-@mixin generate($font-config: null) {
-    @include typography.generate($font-config);
-}

package/styles/modules/_variables.scss

@@ -1,22 +0,0 @@
-$breakpoints: ( 
-	mobile: (description: 'sm', size: 480px ), 
-	tablet: (description: 'md', size: 768px ), 
-	desktop: (description: 'lg', size: 992px), 
-	largeDesktop: (description: 'xl', size: 1200px));
-
-$primary: #2581C4;
-$primary-lightest: #DFF1FD;
-
-$accent: #EA518D;
-
-$font-color-default: #323232;
-$font-color-light: #FFF;
-
-$disabled: #D9D9D9;
-
-$font-size-default: 14px;
-
-$default-gap: 16px;
-$large-gap: calc(#{$default-gap} * 2);
-
-$default-transition: .4s;

package/styles/modules/theming/_default-theming.scss

@@ -1,9 +0,0 @@
-@use '../../../dialog/styles/modules/theming/default-theming' as dialogTheme;
-@use '../../../header/styles/modules/theming/default-theming' as headerTheme;
-@use '../../../toolbar/styles/modules/theming/default-theming' as toolbarTheme;
-
-$theme: (
-	header: headerTheme.$theme,
-	dialog: dialogTheme.$theme,
-	toolbar: toolbarTheme.$theme
-);

package/styles/modules/typography/_generate.scss

@@ -1,7 +0,0 @@
-@use './fonts' as font;
-
-@mixin generate($config: null) {
-    @if $config != null {
-        @include font.generate-font-face($config);
-    }
-}

package/toolbar/styles/modules/_generate.scss

@@ -1,10 +0,0 @@
-@use 'sass:map';
-@use 'theming/default-theming' as default;
-@use 'components/toolbar/general' as toolbar;
-
-$default-theme: default.$theme;
-
-@mixin generate($custom-theme: ()) {
-    $merged-theme: map.deep-merge($default-theme, $custom-theme);
-    @include toolbar.generate($merged-theme);
-}

package/toolbar/styles/modules/components/toolbar/_general.scss

@@ -1,34 +0,0 @@
-@use '@enigmatry/scss-foundation/src/modules/map';
-@use '../../../../../styles/modules/variables' as vars;
-@use '../../../../../styles/modules/states/hover' as hover;
-
-@mixin generate($theme) {
-    .entry-toolbar {
-        background-color: map.value-from($theme, 'background');
-
-        .entry-toolbar-nav {
-            height: map.value-from($theme, 'height');
-
-            .entry-toolbar-logo {
-                a {
-                    color: map.value-from($theme, 'title-color');
-                    @include hover.default(
-                        map.value-from($theme, 'title-color'), 
-                        map.value-from($theme, 'title-hover-color'));
-    
-                    img {
-                        height: map.value-from($theme, 'height');
-                    }
-                }
-            }
-
-            .entry-toolbar-nav-toggle {
-                .nav-toggle-menu, .nav-toggle-close {
-                    @include hover.default(
-                        map.value-from($theme, 'title-color'), 
-                        map.value-from($theme, 'title-hover-color'));
-                }
-            }
-        }
-    }
-}

package/toolbar/styles/modules/theming/_default-theming.scss

@@ -1,8 +0,0 @@
-@use '../../../../styles/modules/variables' as vars;
-
-$theme: (
-    background: vars.$primary-lightest,
-    height: 56px,
-    title-color: vars.$primary,
-    title-hover-color: vars.$accent
-);

package/toolbar/styles/partials/core/_index.scss

@@ -1 +0,0 @@
-@use 'components';

package/toolbar/styles/partials/core/components/_index.scss

@@ -1 +0,0 @@
-@use 'toolbar';

package/toolbar/styles/partials/core/components/toolbar/_general.scss

@@ -1,100 +0,0 @@
-.entry-toolbar {
-  top: 0;
-  left: 0;
-  width: 100%;
-  box-shadow: 0 2px 8px hsla(220, 68%, 12%, 0.1);
-
-  .entry-toolbar-nav {
-    margin: 10px;
-
-    .entry-toolbar-data {
-      height: 100%;
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-
-      .entry-toolbar-logo {
-        display: inline-flex;
-        align-items: center;
-        column-gap: 0.25rem;
-
-        a {
-          text-decoration: none;
-          font-weight: 600;
-          transition: color 0.3s;
-
-          img {
-            display: block;
-          }
-        }
-      }
-
-      .entry-toolbar-nav-toggle {
-        position: relative;
-        width: 32px;
-        height: 32px;
-
-        .nav-toggle-menu,
-        .nav-toggle-close {
-          font-size: 1.25rem;
-          position: absolute;
-          display: grid;
-          place-items: center;
-          inset: 0;
-          cursor: pointer;
-          transition: opacity 0.1s, transform 0.4s;
-        }
-
-        .nav-toggle-close {
-          opacity: 0;
-        }
-      }
-
-      .show-toolbar-icon .nav-toggle-menu {
-        opacity: 0;
-        transform: rotate(90deg);
-      }
-
-      .show-toolbar-icon .nav-toggle-close {
-        opacity: 1;
-        transform: rotate(90deg);
-      }
-    }
-  }
-}
-
-.entry-toolbar-content {
-  &.show-toolbar-content {
-    opacity: 1;
-    top: 3.5rem;
-    pointer-events: initial;
-  }
-}
-
-// TODO: do this properly with connection to _breakpoints.scss. Move it to modules/ maybe?
-// Big screen
-@media screen and (min-width: 1118px) {
-  .entry-toolbar-nav {
-    height: calc(var(--header-height) + 2rem);
-    display: flex;
-    justify-content: space-between;
-  }
-
-  .entry-toolbar-nav-toggle {
-    display: none;
-  }
-
-  .entry-toolbar-nav li {
-    display: flex;
-  }
-
-  .entry-toolbar-content {
-    opacity: 1;
-  }
-}
-// Small screen
-@media screen and (max-width: 1118px) {
-  .entry-toolbar-content {
-    opacity: 0;
-  }
-}

package/toolbar/styles/partials/core/components/toolbar/_index.scss

@@ -1 +0,0 @@
-@use 'general';

package/toolbar/styles/partials/main.scss

@@ -1 +0,0 @@
-@use 'core';