templates/services/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block body %}
  5.                             <!-- PAGE-HEADER -->
  6.                             <div class="page-header">
  7.                                 <div>
  8.                                     <h1 class="page-title">Services</h1>
  9.                                 </div>
  10.                                 <div class="ms-auto pageheader-btn">
  11.                                     <ol class="breadcrumb">
  12.                                         <li class="breadcrumb-item"><a href="javascript:void(0);">Pages</a></li>
  13.                                         <li class="breadcrumb-item active" aria-current="page">Services</li>
  14.                                     </ol>
  15.                                 </div>
  16.                             </div>
  17.                             <!-- PAGE-HEADER END -->
  19.                             <!-- ROW-1 OPEN -->
  20.                             <div class="row">
  21.                                 <div class="col-sm-12 col-md-6 col-lg-6 col-xl-3 ">
  22.                                     <div class="card service">
  23.                                         <div class="card-body">
  24.                                             <div class="item-box text-center">
  25.                                                 <div class=" text-center  mb-4 text-primary"><i class="icon icon-people"></i></div>
  26.                                                 <div class="item-box-wrap">
  27.                                                     <h5 class="mb-2">Creative solutions</h5>
  28.                                                     <p class="text-muted mb-0">No duo tempor nonumy justo tempor nonumy accusam. Ipsum eos. Nonumy ipsum takimata.</p>
  29.                                                 </div>
  30.                                             </div>
  31.                                         </div>
  32.                                     </div>
  33.                                 </div>
  34.                                 <div class="col-sm-12 col-md-6 col-lg-6 col-xl-3">
  35.                                     <div class="card service">
  36.                                         <div class="card-body">
  37.                                             <div class="item-box text-center">
  38.                                                 <div class=" text-center text-secondary mb-4"><i class="icon icon-clock"></i></div>
  39.                                                 <div class="item-box-wrap">
  40.                                                     <h5 class="mb-2">Trace your time</h5>
  41.                                                     <p class="text-muted mb-0">Et at aliquyam no eos kasd nonumy, ipsum vero est est tempor</p>
  42.                                                 </div>
  43.                                             </div>
  44.                                         </div>
  45.                                     </div>
  46.                                 </div>
  47.                                 <div class="col-sm-12 col-md-6 col-lg-6 col-xl-3">
  48.                                     <div class="card service">
  49.                                         <div class="card-body">
  50.                                             <div class="item-box text-center">
  51.                                                 <div class=" text-center text-info mb-4"><i class="fa fa-building-o"></i></div>
  52.                                                 <div class="item-box-wrap">
  53.                                                     <h5 class="mb-2">Business FrameWork</h5>
  54.                                                     <p class="text-muted mb-0">Sanctus ipsum dolores clita gubergren dolor tempor elitr. Et voluptua.</p>
  55.                                                 </div>
  56.                                             </div>
  57.                                         </div>
  58.                                     </div>
  59.                                 </div>
  60.                                 <div class="col-sm-12 col-md-6 col-lg-6 col-xl-3">
  61.                                     <div class="card service">
  62.                                         <div class="card-body">
  63.                                             <div class="item-box text-center">
  64.                                                 <div class="text-center text-warning mb-4"><i class="icon icon-action-redo"></i></div>
  65.                                                 <div class="item-box-wrap">
  66.                                                     <h5 class="mb-2">Shares</h5>
  67.                                                     <p class="text-muted mb-0">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium</p>
  68.                                                 </div>
  69.                                             </div>
  70.                                         </div>
  71.                                     </div>
  72.                                 </div>
  73.                             </div>
  74.                             <!-- ROW-1 CLOSE -->
  76.                             <!-- ROW-2 OPEN -->
  77.                             <div class="row">
  78.                                 <div class="col-lg-6 col-md-6">
  79.                                     <div class="card">
  80.                                         <div class="card-body">
  81.                                             <div class="row">
  82.                                                 <div class="col-xl-auto feature">
  83.                                                     <div class="fa-stack fa-lg fa-1x border bg-primary mb-3">
  84.                                                         <i class="fa fa-code fa-stack-1x text-white"></i>
  85.                                                     </div>
  86.                                                 </div>
  87.                                                 <div class="col-xl col-lg-12">
  88.                                                     <div class="mt-1">
  89.                                                         <h4 class="fw-semibold">Web design</h4>
  90.                                                         <p class="mb-0">Accusam sed erat diam kasd eos, consetetur duo sanctus diam no elitr diam ipsum nonumy. Labore et et diam est et invidunt ea.
  91.                                                         Rebum takimata et amet est ipsum justo dolore sanctus. Sit sadipscing ea eirmod et dolore. Dolores takimata takimata diam ut nonumy diam kasd sanctus takimata. Diam dolores.
  92.                                                         Et tempor est et lorem.</p>
  93.                                                     </div>
  94.                                                 </div>
  95.                                             </div>
  96.                                         </div>
  97.                                     </div>
  98.                                 </div>
  99.                                 <div class="col-lg-6 col-md-6">
  100.                                     <div class="card">
  101.                                         <div class="card-body">
  102.                                             <div class="row">
  103.                                                 <div class="col-xl-auto feature">
  104.                                                     <div class="fa-stack fa-lg fa-1x border bg-secondary mb-3">
  105.                                                         <i class="fa fa-terminal fa-stack-1x text-white"></i>
  106.                                                     </div>
  107.                                                 </div>
  108.                                                 <div class="col-xl col-lg-12">
  109.                                                     <div class="mt-1">
  110.                                                         <h4 class="fw-semibold">Web Development</h4>
  111.                                                         <p class="mb-0">Nonumy amet dolor eos no ut voluptua magna et. Dolores diam sadipscing sed et magna eirmod. Diam accusam gubergren aliquyam est lorem dolor.
  112.                                                         Sea et stet sed labore sed ipsum at. Sed accusam dolores sea erat dolore ipsum, accusam accusam ut elitr magna no elitr ut dolores, ipsum dolor sed.
  113.                                                         Sea amet elitr.</p>
  114.                                                     </div>
  115.                                                 </div>
  116.                                             </div>
  117.                                         </div>
  118.                                     </div>
  119.                                 </div>
  120.                                 <div class="col-lg-6 col-md-6">
  121.                                     <div class="card">
  122.                                         <div class="card-body">
  123.                                             <div class="row">
  124.                                                 <div class="col-xl-auto feature">
  125.                                                     <div class="fa-stack fa-lg fa-1x border bg-info mb-3">
  126.                                                         <i class="fa fa-file-word-o fa-stack-1x text-white"></i>
  127.                                                     </div>
  128.                                                 </div>
  129.                                                 <div class="col-xl col-lg-12">
  130.                                                     <div class="mt-1">
  131.                                                         <h4 class="fw-semibold">Wordpress</h4>
  132.                                                         <p class="mb-0">Invidunt at et stet consetetur eos accusam dolor. Sanctus sed et et aliquyam ipsum, sed invidunt justo lorem lorem eirmod dolores vero sea..
  133.                                                         Ipsum et duo dolor eirmod dolor dolore rebum erat. No sit takimata sed justo diam. Vero aliquyam kasd dolore lorem ipsum takimata. Sanctus eirmod lorem justo amet.
  134.                                                         Diam at nonumy est sanctus.</p>
  135.                                                     </div>
  136.                                                 </div>
  137.                                             </div>
  138.                                         </div>
  139.                                     </div>
  140.                                 </div>
  141.                                 <div class="col-lg-6 col-md-6">
  142.                                     <div class="card">
  143.                                         <div class="card-body">
  144.                                             <div class="row">
  145.                                                 <div class="col-xl-auto feature">
  146.                                                     <div class="fa-stack fa-lg fa-1x border bg-success mb-3">
  147.                                                         <i class="fa fa-camera fa-stack-1x text-white"></i>
  148.                                                     </div>
  149.                                                 </div>
  150.                                                 <div class="col-xl col-lg-12">
  151.                                                     <div class="mt-1">
  152.                                                         <h4 class="fw-semibold">photography</h4>
  153.                                                         <p class="mb-0">Magna nonumy ut invidunt lorem ipsum consetetur est, accusam amet elitr et et sanctus et nonumy est, et gubergren amet eos lorem kasd.
  154.                                                         Takimata elitr kasd ipsum magna et clita stet ea ea no. Sadipscing ut invidunt justo labore consetetur lorem elitr est dolores, duo lorem ea kasd eos. Duo.
  155.                                                         Ut est dolor erat magna.</p>
  156.                                                     </div>
  157.                                                 </div>
  158.                                             </div>
  159.                                         </div>
  160.                                     </div>
  161.                                 </div>
  162.                                 <div class="col-lg-6 col-md-6">
  163.                                     <div class="card">
  164.                                         <div class="card-body">
  165.                                             <div class="row">
  166.                                                 <div class="col-xl-auto feature">
  167.                                                     <div class="fa-stack fa-lg fa-1x border bg-warning mb-3">
  168.                                                         <i class="fa fa-globe fa-stack-1x text-white"></i>
  169.                                                     </div>
  170.                                                 </div>
  171.                                                 <div class="col-xl col-lg-12">
  172.                                                     <div class="mt-1">
  173.                                                         <h4 class="fw-semibold">Development</h4>
  174.                                                         <p class="mb-0">Rebum sanctus duo sed sit no invidunt stet, lorem invidunt stet et duo rebum stet sea sea kasd. Sadipscing voluptua dolore et kasd,.
  175.                                                         Ipsum vero tempor at duo amet magna sea, et dolore est aliquyam et labore et et consetetur, aliquyam et dolores consetetur est ut ut nonumy aliquyam. Ipsum.
  176.                                                         Kasd takimata tempor dolor diam.</p>
  177.                                                     </div>
  178.                                                 </div>
  179.                                             </div>
  180.                                         </div>
  181.                                     </div>
  182.                                 </div>
  183.                                 <div class="col-lg-6 col-md-6">
  184.                                     <div class="card">
  185.                                         <div class="card-body">
  186.                                             <div class="row">
  187.                                                 <div class="col-xl-auto feature">
  188.                                                     <div class="fa-stack fa-lg fa-1x border bg-orange mb-3">
  189.                                                         <i class="fa fa-android fa-stack-1x text-white"></i>
  190.                                                     </div>
  191.                                                 </div>
  192.                                                 <div class="col-xl col-lg-12">
  193.                                                     <div class="mt-1">
  194.                                                         <h4 class="fw-semibold">Android</h4>
  195.                                                         <p class="mb-0">Voluptua ipsum diam et ea et consetetur tempor voluptua sea. Sadipscing eirmod et sit at, est stet magna ipsum lorem dolores dolores sed,.
  196.                                                         Et dolores et dolor sed et takimata nonumy. Dolor amet elitr ipsum rebum dolore duo sed stet. Labore lorem gubergren sanctus elitr et sit, erat duo et.
  197.                                                         Duo dolores sea dolor voluptua.</p>
  198.                                                     </div>
  199.                                                 </div>
  200.                                             </div>
  201.                                         </div>
  202.                                     </div>
  203.                                 </div>
  204.                             </div>
  205.                             <!-- ROW-2 CLOSE -->
  207.                             <!-- ROW-3 OPEN -->
  208.                             <div class="row">
  209.                                 <div class="col-md-12 col-lg-12">
  210.                                     <div class="card">
  211.                                         <div class="card-header border-bottom">
  212.                                             <h3 class="card-title">Our services</h3>
  213.                                         </div>
  214.                                         <div class="card-body">
  215.                                             <div class="text-wrap">
  216.                                                 <p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text</p>
  217.                                                 <div class="row mt-3">
  218.                                                     <div class="col-md-6">
  219.                                                         <label>Web Design</label>
  220.                                                         <div class="progress progress-md mb-3">
  221.                                                             <div class="progress-bar bg-primary wp-50">50%</div>
  222.                                                         </div>
  223.                                                     </div>
  224.                                                     <div class="col-md-6">
  225.                                                         <label>Web Development</label>
  226.                                                         <div class="progress progress-md mb-3">
  227.                                                             <div class="progress-bar bg-secondary wp-70">70%</div>
  228.                                                         </div>
  229.                                                     </div>
  230.                                                     <div class="col-md-6">
  231.                                                         <label>Wordpress</label>
  232.                                                         <div class="progress progress-md mb-3">
  233.                                                             <div class="progress-bar  bg-info wp-80">80%</div>
  234.                                                         </div>
  235.                                                     </div>
  236.                                                     <div class="col-md-6">
  237.                                                         <label>Photography</label>
  238.                                                         <div class="progress progress-md mb-3">
  239.                                                             <div class="progress-bar bg-success wp-75">75%</div>
  240.                                                         </div>
  241.                                                     </div>
  242.                                                     <div class="col-md-6">
  243.                                                         <label>Development</label>
  244.                                                         <div class="progress progress-md mb-3 mb-md-0">
  245.                                                             <div class="progress-bar bg-warning wp-65">80%</div>
  246.                                                         </div>
  247.                                                     </div>
  248.                                                     <div class="col-md-6">
  249.                                                         <label>Android</label>
  250.                                                         <div class="progress progress-md mb-0">
  251.                                                             <div class="progress-bar bg-orange wp-70">69%</div>
  252.                                                         </div>
  253.                                                     </div>
  254.                                                 </div>
  255.                                             </div>
  256.                                         </div>
  257.                                     </div>
  258.                                 </div>
  259.                             </div>
  260.                             <!-- ROW-3 CLOSED -->
  261. {% endblock %}
  262. {% block javascripts %}
  263.    {{parent()}} 
  264.         <!-- SPARKLINE JS-->
  265.         <script src="{{absolute_url(asset('build/plugins/jquery/jquery.sparkline.min.js'))}}"></script>
  267.         <!-- CHART-CIRCLE JS-->
  268.         <script src="{{absolute_url(asset('build/plugins/circle-progress/circle-progress.min.js'))}}"></script>
  270.         <!-- INPUT MASK JS-->
  271.         <script src="{{absolute_url(asset('build/plugins/input-mask/jquery.mask.min.js'))}}"></script>
  272.         
  273.         <!-- SIDEBAR JS -->
  274.         <script src="{{absolute_url(asset('build/plugins/sidebar/sidebar.js'))}}"></script>
  275. {% endblock %}