- ![]()
-
-
@@ -12,11 +8,11 @@
-
+
-
+
diff --git a/src/app/_modules/pages/sections/types/basic/images/images-section.component.scss b/src/app/_modules/pages/sections/types/basic/images/images-section.component.scss
index 8a98047..4ae12f3 100644
--- a/src/app/_modules/pages/sections/types/basic/images/images-section.component.scss
+++ b/src/app/_modules/pages/sections/types/basic/images/images-section.component.scss
@@ -9,27 +9,8 @@
top:24px;
right: 24px;
}
-.first{
- display: none;
- &.large-preview{
- display: flex;
- width: 100%;
- max-width: 720px;
- margin-bottom: 8px;
- border-radius: 12px;
- border: 1px solid rgba(45, 45, 45, 0.27);
- overflow: hidden;
- padding: 0;
- img{
- width: 100%;
- }
- }
-}
-.large img{
-
- border-radius: 12px;
- border: 1px solid rgba(45, 45, 45, 0.27);
-}
+
+
.items {
display: flex;
@@ -38,15 +19,16 @@
width: 100%;
gap: 8px;
- &.small{
+ img{
+ border: 1px solid var(--second-dis);
+ }
- display: flex;
- flex-direction: column;
+ &.small{
.item{
margin-bottom: 16px;
img{
max-height: 273px;
- max-width: 273px;
+ max-width: 273px;
}
}
}
@@ -65,21 +47,6 @@
}
}
- &.large-preview{
- display: flex;
- flex-direction: row;
- .item{
- width: 72px;
- height: 52px;
- border: 1px solid var(--prime);
- img{
- object-fit: cover;
- width: 100%;
- height: 100%;
- }
- }
- }
-
.item {
position: relative;
@@ -117,8 +84,8 @@
.center {
display: flex;
overflow: hidden;
- max-width: 548px;
width: 100%;
+ height: 100%;
}
}
@@ -132,7 +99,7 @@
img {
display: block;
width: 100%;
- height: 300px;
+ height: 450px;
object-fit: cover;
}
}
diff --git a/src/app/_modules/pages/sections/types/basic/images/images-section.component.ts b/src/app/_modules/pages/sections/types/basic/images/images-section.component.ts
index f99b659..a4a2190 100644
--- a/src/app/_modules/pages/sections/types/basic/images/images-section.component.ts
+++ b/src/app/_modules/pages/sections/types/basic/images/images-section.component.ts
@@ -46,10 +46,11 @@ export class ImagesSectionComponent {
return type.name;
}
get imageClass(){
+ console.log(this.imageType)
return {
- small : this.imageType=='small',
- large : this.imageType=='large',
- 'large-preview': this.imageType=='large-preview'
+ small : this.imageType=='tiles',
+ large : this.imageType=='full-width',
+ carousel: this.imageType=='carousel'
}
}
set photo(activePhoto: string) {
diff --git a/src/app/_modules/widjet/file-ico/file-ico.component.html b/src/app/_modules/widjet/file-ico/file-ico.component.html
new file mode 100644
index 0000000..9c6ef22
--- /dev/null
+++ b/src/app/_modules/widjet/file-ico/file-ico.component.html
@@ -0,0 +1 @@
+![]()
\ No newline at end of file
diff --git a/src/app/_modules/widjet/file-ico/file-ico.component.scss b/src/app/_modules/widjet/file-ico/file-ico.component.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/_modules/widjet/file-ico/file-ico.component.ts b/src/app/_modules/widjet/file-ico/file-ico.component.ts
new file mode 100644
index 0000000..b3a4f43
--- /dev/null
+++ b/src/app/_modules/widjet/file-ico/file-ico.component.ts
@@ -0,0 +1,41 @@
+import { Component, Input } from '@angular/core';
+
+@Component({
+ selector: 'file-ico',
+ templateUrl: './file-ico.component.html',
+ styleUrls: ['./file-ico.component.scss']
+})
+export class FileIcoComponent {
+ typeList = {
+ PDF:'PDF',
+ DOC:'DOC',
+ DOCX:'DOC',
+ DOTM:'DOC',
+ DOTX:'DOC',
+ TXT:'DOC',
+ RTF:'DOC',
+ ODT:'DOC',
+ JPG:'JPG',
+ JPEG:'JPG',
+ JPE:'JPG',
+ JFIF :'JPG',
+ PPT:'PPT',
+ PPTX:'PPT',
+ XLS:'XLS',
+ XLSM:'XLS',
+ XLSB:'XLS',
+ XLSX:'XLS',
+ CSV:'XLS',
+ XML:'XLS',
+ }
+
+ @Input() type: 'string';
+
+ get url(){
+ let type = this.type.toUpperCase()
+ let svg = this.typeList[type]?
+ this.typeList[type]+'.svg':
+ 'document_60dp.svg';
+ return `assets/images/icons/document/${svg}`
+ }
+}
diff --git a/src/app/_modules/widjet/widjet.module.ts b/src/app/_modules/widjet/widjet.module.ts
index 6f20941..c836d44 100644
--- a/src/app/_modules/widjet/widjet.module.ts
+++ b/src/app/_modules/widjet/widjet.module.ts
@@ -8,6 +8,7 @@ import {DropDownComponent } from "./drop-down/drop-down.component";
import { SliderComponent } from './slider/slider.component';
import { SwitchComponent } from './switch/switch.component';
import { LocaleComponent } from './locale/locale.component';
+import { FileIcoComponent } from './file-ico/file-ico.component';
@NgModule({
@@ -23,6 +24,7 @@ import { LocaleComponent } from './locale/locale.component';
SliderComponent,
SwitchComponent,
LocaleComponent,
+ FileIcoComponent,
],
exports: [
IcoComponent,
@@ -30,7 +32,8 @@ import { LocaleComponent } from './locale/locale.component';
DropDownComponent,
SliderComponent,
SwitchComponent,
- LocaleComponent
+ LocaleComponent,
+ FileIcoComponent
]
})
export class WidjetModule {
diff --git a/src/assets/css/_basics.scss b/src/assets/css/_basics.scss
index d1007b7..8ff1b26 100644
--- a/src/assets/css/_basics.scss
+++ b/src/assets/css/_basics.scss
@@ -435,3 +435,10 @@ html-section ul{
}
}
+
+
+file-ico{
+ width: 52px;
+ height: 60px;
+ display: inline-flex;
+}
diff --git a/src/assets/css/_documents-lists.scss b/src/assets/css/_documents-lists.scss
index 953a2c2..d9d1551 100644
--- a/src/assets/css/_documents-lists.scss
+++ b/src/assets/css/_documents-lists.scss
@@ -1,7 +1,4 @@
.documents.list.default {
- background: transparent url('~src/assets/images/icons/document/document_pdf_60dp.svg') 0 0 no-repeat;
- min-height: 60px;
- padding-left: 72px;
font-size: 20px;
.title {
margin: 0 0 16px;
@@ -9,6 +6,8 @@
}
.items {
.item {
+ display: flex;
+ gap: 8px;
margin: 0 0 16px;
a {
display: inline-block;
diff --git a/src/assets/css/_forms.scss b/src/assets/css/_forms.scss
index a6b1c48..978693b 100644
--- a/src/assets/css/_forms.scss
+++ b/src/assets/css/_forms.scss
@@ -137,4 +137,77 @@ input, select, textarea {
}
.checkbox:disabled:not(:checked)+label::before {
background-image: url("~/src/assets/images/icons/checkbox/checbox_none_disabled_24dp.svg");
+}
+
+
+
+
+form-field-document{
+ .area {
+ position: relative;
+ display: flex;
+ height: 100px;
+ padding: 16px;
+ border: var(--prime) dashed 1px;
+ border-radius: 4px;
+ overflow: hidden;
+ font-size: 20px;
+ &.hover {
+ background-color: #e0e0e0;
+ }
+ p {
+ margin: auto;
+ color: var(--second-dis);
+ text-align: center;
+ span {
+ color: var(--orange-2);
+ cursor: pointer;
+ }
+ }
+ input {
+ display: none;
+ }
+ .indicator {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ padding: 16px;
+ background-color: #f7f7f7;
+ .label {
+ margin-bottom: 4px;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+ .progress {
+ height: 4px;
+ background-color: #dfdfdf;
+ overflow: hidden;
+ .fill {
+ width: 0;
+ height: 100%;
+ background-color: #3ca128;
+ }
+ }
+ }
+ }
+
+ .values {
+
+ .item {
+ height: 60px;
+ font-size: 20px;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ margin-top: 10px;
+ gap:8px;
+
+ }
+ }
}
\ No newline at end of file
diff --git a/src/assets/css/_grid.scss b/src/assets/css/_grid.scss
index 999ea6a..e6c071e 100644
--- a/src/assets/css/_grid.scss
+++ b/src/assets/css/_grid.scss
@@ -176,3 +176,6 @@ pages-menu-item{
}
}
+.pages{
+ width: 100%;
+}
\ No newline at end of file