#2700. Добавление блоков в кейс

backend/web/js/form-load.js

@@ -21,7 +21,9 @@ $(function() {
         selector: "textarea",
         theme: "modern",
         language: "ru",
+        schema: "html5",
         custom_elements: "emstart,emend,header,main,span",
+        valid_children: '+a[div]',
         extended_valid_elements: "span[id|name|class|style],i[id|name|class|style],ul[id|name|class|style],li[id|name|class|style],script[type|src],style",
         height: '350px',
         menubar: "edit insert view format table tools",

frontend/web/css/custom.css

@@ -1836,6 +1836,12 @@ a.keys_test_btn {
     display: block;
 }
 
+.keys_block_small.keys_block_small--auto {
+    display: block;
+    width: auto;
+    height: auto;
+}
+
 .attachment-button {
     display: inline-block;
     cursor: pointer;
@@ -3621,6 +3627,104 @@ h3.block-chain-header {
     z-index: 3;
 }
 
+.case {
+    height: 160px;
+    position: relative;
+    display: block;
+    margin-bottom: 20px;
+    box-shadow: 0 0 18px rgba(0,1,3,.26);
+    background-size: cover;
+}
+
+.case--crypto {
+    background: url("../images/crypto_case.png") no-repeat center;
+
+}
+
+.case--lizing {
+    background: url("../images/lizing_case.png") no-repeat center;
+}
+
+.case--lizing-ai {
+    background: url("../images/lizing_ai_case.png") no-repeat center;
+}
+
+.case:hover .case__footer {
+    background: #fff;
+}
+
+.case:hover .case-footer-title {
+    color: #2d3642;
+}
+
+.case:hover .case-details {
+    color: #4b78bb;
+    border: 2px solid #4b78bb;
+}
+
+.case .case-footer-title {
+    margin: 20px 0 0 20px;
+    color: #fff;
+    font-size: 20px;
+    line-height: 1.1;
+    font-family: "RobotoBold";
+    -moz-transition: all .2s linear;
+    -o-transition: all .2s linear;
+    -webkit-transition: all .2s linear;
+    -ms-transition: all .2s linear;
+    transition: all .2s linear;
+}
+
+.case-details {
+    margin: 20px 20px 0 0;
+    display: none;
+    float: right;
+    color: #fff;
+    font-size: 16px;
+    padding: 0 10px;
+    border: 2px solid #fff;
+    text-align: center;
+    line-height: 27px;
+    border-radius: 50px;
+    -moz-border-radius: 50px;
+    -webkit-border-radius: 50px;
+    -o-border-radius: 50px;
+    -ms-border-radius: 50px;
+    -moz-transition: all .2s linear;
+    -o-transition: all .2s linear;
+    -webkit-transition: all .2s linear;
+    -ms-transition: all .2s linear;
+    transition: all .2s linear;
+}
+
+.case-details:after {
+    content: "";
+    background: url(../images/icon/keys_small_btn_more.png) no-repeat;
+    width: 8px;
+    height: 17px;
+    display: inline-block;
+    vertical-align: middle;
+    margin-left: 15px;
+    -moz-transition: all .2s linear;
+    -o-transition: all .2s linear;
+    -webkit-transition: all .2s linear;
+    -ms-transition: all .2s linear;
+    transition: all .2s linear;
+}
+
+.case__footer {
+    width: 100%;
+    height: 70px;
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    background: rgba(36,51,64,.56);
+    -moz-transition: all .2s linear;
+    -o-transition: all .2s linear;
+    -webkit-transition: all .2s linear;
+    -ms-transition: all .2s linear;
+    transition: all .2s linear;
+}
 
 
 @media only screen and (max-width: 1600px) and (min-width: 1301px){
@@ -3653,7 +3757,6 @@ h3.block-chain-header {
     }
 }
 @media only screen and (max-width: 767px){
-
     .blockchain_title_logo{
         margin-bottom: 0;
     }
@@ -3671,6 +3774,14 @@ h3.block-chain-header {
 
 
 @media only screen and (min-width: 768px) {
+    .case-details {
+        display: block;
+    }
+
+    .case .case-footer-title {
+        font-size: 24px;
+        line-height: 33px;
+    }
     .block-chain {
         background: url(../images/block_chain.png) no-repeat left top;
     }