Commit c33bf5fa authored by nursultan's avatar nursultan
Browse files

optimize images and changes style sheets

parent 82341d8b
......@@ -222,7 +222,7 @@ object {
.main-info::before {
content: '';
background-image: linear-gradient(rgba(255, 255, 255, .3), rgba(255, 255, 255, .3)), url("/assets/images/FP_landing_pic.png");
background-image: linear-gradient(rgba(255, 255, 255, .3), rgba(255, 255, 255, .3)), url("/assets/images/FP_landing_pic.webp");
background-repeat: no-repeat;
background-color: transparent;
background-size: cover;
......@@ -239,7 +239,7 @@ object {
margin: auto;
}
.main-info p {
.main-info h1 {
font-size: 40px;
line-height: 54px;
font-weight: bold;
......@@ -465,7 +465,7 @@ object {
.statistic-preview::before {
content: '';
background-image: url("/assets/images/static-bg.jpg");
background-image: url("/assets/images/static-bg.webp");
background-repeat: no-repeat;
background-size: 100% 100%;
position: absolute;
......@@ -825,7 +825,7 @@ object {
/*** usability more styles start ***/
#usability {
background-image: url("/assets/images/FP2_bg.png");
background-image: url("/assets/images/FP2_bg.webp");
background-repeat: no-repeat;
background-color: transparent;
background-size: cover;
......@@ -1016,7 +1016,7 @@ object {
#howItWorks::before {
content: '';
background-image: url("/assets/images/know-more---bg.jpg");
background-image: url("/assets/images/know-more---bg.webp");
background-repeat: no-repeat;
background-size: 100% 100%;
position: absolute;
......
/* Table of Contents
/* ------------------------------------------------------------
This is a development CSS file which is built to a minified
production stylesheet in assets/built/screen.css
1. Global Styles
2. Layout
3. Special Templates
4. Site Header
4.1 Home header
4.2 Archive header
5. Site Navigation
6. Post Feed
7. Single Post
7.1. Post Byline
7.2. Members Subscribe Form
7.3. Comments
7.4. Related Posts
7.5. Koenig Styles
8. Author Template
9. Error Template
10. Subscribe Overlay
11. Site Footer
12. Dark Mode
*/
@import url('https://fonts.googleapis.com/css?family=Exo+2&display=swap');
@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');
/* 1. Global - Set up the things
/* ---------------------------------------------------------- */
/*@import "global.css";*/
/*body {*/
/* background: #fff;*/
/*}*/
body, ul, li, p, span {
margin: 0;
padding: 0;
font-family: 'Open Sans', sans-serif;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
}
.img {
display: block;
......@@ -68,7 +47,7 @@ production stylesheet in assets/built/screen.css
}
.site-main::before{
content: '';
background-image: url("/assets/images/know-more---bg.jpg");
background-image: url("/assets/images/know-more---bg.webp");
background-repeat: no-repeat;
background-size: 100% 100%;
position: absolute;
......@@ -719,7 +698,7 @@ The knock-on effect of this is ugly browser-scroll bars at the bottom, so 80px o
.post-card-excerpt {
max-width: 56em;
color: var(--midgrey);
font-family: Georgia, serif;
font-family: 'Open Sans', sans-serif;
}
.post-card-excerpt p {
......@@ -963,7 +942,7 @@ make sure this only happens on large viewports / desktop-ish devices.
.post-full-header {
position: relative;
margin: 0 auto;
padding: 70px 170px 50px;
padding: 70px 0 0 0;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
}
......@@ -1014,9 +993,9 @@ make sure this only happens on large viewports / desktop-ish devices.
.post-full-custom-excerpt {
margin: 20px 0 0;
color: var(--midgrey);
font-family: Georgia, serif;
font-size: 2.3rem;
line-height: 1.4em;
font-family: 'Open Sans', sans-serif;
font-size: 16px;
line-height: normal;
font-weight: 300;
}
......@@ -1045,10 +1024,10 @@ make sure this only happens on large viewports / desktop-ish devices.
.post-full-content {
position: relative;
margin: 0 auto;
padding: 0 170px 6vw;
padding: 0;
min-height: 230px;
font-family: Georgia, serif;
font-size: 2.0rem;
font-family: 'Open Sans', sans-serif;
font-size: 16px;
line-height: 1.6em;
background: #fff;
}
......@@ -1061,13 +1040,13 @@ make sure this only happens on large viewports / desktop-ish devices.
@media (max-width: 800px) {
.post-full-content {
padding: 0 5vw;
font-size: 1.8rem;
font-size: 14px;
}
}
@media (max-width: 500px) {
.post-full-custom-excerpt {
font-size: 1.9rem;
line-height: 1.5em;
line-height: 13px;
}
}
......@@ -1197,7 +1176,7 @@ Usage (In Ghost editor):
.post-full-content blockquote {
margin: 0 0 1.5em;
padding: 0 1.5em;
border-left: #3eb0ef 3px solid;
border-left: #e31f26 3px solid;
}
@media (max-width: 500px) {
.post-full-content blockquote {
......@@ -1291,13 +1270,13 @@ Usage (In Ghost editor):
.post-full-content h5,
.post-full-content h6 {
color: color(var(--darkgrey) l(-5%));
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
font-family: "Open Sans", sans-serif;
}
.post-full-content h1 {
margin: 0.5em 0 0.4em;
font-size: 4.2rem;
line-height: 1.25em;
font-size: 40px;
line-height: normal;
font-weight: 600;
}
.post-full-content p + h1 {
......@@ -1312,8 +1291,8 @@ Usage (In Ghost editor):
.post-full-content h2 {
margin: 0.5em 0 0.4em;
font-size: 3.2rem;
line-height: 1.25em;
font-size: 24px;
line-height: normal;
font-weight: 600;
}
.post-full-content p + h2 {
......@@ -1322,15 +1301,15 @@ Usage (In Ghost editor):
@media (max-width: 800px) {
.post-full-content h2 {
margin-bottom: 0.3em;
font-size: 2.8rem;
font-size: 20px;
line-height: 1.25em;
}
}
.post-full-content h3 {
margin: 0.5em 0 0.2em;
font-size: 2.5rem;
line-height: 1.3em;
font-size: 18px;
line-height: normal;
font-weight: 600;
}
.post-full-content h2 + h3 {
......@@ -1339,14 +1318,14 @@ Usage (In Ghost editor):
@media (max-width: 800px) {
.post-full-content h3 {
margin-bottom: 0.3em;
font-size: 2.4rem;
font-size: 16px;
line-height: 1.3em;
}
}
.post-full-content h4 {
margin: 0.5em 0 0.2em;
font-size: 2.5rem;
font-size: 16px;
font-weight: 600;
}
.post-full-content h2 + h4 {
......@@ -1358,7 +1337,7 @@ Usage (In Ghost editor):
@media (max-width: 800px) {
.post-full-content h4 {
margin-bottom: 0.3em;
font-size: 2.4rem;
font-size: 14px;
line-height: 1.3em;
}
}
......@@ -1369,9 +1348,9 @@ Usage (In Ghost editor):
padding: 0.4em 1em 0.9em;
border: 0;
color: var(--blue);
font-family: Georgia,serif;
font-size: 3.2rem;
line-height: 1.35em;
font-family: 'Open Sans', sans-serif;
font-size: 13px;
line-height: normal;
text-align: center;
}
@media (min-width: 1180px) {
......@@ -1385,19 +1364,19 @@ Usage (In Ghost editor):
margin-bottom: 1em;
margin-left: 1.3em;
padding: 0 0 0.5em;
font-size: 2.4rem;
font-size: 12px;
text-align: initial;
}
}
.post-full-content h6 {
margin: 0.5em 0 0.2em 0;
font-size: 2.0rem;
font-size: 10px;
font-weight: 700;
}
@media (max-width: 800px) {
.post-full-content h6 {
font-size: 1.8rem;
font-size: 8px;
line-height: 1.4em;
}
}
......@@ -1475,7 +1454,7 @@ Usage (In Ghost editor):
width: auto;
border-spacing: 0;
border-collapse: collapse;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
font-family: "Open Sans", sans-serif;
font-size: 1.6rem;
white-space: nowrap;
vertical-align: top;
......@@ -1884,7 +1863,7 @@ Usage (In Ghost editor):
.read-next {
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
background: color(var(--darkgrey) l(-5%));
background: #F1F1F1;
}
.read-next-feed {
......@@ -2131,7 +2110,7 @@ Usage (In Ghost editor):
.post-full-content figcaption {
margin: 1.0em 0 0;
color: color(var(--midgrey) l(-10%));
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
font-family: "Open Sans", sans-serif;
font-size: 75%;
line-height: 1.5em;
text-align: center;;
......@@ -2215,7 +2194,7 @@ Usage (In Ghost editor):
display: flex;
min-height: 148px;
color: var(--darkgrey);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
font-family: "Open Sans", sans-serif;
text-decoration: none;
border-radius: 3px;
box-shadow: 0 2px 5px -1px rgba(0, 0, 0, 0.15), 0 0 1px rgba(0, 0, 0, 0.09);
......@@ -2712,7 +2691,7 @@ Usage (In Ghost editor):
margin: 0 auto 50px;
max-width: 650px;
color: #fff;
font-family: Georgia, serif;
font-family: 'Open Sans', sans-serif;
font-size: 2.4rem;
line-height: 1.3em;
font-weight: 300;
......
......@@ -6,6 +6,11 @@
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="description"
content="Системы мониторинга работы оборудования, повышение эффективности работы промышленного произвоства.
Жабдықтардың жұмысын бақылау, өндірістік жабдықтардың тиімділігін арттыру жүйелері.
Systems for monitoring the operation of equipment, increasing the efficiency of industrial equipment
"/>
<link rel="stylesheet" type="text/css" href="{{asset "css/screen.css"}}"/>
<link rel="stylesheet" type="text/css" href="{{asset "css/main.css"}}"/>
<link rel="stylesheet" type="text/css" href="{{asset "css/media.css"}}"/>
......
......@@ -34,9 +34,9 @@
<main id="site-main">
<div class="main-info">
<div>
<p>
<h1>
Improve your overall equipment effectiveness (OEE), <br/> reduce the cost per unit <br/>with real-time control
</p>
</h1>
<span>SCADA HMI II<b>o</b>T MES</span>
</div>
<button class="main--btn">Contact us</button>
......@@ -73,7 +73,7 @@
<!------------- know more section start -------------------->
<section id="know-more">
<span></span>
<img src="../assets/images/know-more---bg.jpg" alt="bg">
<img src="../assets/images/know-more---bg.webp" alt="bg">
<div class="know-more--title">
<p>Current manufacturing challenges</p>
</div>
......@@ -215,7 +215,7 @@
<div class="usability-cards">
<div class="usability-card" data-direction="right">
<span class="usability-card--title">OIL AND GAS</span>
<img src="../assets/images/usability-img-1.jpg" alt="bg" />
<img src="../assets/images/usability-img-1.webp" alt="bg" />
<div class="usability-card--tooltip">
<div>
<span>OIL AND GAS</span>
......@@ -232,7 +232,7 @@
</div>
<div class="usability-card" data-direction="bottom">
<span class="usability-card--title">FMCG</span>
<img src="../assets/images/usability-img-2.jpg" alt="bg" />
<img src="../assets/images/usability-img-2.webp" alt="bg" />
<div class="usability-card--tooltip">
<div>
<span>FMCG</span>
......@@ -250,7 +250,7 @@
</div>
<div class="usability-card" data-direction="left">
<span class="usability-card--title">DISCRETE MANUFACTURING</span>
<img src="../assets/images/usability-img-3.jpg" alt="bg" />
<img src="../assets/images/usability-img-3.webp" alt="bg" />
<div class="usability-card--tooltip">
<div>
<span>DISCRETE MANUFACTURING</span>
......@@ -268,7 +268,7 @@
</div>
<div class="usability-card" data-direction="right">
<span class="usability-card--title">MINING</span>
<img src="../assets/images/usability-img-4.jpg" alt="bg" />
<img src="../assets/images/usability-img-4.webp" alt="bg" />
<div class="usability-card--tooltip">
<div>
<span>MINING</span>
......@@ -285,7 +285,7 @@
</div>
<div class="usability-card" data-direction="top">
<span class="usability-card--title">ENERGY AND TRANSPORTATION</span>
<img src="../assets/images/usability-img-5.jpg" alt="bg" />
<img src="../assets/images/usability-img-5.webp" alt="bg" />
<div class="usability-card--tooltip">
<div>
<span>ENERGY AND TRANSPORTATION</span>
......@@ -302,7 +302,7 @@
</div>
<div class="usability-card" data-direction="left">
<span class="usability-card--title">SMART CITY</span>
<img src="../assets/images/usability-img-6.jpg" alt="bg" />
<img src="../assets/images/usability-img-6.webp" alt="bg" />
<div class="usability-card--tooltip">
<div>
<span>SMART CITY</span>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment