templates/Theme/layoutbaseadmin.html.twig line 596

Open in your IDE?
  1.   
  2.   <!DOCTYPE html>
  3. <html lang="en">
  5. <head>
  6.   <!-- Required meta tags -->
  7.   <meta charset="utf-8">
  8.   <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  9.   <title>{% block title %}{{ site }}{% endblock %}</title>
  10.   {% block meta %} {% endblock %}
  11.   {% block stylesheets %}
  12.   <!-- base:css -->
  13.   <link rel="stylesheet" href="{{ asset('templatedash/typicons.font/font/typicons.css') }}">
  14.   <link rel="stylesheet" href="{{ asset('templatedash/css/vendor.bundle.base.css') }}">
  15.   <!-- endinject -->
  16.   <!-- inject:css -->
  17.   <link rel="stylesheet" href="{{ asset('templatedash/css/style.css') }}">
  18.   <link rel="stylesheet" type="text/css" href="{{ asset('templatedash/css/bootstrap-icons.css') }}">
  19.   <!-- endinject -->
  20.   <link rel="shortcut icon" href="{{ asset('templatedash/images/favicon.png') }}" />
  21.   {% endblock %}
  22.   <script src="{{ asset('templatedash/js/vendor.bundle.base.js') }}"></script>
  23.   <!-- endinject -->
  25.   <link rel="stylesheet" href="{{ asset('plugins/notify/themes/alertify.core.css') }}" />
  26.     <link rel="stylesheet" href="{{ asset('plugins/notify/themes/alertify.default.css') }}" id="toggleCSS" />
  27.   <script src="{{ asset('plugins/notify/lib/alertify.min.js') }}"></script>
  28.     <script>
  29.         function resetNotif() {
  30.             $("#toggleCSS").attr("href", "{{ asset('plugins/notify/themes/alertify.default.css') }}");
  31.             alertify.set({
  32.                 labels : {
  33.                     ok     : "OK",
  34.                     cancel : "Cancel"
  35.                 },
  36.                 delay : 5000,
  37.                 buttonReverse : false,
  38.                 buttonFocus   : "ok"
  39.             });
  40.         }
  41.     </script>
  43.   <style>
  44.     .sidebar {
  45.       background: #e8eff9;
  46.       box-shadow: none;
  47.       -webkit-box-shadow: none;
  48.       -moz-box-shadow: none;
  49.       -ms-box-shadow: none;
  50.   }
  52.   .btn, .btn:hover {
  53.   color: #88a5b1;
  54. }
  56. .btn-primary, .btn-primary:hover, .btn-info, .btn-info:hover, .btn-success, .btn-success:hover, .btn-warning, .btn-warning:hover, .btn-danger, .btn-danger:hover, .btn-inverse, .btn-inverse:hover {
  57.   color: #fff;
  58. }
  60. .btn {
  61.   font: 14px Helvetica;
  62.   padding: 12px 22px 10px;
  63.   margin: 0;
  64.   border: none;
  65.   border-bottom: 3px #aacedd solid;
  66.   text-decoration: none;
  67.   background-image: -moz-linear-gradient(#ffffff, #f8f8f8);
  68.   background-image: -webkit-linear-gradient(#ffffff, #f8f8f8);
  69.   background-image: linear-gradient(#ffffff, #f8f8f8);
  70.   position: relative;
  71.   -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 0 25px -5px;
  72.   -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 0 25px -5px;
  73.   box-shadow: rgba(0, 0, 0, 0.2) 0 0 25px -5px;
  74.   -moz-border-radius: 5px;
  75.   -webkit-border-radius: 5px;
  76.   border-radius: 5px;
  77. }
  78. .btn:active {
  79.   position: relative;
  80.   top: 3px;
  81.   border: none;
  82. }
  84. .btn-primary {
  85.   border-bottom: 3px #000609 solid;
  86.   background-image: -moz-linear-gradient(#0079bb, #005888);
  87.   background-image: -webkit-linear-gradient(#0079bb, #005888);
  88.   background-image: linear-gradient(#0079bb, #005888);
  89. }
  90. .btn-primary:hover {
  91.   background-image: -moz-linear-gradient(#009aee, #005888);
  92.   background-image: -webkit-linear-gradient(#009aee, #005888);
  93.   background-image: linear-gradient(#009aee, #005888);
  94. }
  96. .btn-info {
  97.   border-bottom: 3px #206376 solid;
  98.   background-image: -moz-linear-gradient(#71c1d8, #49afcd);
  99.   background-image: -webkit-linear-gradient(#71c1d8, #49afcd);
  100.   background-image: linear-gradient(#71c1d8, #49afcd);
  101. }
  102. .btn-info:hover {
  103.   background-image: -moz-linear-gradient(#99d2e3, #49afcd);
  104.   background-image: -webkit-linear-gradient(#99d2e3, #49afcd);
  105.   background-image: linear-gradient(#99d2e3, #49afcd);
  106. }
  108. .btn-success {
  109.   border-bottom: 3px #2d662d solid;
  110.   background-image: -moz-linear-gradient(#7ec77e, #5bb75b);
  111.   background-image: -webkit-linear-gradient(#7ec77e, #5bb75b);
  112.   background-image: linear-gradient(#7ec77e, #5bb75b);
  113. }
  114. .btn-success:hover {
  115.   background-image: -moz-linear-gradient(#a2d6a2, #5bb75b);
  116.   background-image: -webkit-linear-gradient(#a2d6a2, #5bb75b);
  117.   background-image: linear-gradient(#a2d6a2, #5bb75b);
  118. }
  120. .btn-warning {
  121.   border-bottom: 3px #a86404 solid;
  122.   background-image: -moz-linear-gradient(#fbbc64, #faa732);
  123.   background-image: -webkit-linear-gradient(#fbbc64, #faa732);
  124.   background-image: linear-gradient(#fbbc64, #faa732);
  125. }
  126. .btn-warning:hover {
  127.   background-image: -moz-linear-gradient(#fcd296, #faa732);
  128.   background-image: -webkit-linear-gradient(#fcd296, #faa732);
  129.   background-image: linear-gradient(#fcd296, #faa732);
  130. }
  132. .btn-danger {
  133.   border-bottom: 3px #88201c solid;
  134.   background-image: -moz-linear-gradient(#e37873, #da4f49);
  135.   background-image: -webkit-linear-gradient(#e37873, #da4f49);
  136.   background-image: linear-gradient(#e37873, #da4f49);
  137. }
  138. .btn-danger:hover {
  139.   background-image: -moz-linear-gradient(#eba19e, #da4f49);
  140.   background-image: -webkit-linear-gradient(#eba19e, #da4f49);
  141.   background-image: linear-gradient(#eba19e, #da4f49);
  142. }
  144. .btn-inverse {
  145.   border-bottom: 3px black solid;
  146.   background-image: -moz-linear-gradient(#505050, #363636);
  147.   background-image: -webkit-linear-gradient(#505050, #363636);
  148.   background-image: linear-gradient(#505050, #363636);
  149. }
  150. .btn-inverse:hover {
  151.   background-image: -moz-linear-gradient(#696969, #363636);
  152.   background-image: -webkit-linear-gradient(#696969, #363636);
  153.   background-image: linear-gradient(#696969, #363636);
  154. }
  156. .btn-large {
  157.   font-size: 18px;
  158.   padding: 12px 22px 10px;
  159. }
  161. .btn-small {
  162.   font-size: 11px;
  163.   padding: 8px 16px 6px;
  164. }
  166. .btn-mini {
  167.   font-size: 9px;
  168.   padding: 7px 12px 5px;
  169. }
  174. .accordion__item {
  175.   padding: 20px;
  176.   margin-bottom: 20px;
  177.   border-radius: 4px;
  178.   background: #fff;
  179. }
  180. .accordion__body {
  181.   display: none;
  182.   padding-top: 10px;
  183. }
  184. .accordion__body p {
  185.   margin-bottom: 0;
  186. }
  187. .accordion__title {
  188.   font-size: 18px;
  189.   cursor: pointer;
  190.   margin-bottom: 0;
  191.   position: relative;
  192. }
  193. .accordion__title:after {
  194.   content: "";
  195.   width: 20px;
  196.   height: 20px;
  197.   position: absolute;
  198.   right: 0;
  199.   top: 0;
  200.   background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAABlUlEQVRIS72V6zEEQRSFv81ABogAESADIiADRIAIEAEiQASIABmQgQyor+rerZ7enp71Y92qqZrpxznnPmfGim22YnyWITgGdoHteNT0Hs8j8NQT2SM4AK6AjQkvP4EzQLIFGyO4Bk7i9Bfg90uodllv9oBTYD3OeUaigbUISnAv+N0zSfRUuwnS+fmawLA8xO5OoXiqFvToLQ4dluGqCYynLi+jvCZNT8TYzM2SwGq5BYz5VGLHPEqBcy9KgjvgqFJ/ETn4HkFci2K4jP304h5Q8KAPrO0tIGMv+HnkYR+oSQR/joqSwPOZC7HEGRD8hIr0SgBLU1IvlCQl+EeUbAoY4JQhqgnka5G4nsprcPdGCeoQZdhrkmy0FniGyD3fByFqJblF4loL3PVukrPJBnVcVE964pJjolVZ3TL14lSjSaK1wFP9oI/+fVSorhx2qnKA9exPwy6BShLD5vdrNa79CQmeY2VhktZVVKs06QLnvB/zwphL9KcfTgkmkY91bVdnmdo3gjaBE2CZf/JECvrbKyf4BdpXaxkir2UhAAAAAElFTkSuQmCC") no-repeat;
  201.   background-size: 20px;
  202. }
  203. .accordion__title.active {
  204.   color: #2B9FDF;
  205. }
  206. .accordion__title.active:after {
  207.   transform: rotate(-180deg);
  208. }
  210. .breadcrumb_{
  211.     padding: 0px;
  212.   }
  213. .breadcrumb_ li {
  214.   display: inline-block;
  215.   font-size: 1.5em;
  216.   list-style: none;
  217.   padding-right: 0.5em;
  218.   max-width: 200px;
  219.   overflow: hidden;
  220.   text-overflow: ellipsis;
  221.   white-space: nowrap;
  222. }
  223. .breadcrumb_ li:before {
  224.   content: "/";
  225.   padding-right: 0.5em;
  226. }
  227. .breadcrumb_ li:first-of-type:before {
  228.   display: none;
  229. }
  230. .breadcrumb_ li:last-of-type {
  231.   max-width: 100%;
  232. }
  233. .breadcrumb_ li h1 {
  234.   display: inline-block;
  235.   font-size: 1em;
  236.   margin: 0;
  237. }
  239. .navbar {
  240.     border-bottom: 1px solid #ddd!important;
  241. }
  243. .box {
  244.     width: 100%;
  245.     min-height: 325px;
  246.     border-radius: 8px;
  247.     box-shadow: 0 0 0 #fff,0 0 0 #fff,0 0 0 #fff;
  248.   background: #fff;
  249.     box-sizing: border-box;
  250.     font-family: open sans;
  251.     padding: 20px;
  252.     cursor: pointer;
  253.     display: inline-block;
  254.     transition: .3s;
  255.   border-bottom: 1px dashed #ddd;
  256. }
  257. .box:hover {
  258.     box-shadow: 5px 5px 10px #ddd,-5px -5px 10px #ddd;
  259.     transform: scale(1.1);
  260.     z-index: 999;
  261. }
  262. .box .title {
  263.     font-family: Roboto;
  264.     font-size: 16px;
  265.     font-weight: 500;
  266. }
  267. .box .subtitle {
  268.     font-family: Roboto;
  269.     font-size: 15px;
  270.     font-weight: 500;
  271.     color: #555;
  272. }
  273. .box .number {
  274.     font-family: Roboto;
  275.     font-size: 15px;
  276.     font-weight: 500;
  277.     color: #555;
  278.     right: 7px;
  279.     top: 10px;
  280.     position: absolute;
  281. }
  282. .box .text {
  283.     font-size: 30px;
  284.     line-height: 1.10909;
  285.     font-family: Roboto;
  286.     font-weight: 400;
  287.     font-style: normal;
  288. }
  289. .SheetTitle {
  290.     font-family: Roboto;
  291.     font-size: 40px;
  292.     font-weight: 300;
  293. }
  294. .SheetSubtitle {
  295.     font-family: Roboto;
  296.     font-size: 20px;
  297.     font-weight: 600;
  298.     color: #888;
  299. }
  300. .line {
  301.     height: 2px;
  302.     background-color: #ccc;
  303.     margin: 10px;
  304.     width: 70%;
  305. }
  307. @media (min-width: 989px){
  308.   #sidebar{
  309.     position: fixed; top: 62px; left: 0px; z-index: 999;
  310.   }
  311.   #sidebar2{
  312.     opacity: 0;
  313.   }
  314. }
  316. @media (max-width: 989px){
  317.   #sidebar{
  318.     
  319.   }
  320.   #sidebar2{
  321.     display: none;
  322.   }
  323. }
  329. figure {
  330.     display: block;
  331.     background-color: #fff;
  332.     -ms-interpolation-mode: bicubic;
  333. }
  335. figure img {
  336.     display: block;
  337.     width: auto;
  338.     max-width: 100%;
  339. }
  341. /**
  342.  * Variables 
  343.  */
  344. :root {
  345.     --master-color: #005888;
  346.     --master-color-partner-dark: #005888;
  347.     
  348.     --headings-color: #263358;    
  349.     
  350.     --main-bg-color: #fff;
  351.     --secondary1-bg-color: #f6f6f6;
  352.     --secondary2-bg-color: #fff0ec;
  353.     
  354.     --main-txt-color: #333;
  355.     --secondary-txt-color: #757575;
  356.     
  357.     --sub-color: #b4b4b4;
  358. }
  361. .post__header h1, .post__header h2 {
  362.     display: block;
  363.     font-family: 'Oswald', sans-serif;
  364.     font-style: normal;
  365.     font-weight: 300;
  366.     line-height: 1.4em;
  367.     color: var(--headings-color);
  368. }
  370. .post__header h1 a,
  371. .post__header h2 a {
  372.     font-weight: 300;
  373.     text-decoration: none;
  374.     color: var(--headings-color);
  375.     background-color: transparent;
  376.     outline: none;
  377. }
  379. .post__header a:hover {
  380.     color: var(--master-color-partner-dark);
  381. }
  383. .post__header a:focus {
  384.     color: var(--headings-color);
  385.     background-color: var(--secondary2-bg-color); 
  386. }
  388. /**
  389.  * Post List Layout
  390.  */
  391.  .post-list_grid {
  392.     display: grid;
  393.     grid-template-columns: repeat(3, 1fr);
  394.     align-items: stretch;
  395. }
  397. .post-list__post {
  398.     display: grid;
  399.     grid-template-areas: 
  400.         "header"
  401.         "footer"
  402.         "pr_img";
  403.     grid-auto-rows: 1fr auto auto;
  404.     align-items: start;
  405.     grid-gap: 1em 0;
  406. }
  408. .post-list__post:nth-child(2n+1) {
  409.     background-color: var(--secondary1-bg-color);
  410. }
  412. .post-list__post:nth-child(3n+2) {
  413.     grid-template-areas: 
  414.         "pr_img"
  415.         "header"
  416.         "footer";
  417.     grid-auto-rows: auto 1fr auto;    
  418. }
  420. .post__preview-img {
  421.     grid-area: pr_img;
  422. }
  424. .post__header {
  425.     grid-area: header;
  426. }
  428. .post__meta {
  429.     grid-area: footer;
  430.     align-self: start;
  431.     display: flex;
  432.     justify-content: space-between;
  433.     align-items: flex-start;
  434. }
  436. /**
  437.  * Post List Design
  438.  */
  439. .post-list {
  440.     margin-bottom: 4em;
  441. } 
  442.  
  443. .post {
  444.     position: relative;
  445.     padding: 1.6em;
  446. } 
  448. .post:after {
  449.     content: '';
  450.     display: block;
  451.     position: absolute;
  452.     top: 0;
  453.     right: 0;
  454.     bottom: 0;
  455.     left: 0;
  456.     border: 3px var(--master-color) solid;
  457.     border-image: linear-gradient(110deg, #c19f63, #c6972b, #f5cd87, #c6972b, #c19f63) 1;
  458.     z-index: 2;
  459.     opacity: 0;
  460.     -webkit-transition: all .25s ease-out;            
  461.             transition: all .25s ease-out;
  462. }
  464. .post:hover:after {
  465.     opacity: 1;
  466. }
  468. .post > * {
  469.     z-index: 4;
  470.     position: relative;
  471. }
  473. .post__preview-img {
  474.     width: 100%;
  475.     height: 0;
  476.     padding-bottom: 56.25%;
  477.     position: relative;
  478.     overflow: hidden;
  479. }
  481. .post__preview-img img {
  482.     width: 100%;
  483.     height: auto;
  484.     position: absolute;
  485.     top: -50%;
  486.     right: -50%;
  487.     bottom: -50%;
  488.     left: -50%;
  489.     margin: auto;
  490. }
  492. .post__time {
  493.     color: var(--sub-color);
  494. }
  496. .post__meta a {
  497.     color: var(--sub-color);
  498.     text-decoration: none;
  499.     border-bottom: 1px var(--sub-color) solid;
  500. }
  502. .post__meta a:hover {
  503.     color: var(--master-color-partner-dark);
  504. }
  506. .post__comments {
  507.     position: relative;
  508.     padding-left: 24px;
  509. }
  511. .post__comments:before,
  512. .post__comments:after {
  513.     content: '';
  514.     display: block;
  515.     position: absolute;
  516.     border: 1px var(--sub-color) solid;
  517. }
  519. .post__comments:before {
  520.     width: 16px;
  521.     height: 11px;
  522.     border-radius: 50%;
  523.     left: 0;
  524.     top: calc(50% - 8px);
  525.     z-index: 1;
  526. }
  528. .post__comments:after {
  529.     width: 3px;
  530.     height: 6px;
  531.     border-width: 0 1px 1px 0;
  532.     transform: rotate(31deg);
  533.     top: 50%;
  534.     left: 11px;
  535.     z-index: 2;
  536.     background-color: var(--secondary1-bg-color);
  537. } 
  539. /**
  540.  * Breakpoint 900px
  541.  */
  542. @media all and (max-width: 900px) {
  543.     .post-list_grid {
  544.         grid-template-columns: repeat(2, 1fr);
  545.     }
  546.     
  547.     .post-list__post:nth-child(n) {
  548.         background-color: transparent;
  549.         grid-template-areas: 
  550.             "header"
  551.             "footer"
  552.             "pr_img";
  553.         grid-auto-rows: 1fr auto auto;
  554.     }
  555.     
  556.     .post-list__post:nth-child(4n), 
  557.     .post-list__post:nth-child(4n+1) {
  558.         background-color: var(--secondary1-bg-color);
  559.     }
  560.     
  561.     .post-list__post:nth-child(even) {
  562.         grid-template-areas: 
  563.             "pr_img"
  564.             "header"
  565.             "footer";
  566.         grid-auto-rows: auto 1fr auto;    
  567.     }
  568. }
  570. /**
  571.  * Breakpoint 670px
  572.  */
  573. @media all and (max-width: 670px) { 
  574.     .post-list_grid {
  575.         grid-template-columns: 1fr;
  576.     }
  577.     
  578.     .post-list__post:nth-child(n) {
  579.         background-color: var(--secondary1-bg-color);
  580.         grid-template-areas: 
  581.             "header"
  582.             "footer"
  583.             "pr_img";
  584.         grid-auto-rows: 1fr auto auto;
  585.     }
  586.     
  587.     .post-list__post:nth-child(even) {
  588.         background-color: transparent;
  589.     }
  590. } 
  591.   </style>
  592. </head>
  594. <body>
  595.   <div class="container-scroller">
  596.       {{ render(controller("App\\Controller\\General\\Template\\MenuController:menubare", {'position': 'dash'})) }}
  597.       <div class="container-fluid page-body-wrapper">
  598.           {{ render(controller("App\\Controller\\General\\Template\\MenuController:menuleft", {'position': 'dash'})) }}
  599.           <div class="main-panel" style="background: #e8eff9;">
  600.               {% block body %}
  601.                   
  602.               {% endblock %}
  603.               {{ render(controller("App\\Controller\\General\\Template\\MenuController:footer", {'position': 'dash'})) }}
  604.           </div>
  605.       </div>
  606.   </div>
  607.   
  608.   <!-- inject:js -->
  609.       <script src="{{ asset('templatedash/js/off-canvas.js') }}"></script>
  610.       <script src="{{ asset('templatedash/js/hoverable-collapse.js') }}"></script>
  611.       <script src="{{ asset('templatedash/js/template.js') }}"></script>
  612.       <script src="{{ asset('templatedash/js/settings.js') }}"></script>
  613.       <script src="{{ asset('templatedash/js/todolist.js') }}"></script>
  614.   <!-- endinject -->
  616.   <script type="text/javascript">
  617.     {% block javascript %}
  619.     {% endblock %}
  620.   </script>
  621. </body>
  623. </html>