Andrey
/
object-type-constructor-front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

color set

master
Boris Voropaev 2023-10-20 15:56:06 +03:00
parent f491aecc59
commit 0d2cb7e2b2
31 changed files with 116 additions and 100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/_modules/administration/page/administration-page.component.scss
View File

@ -13,7 +13,7 @@
font-weight: 700;
line-height: 60px; /* 100% */
letter-spacing: 0.76px;
color: #2D2D2D;
color: var(--second-act);
}
}
:host{

2
src/app/_modules/administration/site-pages/administrate-site-pages.component.scss
View File

@ -63,7 +63,7 @@
height: 40px;
margin-right: 16px;
border-radius: 100px;
background-color: #0070BA;
background-color: var(--prime);
color: #ffffff;
span{
display: none;

10
src/app/_modules/auth/login/login.component.scss
View File

@ -16,7 +16,7 @@
display: flex;
flex-direction: row;
align-items: center;
border-bottom: 1px solid #C0C0C0;
border-bottom: 1px solid var(--second-dis);
h2 {
margin: 0;
font-family: PT Sans Narrow;
@ -25,7 +25,7 @@
font-weight: 700;
line-height: 44px; /* 122.222% */
letter-spacing: 0.36px;
color: var(--dark-1);
color: var(--second-act);
}
.close {
width: 24px;
@ -63,11 +63,11 @@
}
&:hover{
border-color: #6C6C6C;
border-color: var(--second);
outline: none;
}
&:focus, &:focus-visible {
border-color: #0070BA;
border-color: var(--prime);
outline: none;
}
@ -120,7 +120,7 @@
.footer {
display: flex;
flex-grow: 0;
border-top: 1px solid #C0C0C0;
border-top: 1px solid var(--second-dis);
// border-radius: 0 0 24px 24px;
padding: 16px 24px;
justify-content: flex-end;

2
src/app/_modules/companies/company/company.component.scss
View File

@ -72,7 +72,7 @@
.content {
padding: 24px 40px;
border-bottom: #6c6c6c solid 1px;
border-bottom: var(--second) solid 1px;
.properties {
display: flex;
flex-direction: row;

2
src/app/_modules/filter-fields/field/filter-field.component.scss
View File

@ -8,7 +8,7 @@
margin-right: 16px;
padding: 10px 0 2px;
flex-shrink: 0;
color: #6c6c6c;
color: var(--second);
}
.value {
flex-grow: 1;

4
src/app/_modules/form-fields/types/document/form-field-document.component.scss
View File

@ -3,7 +3,7 @@
display: flex;
height: 100px;
padding: 16px;
border: var(--blue-1) dashed 1px;
border: var(--prime) dashed 1px;
border-radius: 4px;
overflow: hidden;
font-size: 20px;
@ -12,7 +12,7 @@
}
p {
margin: auto;
color: #c0c0c0;
color: var(--second-dis);
text-align: center;
span {
color: var(--orange-2);

2
src/app/_modules/form-fields/types/html/single/field-html-single.component.scss
View File

@ -1,6 +1,6 @@
:host::ng-deep editor{
border-radius: 12px;
border: solid 1px #C0C0C0;
border: solid 1px var(--second-dis);
font-family: "PT Sans";
.tox-tinymce{
border:none;

4
src/app/_modules/form-fields/types/image/form-field-image.component.scss
View File

@ -3,7 +3,7 @@
display: flex;
height: 100px;
padding: 16px;
border: var(--blue-1) dashed 1px;
border: var(--prime) dashed 1px;
border-radius: 4px;
overflow: hidden;
font-size: 20px;
@ -12,7 +12,7 @@
}
p {
margin: auto;
color: #c0c0c0;
color: var(--second-dis);
text-align: center;
span {
color: var(--orange-2);

8
src/app/_modules/form-fields/types/relation/form-field-relation.component.scss
View File

@ -1,19 +1,19 @@
.combobox {
position: relative;
font-family: "PT Sans";
border: solid 1px #C0C0C0;
border: solid 1px var(--second-dis);
border-radius: 12px;
font-size: 20px;
color: var(--dark-1);
color: var(--second-act);
padding: 8px 12px 8px 16px;
background: no-repeat left 16px center / 173px 19px url('~src/assets/images/icons/placeholder.svg');
&:hover{
border-color: #6C6C6C;
border-color: var(--second);
outline: none;
}
&.active {
border-color: #0070BA;
border-color: var(--prime);
outline: none;
}

2
src/app/_modules/form-fields/types/relation/single/radio/relation-radio.component.scss
View File

@ -7,7 +7,7 @@ $blue-pressed: #003366;
$blue-disabled: #9ECCE8;
$grey: #939393;
$grey-hover: #6C6C6C;
$grey-hover: var(--second);
$grey-pressed: #707070;
$grey-disabled: #E0E0E0;

2
src/app/_modules/form-fields/types/topics/form-field-topics.component.scss
View File

@ -47,7 +47,7 @@
.name {
width: 256px;
color: #6c6c6c;
color: var(--second);
}
.field {

2
src/app/_modules/layout/footer/footer.component.scss
View File

@ -41,7 +41,7 @@
.line{
width: 100%;
height: 1px;
background-color: var(--blue-1);
background-color: var(--prime);
margin-bottom: 40px;
}

10
src/app/_modules/layout/header/user-bar/header-user-bar.component.scss
View File

@ -9,13 +9,13 @@
justify-content: center;
background-color: #fff;
border-radius: 32px;
border: 1px solid #C0C0C0;
border: 1px solid var(--second-dis);
.avatar {
width: 38px;
height: 38px;
color: var(--blue-1);
border: 1px solid var(--blue-1);
color: var(--prime);
border: 1px solid var(--prime);
background: #fff;
border-radius: 100%;
display: flex;
@ -35,7 +35,7 @@
.name{
margin: 8px 4px 0 12px;
color: #2D2D2D;
color: var(--second-act);
white-space: nowrap;
}
@ -67,7 +67,7 @@
li {
display: block;
padding: 12px 20px;
color: #2D2D2D;
color: var(--second-act);
cursor: pointer;
border-bottom: #E0E0E0 solid 1px;
white-space: nowrap;

4
src/app/_modules/pages/page/breadcrumbs/page-breadcrumbs.component.scss
View File

@ -7,7 +7,7 @@
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color:var(--blue-1);
color:var(--prime);
li {
padding: 0;
display: inline;
@ -19,7 +19,7 @@
font-weight: 400;
line-height: 16px; /* 160% */
color: var(--blue-1);
color: var(--prime);
&::before {
display: inline;

4
src/app/_modules/pages/page/page.component.scss
View File

@ -7,7 +7,7 @@
.row {
display: block;
width: 100%;
border-bottom: 1px solid #C0C0C0;
border-bottom: 1px solid var(--second-dis);
background-color: #FFF;
.page-header {
display: flex;
@ -62,7 +62,7 @@
.label {
margin-right: 8px;
font-size: 20px;
color: #2D2D2D;
color: var(--second-act);
}
}
}

6
src/app/_modules/pages/sections/add/add-section.component.scss
View File

@ -9,7 +9,7 @@
.toggle {
position: relative;
padding-left: 32px;
color: var(--blue-1);
color: var(--prime);
// background: var(--white) url("~src/assets/images/icons/add_24dp.svg") no-repeat center;
cursor: pointer;
z-index: 1;
@ -103,7 +103,7 @@
border-bottom: #E0E0E0 solid 1px;
column-gap: 12px;
cursor: pointer;
color: #2D2D2D;
color: var(--second-act);
background: transparent;
@ -114,7 +114,7 @@
.sub-row {
padding: 12px 16px 12px 32px;
border-bottom: #E0E0E0 solid 1px;
color: #6C6C6C;
color: var(--second);
cursor: pointer;
&:hover {
background-color: #f7f7f7;

2
src/app/_modules/pages/sections/types/basic/contact/contact-section.component.scss
View File

@ -1,7 +1,7 @@
.contact {
h2 {
color: #2D2D2D;
color: var(--second-act);
font-family: PT Sans Narrow;
font-size: 24px;
font-style: normal;

2
src/app/_modules/pages/sections/types/basic/document/document-section.component.scss
View File

@ -15,5 +15,5 @@ a{
font-size: 20px;
}
.description{
color: #6C6C6C;
color: var(--second);
}

4
src/app/_modules/pages/sections/types/basic/html/html-section.component.scss
View File

@ -1,12 +1,12 @@
:host{
color: var(--dark-1);
color: var(--second-act);
font-family: PT Sans;
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 32px;
a {
color: var(--blue-1);
color: var(--prime);
&:hover{
color: var(--blue-3);
};

6
src/app/_modules/pages/sections/types/basic/image-group/image-group-section.component.scss
View File

@ -8,10 +8,10 @@
display: flex;
justify-content: space-between;
width: 100%;
border-top: 1px solid #C0C0C0;
border-bottom: 1px solid #C0C0C0;
border-top: 1px solid var(--second-dis);
border-bottom: 1px solid var(--second-dis);
.title {
color: #6C6C6C;
color: var(--second);
font-size: 20px;
font-style: normal;
font-weight: 400;

4
src/app/_modules/pages/sections/types/basic/images/images-section.component.scss
View File

@ -71,7 +71,7 @@
.item{
width: 72px;
height: 52px;
border: 1px solid var(--blue-1);
border: 1px solid var(--prime);
img{
object-fit: cover;
width: 100%;
@ -198,7 +198,7 @@
display: block;
width: 72px;
height: 52px;
border: 2px solid var(--blue-1);
border: 2px solid var(--prime);
img{
width: 100%;

4
src/app/_modules/pages/sections/types/basic/member/item/member-section-item.component.scss
View File

@ -28,7 +28,7 @@
font-weight: 700;
line-height: 32px; /* 133.333% */
letter-spacing: 0.24px;
color:#6C6C6C
color:var(--second)
}
.position {
font-size: 20px;
@ -91,7 +91,7 @@
}
.description{
color: #6C6C6C;
color: var(--second);
}
}

6
src/app/_modules/pages/sections/types/basic/member/list/member-section-list.component.scss
View File

@ -8,10 +8,10 @@
display: flex;
justify-content: space-between;
width: 100%;
border-top: 1px solid #C0C0C0;
border-bottom: 1px solid #C0C0C0;
border-top: 1px solid var(--second-dis);
border-bottom: 1px solid var(--second-dis);
.title {
color: #6C6C6C;
color: var(--second);
font-size: 20px;
font-style: normal;
font-weight: 400;

2
src/app/_modules/pages/tree/pages-tree.component.scss
View File

@ -59,7 +59,7 @@
height: 40px;
margin-right: 16px;
border-radius: 100px;
background-color: #0070BA;
background-color: var(--prime);
color: #ffffff;
span{
display: none;

6
src/app/_modules/publications/list/item/news/news.component.scss
View File

@ -1,6 +1,6 @@
:host-context(publications-list-item:not(:last-child)){
.item {
border-bottom: 1px solid #C0C0C0;
border-bottom: 1px solid var(--second-dis);
}
}
@ -34,7 +34,7 @@
.date {
font-size: 20px;
line-height: 18px;
color: #6C6C6C;
color: var(--second);
}
.title a h2 {
@ -48,7 +48,7 @@
font-style: normal;
font-weight: 400;
line-height: 32px; /* 160% */
color: var(--dark-1);
color: var(--second-act);
a{ display: block;
::after{
vertical-align: -4px;

4
src/app/_modules/publications/list/list.component.scss
View File

@ -8,11 +8,11 @@
.button {
display: inline-block;
font-size: 20px;
color: var(--blue-1);
color: var(--prime);
vertical-align: 4px;
padding-left: 8px;
&:hover{
color: var(--blue-2);
color: var(--prime-hov);
cursor: pointer;
}
};

42
src/assets/css/basics.scss
View File

@ -1,5 +1,33 @@
@import "~@angular/material/prebuilt-themes/indigo-pink.css";
:root {
--radius-1: 12px;
--radius-2: 20px;
--white: #ffffff;
--prime: #0070BA;
--prime-hov: #005799;
--prime-act: #004077;
--prime-dis: #A1CAE5;
--second: #6C6C6C;
--second-hov: #4D4D4D;
--second-act: #2D2D2D;
--second-dis: #C0C0C0;
--blue-0: #2EB2E8;
--blue-3: #004077;
--blue-4: #A1CAE5;
}
.style-color{
background-color: #f6f6f6;
}
@ -49,7 +77,7 @@ body {
height: 100%;
padding: 0;
margin: 0;
color: var(--dark-1);
color: var(--second-act);
}
.limiter {
@ -60,7 +88,7 @@ body {
h2 {
color: var(--dark-1);
color: var(--second-act);
font-family: PT Sans Narrow;
font-size: 50px;
font-style: normal;
@ -71,7 +99,7 @@ h2 {
margin:0;
}
h3 {
color: var(--dark-1);
color: var(--second-act);
font-family: PT Sans Narrow;
font-size: 36px;
font-style: normal;
@ -82,7 +110,7 @@ h3 {
margin:0;
}
h4 {
color: var(--dark-1);
color: var(--second-act);
font-family: PT Sans Narrow;
font-size: 24px;
font-style: normal;
@ -95,7 +123,7 @@ h4 {
a {
text-decoration: none;
color: var(--blue-1);
color: var(--prime);
cursor: pointer;
&:hover{
color: var(--blue-3);
@ -152,7 +180,7 @@ html-section ul{
content: "";
width: 16px;
height: 2px;
background-color: var(--blue-1);
background-color: var(--prime);
margin-bottom: 5px;
margin-right: 16px;
}
@ -206,7 +234,7 @@ html-section ul{
line-height: 32px;
}
h4{
color:#6C6C6C;
color:var(--second);
}
}

16
src/assets/css/buttons.scss
View File

@ -6,8 +6,8 @@ button, .btn, a.btn {
gap: 10px;
cursor: pointer;
border-radius: 12px;
border: 1px solid#0070BA;
background:#0070BA;
border: 1px solidvar(--prime);
background:var(--prime);
color: #FFF;
font-family: PT Sans Narrow;
font-size: 24px;
@ -17,8 +17,8 @@ button, .btn, a.btn {
letter-spacing: 0.24px;
&:hover{
border: 1px solid #005799;
background: #005799;
border: 1px solid var(--prime-hov);
background: var(--prime-hov);
}
&:active{
@ -33,10 +33,10 @@ button, .btn, a.btn {
&.outline{
background:#FFF;
color: #0070BA;
color: var(--prime);
&:hover{
border: 1px solid #005799;
color: #005799;
border: 1px solid var(--prime-hov);
color: var(--prime-hov);
}
&:active{
@ -59,7 +59,7 @@ button, .btn, a.btn {
border-radius: 0;
border: none;
background-color: transparent;
color: var(--dark-1);
color: var(--second-act);
font-family: PT Sans Narrow;
font-size: 12px;
font-style: normal;

24
src/assets/css/forms.scss
View File

@ -3,17 +3,17 @@ input, select, textarea {
height: 40px;
padding: 8px 16px;
border-radius: 12px;
border: solid 1px #C0C0C0;
border: solid 1px var(--second-dis);
font-family: "PT Sans";
font-size: 20px;
color: var(--dark-1);
color: var(--second-act);
background-color: #fff;
&:hover{
border-color: #6C6C6C;
border-color: var(--second);
outline: none;
}
&:focus, &:focus-visible {
border-color: #0070BA;
border-color: var(--prime);
outline: none;
}
@ -37,21 +37,21 @@ input, select, textarea {
padding: 2px;
border-radius: 12px;
background-color: #fff;
border: 1px solid #6C6C6C;
border: 1px solid var(--second);
cursor: pointer;
transition: background-color 0.3s;
&:before {
display: block;
width: 18px;
height: 18px;
background-color: #C0C0C0;
background-color: var(--second-dis);
border-radius: 9px;
transition: transform 0.3s;
content: '';
}
&.active {
background-color:var(--blue-1);
border-color:var(--blue-1);
background-color:var(--prime);
border-color:var(--prime);
&:before {
transform: translateX(20px);
background-color: #fff;
@ -59,8 +59,8 @@ input, select, textarea {
}
&.active{
&:hover {
background-color:var(--blue-2);
border-color:var(--blue-2);
background-color:var(--prime-hov);
border-color:var(--prime-hov);
&:before {
transform: translateX(20px);
}
@ -74,9 +74,9 @@ input, select, textarea {
}
}
&:not(.active):hover {
border-color:#4D4D4D;
border-color:var(--second-hov);
&:before {
background-color: #6C6C6C;
background-color: var(--second);
}
}
&.disabled {

14
src/assets/css/main-menu.scss
View File

@ -115,7 +115,7 @@
align-items: center;
a {
color: #0070BA;
color: var(--prime);
font-size: 20px;
font-style: normal;
font-weight: 400;
@ -123,7 +123,7 @@
&.parent-item{
>span{
display: inline-block;
border-bottom: 2px solid #0070BA;
border-bottom: 2px solid var(--prime);
}
}
}
@ -195,12 +195,12 @@
>a.active>span{
color: var(--blue-1)
color: var(--prime)
}
a{
span{
color: #6C6C6C;
color: var(--second);
font-family: PT Sans Narrow;
font-size: 24px;
font-style: normal;
@ -211,10 +211,10 @@
}
:hover{
color:var(--blue-2)
color:var(--prime-hov)
}
.current-item{
color:var(--blue-1)
color:var(--prime)
}
>pages-menu.parent-item{ //second level
@ -234,7 +234,7 @@
background-color: #EDEDED;
border-radius: 8px;
span{
color:#2D2D2D
color:var(--second-act)
}
}
}

14
src/styles.scss
View File

@ -1,16 +1,4 @@
:root {
--radius-1: 12px;
--radius-2: 20px;
--white: #ffffff;
--blue-0: #2EB2E8;
--blue-1: #0070BA;
--blue-2: #005799;
--blue-3: #004077;
--blue-4: #A1CAE5;
--dark-1: #2D2D2D;
}
* {
font-family: "PT Sans";
@ -32,7 +20,7 @@
display: flex;
.block {
background: #fff;
border: 1px solid #C0C0C0;
border: 1px solid var(--second-dis);
border-radius: 12px;
padding: 12px 24px;
display: flex;