diff --git a/html/css/inbox.css b/html/css/inbox.css index 90ab56f..95a1f08 100644 --- a/html/css/inbox.css +++ b/html/css/inbox.css @@ -94,11 +94,11 @@ body { -ms-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; - + display: flex; flex-direction: column; - padding: 0; - margin: 0; + padding: 0; + margin: 0; } a { @@ -194,12 +194,6 @@ button, a.btn { background-color: var(--bg-light); overflow: auto; - .short-text { - max-width: 60%; - } - .paragraph-left .short-text { - max-width: 70%; - } .block-group { display: flex; flex-direction: row; @@ -257,396 +251,6 @@ button, a.btn { margin-left: var(--indent-mini); } } - - .list-group { - position: relative; - padding: 0 var(--w-screen); - - .btn { - width: max-content; - } - .title { - font-size: var(--size-text-maintitle); - font-family: 'GolosB'; - margin-bottom: var(--indent-huge); - } - .subtitle { - font-size: var(--size-text-title); - font-family: 'GolosDB'; - margin-bottom: var(--indent-big); - } - .muted { - color: var(--color-light); - } - .paragraph { - display: flex; - flex-direction: row; - - .paragraph-left { - width: 40%; - } - .paragraph-right { - width: 60%; - } - .paragraph-half { - width: 50%; - } - .paragraph-third { - width: 33.33%; - } - [class*="paragraph-"] + [class*="paragraph-"] { - margin-left: 40px; - } - .text { - font-family: 'InterSB'; - font-size: var(--size-text-primary); - margin-bottom: var(--indent-mini); - } - .icon-checklist, .icon-clock, .icon-text { - padding-top: 44px; - - &.icon-checklist { - background: url(../img/svg/checklist-32x32.svg) no-repeat 0 0; - } - &.icon-clock { - background: url(../img/svg/clock-32x32.svg) no-repeat 0 0; - } - &.icon-text { - background: url(../img/svg/text-32x32.svg) no-repeat 0 0; - } - } - } - .list { - & > div { - position: relative; - padding-left: 36px; - - & + div { - margin-top: var(--indent-mini); - } - &::after { - content: ""; - position: absolute; - width: 24px; - height: 24px; - top: 0; - left: 0; - } - &.esia::after { - background: url(../img/svg/esia-24x24.svg) no-repeat 0 0; - } - &.case::after { - background: url(../img/svg/case-24x24.svg) no-repeat 0 0; - } - &.user::after { - background: url(../img/svg/user-24x24.svg) no-repeat 0 0; - } - &.romb::after { - background: url(../img/svg/romb-24x24.svg) no-repeat 0 0; - } - } - & ~ .btn-group { - margin-top: var(--indent-medium); - } - } - .section-group > div { - display: flex; - flex-direction: column; - min-height: 48px; - position: relative; - padding: 16px 16px 16px 76px; - margin-bottom: 16px; - border-radius: 4px; - background-color: var(--bg-form); - - &:last-child { - margin-bottom: 0; - } - &::before { - content: ""; - position: absolute; - left: 16px; - width: 48px; - height: 48px; - border-radius: 50px; - background-color: var(--color-bg-main); - background-repeat: no-repeat; - background-position: 50% 50%; - } - &.icon-user::before { - background-image: url(../img/svg/pers-wt.svg); - } - &.icon-case::before { - background-image: url(../img/svg/case-wt.svg); - } - &.icon-shield::before { - background-image: url(../img/svg/shield-wt.svg); - } - &.icon-clip::before { - background-image: url(../img/svg/clip-wt.svg); - } - &.icon-pers::before { - background-image: url(../img/svg/pers-wt.svg); - } - &.icon-building::before { - background-image: url(../img/svg/building-wt.svg); - } - .muted { - margin-top: 12px; - } - .detailed { - color: var(--color-text-primary); - font-family: 'InterB'; - } - } - .pass-list { - position: relative; - display: flex; - flex-direction: row; - padding-top: 60px; - - &::before { - content: ""; - position: absolute; - width: calc(80% + 40px); - height: 4px; - top: 18px; - left: 0; - background-color: var(--color-link-hover); - } - & > div { - position: relative; - width: 20%; - - &::before { - content: ""; - position: absolute; - width: 32px; - height: 32px; - top: -60px; - left: 0; - border-radius: 2px; - border: 4px solid var(--color-link-hover); - background-color: var(--bg-light); - transform: rotate(45deg); - } - &::after { - content: ""; - position: absolute; - font-family: 'InterB'; - top: -50px; - left: 15px; - } - &:nth-child(1)::after { - content: "1"; - } - &:nth-child(2)::after { - content: "2"; - } - &:nth-child(3)::after { - content: "3"; - } - &:nth-child(4)::after { - content: "4"; - } - &:nth-child(5)::after { - content: "5"; - } - & + div { - margin-left: 40px; - } - } - } - .msg-list { - display: flex; - flex-direction: row; - align-items: center; - justify-content: center; - padding: 8px; - - span { - width: 32px; - height: 32px; - padding-right: 16px; - background: url(../img/svg/info-gr.svg) no-repeat 0 0; - } - } - .docs-list { - position: relative; - display: flex; - flex-direction: row; - - & > div { - position: relative; - display: flex; - flex-direction: row; - align-items: center; - width: 20%; - - a { - width: 24px; - height: 24px; - padding-right: 8px; - background: url(../img/svg/download-24x24.svg) no-repeat 0 0; - } - & + div { - margin-left: 40px; - } - } - } - &.lk-what { - padding-top: var(--indent-huge); - padding-bottom: var(--indent-huge); - &::after { - content: ""; - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - opacity: 0.12; - background: url(../img/svg/bg-star.svg) no-repeat calc(100% + 200px) -180px transparent; - z-index: 0; - } - & > div { - position: relative; - z-index: 1; - } - } - &.lk-access { - color: var(--white); - padding-top: var(--indent-big); - padding-bottom: var(--indent-big); - background-color: var(--color-bg-main); - } - &.lk-info { - padding-top: var(--indent-big); - padding-bottom: var(--indent-big); - } - &.lk-pass { - padding-top: var(--indent-big); - padding-bottom: var(--indent-big); - background-color: var(--bg-light); - } - &.lk-when { - color: var(--white); - padding-top: var(--indent-big); - padding-bottom: var(--indent-big); - background-color: var(--color-bg-main); - } - &.lk-msg { - background-color: var(--border-light); - } - &.lk-limits { - padding-top: var(--indent-big); - padding-bottom: var(--indent-big); - } - &.lk-docs { - flex: 1; - color: var(--white); - padding-top: var(--indent-huge); - padding-bottom: var(--indent-huge); - background-color: var(--color-text-primary); - } - &.lk-alert { - padding-top: var(--indent-big); - padding-bottom: var(--indent-big); - background-color: var(--bg-light); - } - &.lk-footer { - padding-top: var(--indent-small); - padding-bottom: var(--indent-small); - background-color: var(--color-text-primary); - } - } -} - -:is(.fl) .container-inside .list-group { - &.lk-what .title { - color: var(--color-link); - margin-bottom: var(--indent-small); - - &::after { - content: url(../img/svg/star.svg); - top: 18px; - position: relative; - margin-left: var(--indent-big); - } - & + .short-text { - max-width: 25%; - } - & ~ .subtitle { - margin-top: var(--indent-big); - } - } - &.lk-info .section-group > div { - justify-content: center; - } - &.lk-pass { - .subtitle { - margin-bottom: 0; - & + div { - margin-top: var(--indent-small); - margin-bottom: var(--indent-big); - } - } - .pass-list { - &::before { - display: none; - } - & > div { - position: relative; - width: 33.33%; - } - } - } - &.lk-msg { - color: var(--color-link); - font-family: 'InterSB'; - background-color: var(--bg-form); - - span { - background: url(../img/svg/info.svg) no-repeat 0 4px; - } - } - &.lk-limits { - .subtitle { - margin-bottom: 0; - & + div { - margin-top: var(--indent-small); - margin-bottom: var(--indent-big); - } - } - .scheme { - width: 100%; - height: 204px; - background: url(../img/svg/scheme.svg) no-repeat 0 0; - } - } - &.lk-alert { - & > .short-text { - margin-bottom: var(--indent-big); - } - .alert-block { - position: relative; - padding: var(--indent-small) 64px var(--indent-small) var(--indent-small); - border-radius: 4px; - border: 2px solid var(--border-light); - - &::after { - content: url(../img/svg/info.svg); - position: absolute; - top: var(--indent-small); - right: var(--indent-small); - } - & > div + div { - margin-top: var(--indent-small); - } - & > div:last-child { - color: var(--color-link); - } - } - } } /*@media ((max-width: 780px) or ((orientation: landscape) and (max-device-width : 1024px))) {*/ @@ -664,10 +268,6 @@ button, a.btn { --indent-small: 16px; } - .container-inside .short-text { - max-width: 100% !important; - } - .container-inside .block-group { flex-direction: column; margin: 0; @@ -680,49 +280,8 @@ button, a.btn { } } } - :is(.ul, .fl) .container-inside .list-group { - .paragraph { - flex-direction: column; - - [class*="paragraph-"] { - width: auto; - margin-left: 0; - } - [class*="paragraph-"] + [class*="paragraph-"] { - margin-top: var(--indent-mini); - margin-left: 0; - } - } - .pass-list { - flex-direction: column; - padding-top: 0; - - &::before { - display: none; - } - & > div { - display: flex; - align-items: center; - width: auto !important; - padding-left: 60px; - min-height: 40px; - - &::before { - top: 0; - } - &::after { - top: 10px; - } - & + div { - margin-left: 0; - margin-top: var(--indent-mini); - } - } - } - } } - @media (max-width: 480px) { body { --w-screen: 16px; @@ -736,18 +295,4 @@ button, a.btn { --indent-medium: 16px; --indent-small: 16px; } - :is(.ul, .fl) .container-inside .list-group { - .docs-list { - flex-direction: column; - - & > div { - width: 100%; - - & + div { - margin-left: 0; - margin-top: var(--indent-mini); - } - } - } - } } \ No newline at end of file diff --git a/html/fl/index.html b/html/fl/index.html deleted file mode 100644 index 42a5426..0000000 --- a/html/fl/index.html +++ /dev/null @@ -1,129 +0,0 @@ - -
-