amirreza.jamali/tm-landing
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add index page

Browse Source
This commit is contained in:
m.pourmohamadi
2025-08-24 20:58:48 +03:30
parent 5400c170ee
commit e4040bf6c4
15 changed files with 682 additions and 128 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/style.css
+234 -20
View File
@@ -1,74 +1,288 @@
@font-face {
font-family: 'IRAN SANS';
src: url('../font/IRAN SANS.TTF') format("truetype");
font-family: "IRAN SANS";
src: url("../font/IRAN SANS.TTF") format("truetype");
}
@font-face {
font-family: "MTNIrancell-Regular";
src: url("../font/MTNIrancell-Regular.eot?#iefix");
src: url("../font/MTNIrancell-Regular.eot?#iefix") format("eot"), url("../font/MTNIrancell-Regular.woff") format("woff"), url("../font/MTNIrancell-Regular.woff2") format("woff2"), url("../font/MTNIrancell-Regular.ttf") format("truetype");
font-weight: normal;
font-style: normal;
font-family: "Lato-Regular";
src: url("../font/Lato-Regular.ttf") format("truetype");
}
@font-face {
font-family: "MTNIrancell-Bold";
src: url("../font/MTNIrancell-Bold.eot?#iefix");
src: url("../font/MTNIrancell-Bold.eot?#iefix") format("eot"), url("../font/MTNIrancell-Bold.woff") format("woff"), url("./assets/fonts/MTNIrancell-Bold.woff2") format("woff2"), url("./assets/fonts/MTNIrancell-Bold.ttf") format("truetype");
font-weight: normal;
font-style: normal;
font-family: "Roboto";
src: url("../font/Roboto-Regular.ttf") format("truetype");
}
@font-face {
font-family: "Roboto-Bold";
src: url("../font/Roboto-ExtraBold.ttf") format("truetype");
}
html body {
position: relative;
min-height: 100%;
font-family: "MTNIrancell-Regular";
font-family: "Roboto";
font-size: 16px;
color: #505050;
margin: 0;
direction: ltr;
}
html:focus,
body:focus,
*:focus {
outline: unset;
}
* {
box-sizing: border-box;
}
a {
text-decoration: none;
}
ul {
padding: 0;
margin: 0;
}
li {
list-style: none;
}
ul,
li,
h1,
h2,
h3,
h4,
h5,
h6,
p,
strong,
span {
margin: 0;
padding: 0;
}
html body button {
cursor: pointer;
}
html body a {
color: #505050;
}
html body a:hover {
text-decoration: none;
color: #505050;
}
::-webkit-scrollbar {
width: 7.5px;
}
::-webkit-scrollbar-track {
box-shadow: inset 0 0 5px grey;
border-radius: 15px;
}
::-webkit-scrollbar-thumb {
background: #a0a0a0;
border-radius: 15px;
}
::-webkit-scrollbar-thumb:hover {
background: #a0a0a0;
}
.english {
font-family: 'Lato-Regular' !important;
font-size: 14px !important;
vertical-align: -2px;
.blue-btn {
font-size: 14px;
padding: 20px 49px;
background-color: #0164FF;
color: #fff;
border-radius: 50px;
margin: 0 10px;
font-weight: 500;
}
.persian {
font-family: "MTNIrancell-Regular" !important;
font-size: 20px !important;
.white-btn {
font-size: 14px;
padding: 20px 10px;
background-color: #fff;
color: #0164FF;
border-radius: 50px;
margin: 0 10px;
font-weight: 500;
}
.main-section {
position: relative;
}
.main-section .effect-one {
height: 384px;
width: 384px;
position: absolute;
left: 0;
top: 100px;
z-index: -1;
}
.container {
max-width: 1080px;
margin-right: auto;
margin-left: auto;
}
.header {
height: 76px;
display: flex;
align-items: center;
justify-content: space-between;
}
.header .header-side {
display: flex;
align-items: center;
justify-content: center;
}
.slider {
padding-top: 15px;
}
.slider .slider-inner {
display: flex;
justify-content: space-between;
}
.slider .s-left {
width: 50%;
padding-top: 50px;
}
.slider .s-left h1 {
font-family: "Roboto-Bold";
font-size: 89px;
font-weight: 900;
background-image: radial-gradient(52.27% 52.27% at 50% 50%, #0164FF 0%, #2EEAE1 100%);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
}
.slider .s-left h3 {
font-family: "Roboto-Bold";
font-weight: 900;
font-size: 48px;
color: #0164FF;
margin-top: 40px;
margin-bottom: 40px;
}
.slider .s-left strong {
font-family: "Roboto-Bold";
font-weight: 900;
font-size: 32px;
color: #222222;
}
.slider .s-left p {
font-size: 16px;
font-weight: 400;
color: #777;
margin-top: 20px;
}
.slider .s-right {
width: 50%;
}
.slider .s-right .s-right-inner {
position: relative;
}
.slider .s-right .s-right-inner img {
position: absolute;
top: 0;
right: -25%;
}
.our-sec {
padding-top: 120px;
padding-bottom: 130px;
}
.our-sec .our-sec-inner {
display: flex;
align-items: center;
justify-content: space-between;
}
.our-sec .our-sec-inner .os-item {
width: 30%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
.our-sec .our-sec-inner .os-item h1 {
font-family: "Roboto-Bold";
font-size: 89px;
font-weight: 900;
background-image: radial-gradient(52.27% 52.27% at 50% 50%, #0164FF 0%, #2EEAE1 100%);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
margin-bottom: 20px;
}
.our-sec .our-sec-inner .os-item span {
font-size: 20px;
color: #000;
font-weight: 600;
}
.our-sec .our-sec-inner .os-item p {
margin-top: 20px;
font-size: 16px;
color: #777777;
text-align: center;
}
.footer {
position: relative;
}
.footer .effect-2 {
position: absolute;
right: 0;
bottom: 0;
z-index: -1;
}
.footer .footter-inner {
display: flex;
align-items: center;
justify-content: space-between;
flex-direction: column;
padding-top: 30px;
padding-bottom: 50px;
border-top: 1px solid #e7e7e7;
}
.footer .footter-inner .f-top {
padding-bottom: 40px;
}
.footer .footter-inner .f-top img {
width: 177px;
}
.footer .footter-inner .f-midd {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 40px;
}
.footer .footter-inner .f-midd .footer-item {
width: 32%;
display: flex;
align-items: center;
justify-content: center;
}
.footer .footter-inner .f-midd .footer-item span {
display: flex;
align-items: center;
justify-content: center;
}
.footer .footter-inner .f-midd .footer-item span img {
margin-right: 20px;
}
.footer .footter-inner .f-bott p {
font-size: 12px;
color: #9E9E9E;
text-align: center;
padding-bottom: 15px;
}
/*# sourceMappingURL=style.css.map */
assets/css/style.css.map
+1 -1
View File
@@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["../scss/style.scss"],"names":[],"mappings":"AAAA;EACI","file":"style.css"}
{"version":3,"sourceRoot":"","sources":["../scss/style.scss"],"names":[],"mappings":"AAAA;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;AAAA;AAAA;EAGE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAWE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAaF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAQF;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EACE;EACA;EACA;;;AAIF;EACE;EACA;EACA;EACA;;AAIA;EACE;EACA;EACA;;;AAKJ;EACE;;AAEA;EACE;EAEA;;AAGF;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAIJ;EACE;;AAEA;EACE;;AAEA;EACE;EACA;EACA;;;AAcR;EACE;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;;AAOR;EACE;;AAGA;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGA;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;;AAYN;EACE;EACA;EACA;EACA","file":"style.css"}
assets/font/Roboto-ExtraBold.ttf
BIN
View File
Binary file not shown.
assets/font/Roboto-Regular.ttf
BIN
View File
Binary file not shown.
assets/image/Location.svg
+4
View File
@@ -0,0 +1,4 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M20 11.1755C20 15.6907 16.4183 21 12 21C7.58172 21 4 15.6907 4 11.1755C4 6.66029 7.58172 3 12 3C16.4183 3 20 6.66029 20 11.1755Z" fill="#F4F4F4" stroke="#0164FF" stroke-width="1.5"/>
<path d="M9.5 10.5C9.5 9.11929 10.6193 8 12 8C13.3807 8 14.5 9.11929 14.5 10.5C14.5 11.8807 13.3807 13 12 13C10.6193 13 9.5 11.8807 9.5 10.5Z" stroke="#0164FF" stroke-width="1.5"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 476 B

assets/image/Message.svg
+4
View File
@@ -0,0 +1,4 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2.88539 8.84875C3.55805 6.13984 5.70602 4.04534 8.43056 3.44162L8.88443 3.34105C10.9366 2.88632 13.0634 2.88632 15.1156 3.34105L15.5694 3.44162C18.294 4.04534 20.442 6.13984 21.1146 8.84876C21.6285 10.9182 21.6285 13.0819 21.1146 15.1512C20.442 17.8602 18.294 19.9547 15.5694 20.5584L15.1156 20.659C13.0634 21.1137 10.9366 21.1137 8.88443 20.659L8.43055 20.5584C5.70601 19.9547 3.55805 17.8602 2.88539 15.1513C2.37154 13.0819 2.37154 10.9181 2.88539 8.84875Z" fill="#F4F4F4"/>
<path d="M4.30225 6.5004L10.0825 10.63C11.2295 11.4496 12.7705 11.4496 13.9175 10.63L19.6977 6.5004M2.88539 15.1513C2.37154 13.0819 2.37154 10.9181 2.88539 8.84875C3.55805 6.13984 5.70602 4.04534 8.43056 3.44162L8.88443 3.34105C10.9366 2.88632 13.0634 2.88632 15.1156 3.34105L15.5694 3.44162C18.294 4.04534 20.442 6.13984 21.1146 8.84876C21.6285 10.9182 21.6285 13.0819 21.1146 15.1512C20.442 17.8602 18.294 19.9547 15.5694 20.5584L15.1156 20.659C13.0634 21.1137 10.9366 21.1137 8.88443 20.659L8.43055 20.5584C5.70601 19.9547 3.55805 17.8602 2.88539 15.1513Z" stroke="#0164FF" stroke-width="1.5" stroke-linecap="round"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

assets/image/Phone.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 598 B

assets/image/effect-1.svg
+9
View File
File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 4.8 MiB

assets/image/effect-2.svg
+11
View File
File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 4.8 MiB

assets/image/logo.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.4 KiB

assets/image/mobile.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 83 KiB

assets/scss/style.scss
+298 -4
View File
@@ -7,13 +7,26 @@
font-family: 'Lato-Regular';
src: url('../font/Lato-Regular.ttf') format("truetype");
}
@font-face {
font-family: 'Roboto';
src: url('../font/Roboto-Regular.ttf') format("truetype");
}
@font-face {
font-family: 'Roboto-Bold';
src: url('../font/Roboto-ExtraBold.ttf') format("truetype");
}
html body {
position: relative;
min-height: 100%;
font-family: "Lato-Regular";
font-family: "Roboto";
font-size: 16px;
color: #505050;
margin: 0;
direction: ltr;
}
html:focus,
@@ -21,41 +34,322 @@ body:focus,
*:focus {
outline: unset;
}
* {
box-sizing: border-box;
}
a {
text-decoration: none;
}
ul {
padding: 0;
margin: 0;
}
li {
list-style: none;
}
ul , li , h1 , h2 , h3 , h4 , h5 , h6 , p ,strong , span{
margin: 0;
padding: 0;
ul,
li,
h1,
h2,
h3,
h4,
h5,
h6,
p,
strong,
span {
margin: 0;
padding: 0;
}
html body button {
cursor: pointer;
}
html body a {
color: #505050;
}
html body a:hover {
text-decoration: none;
color: #505050;
}
::-webkit-scrollbar {
width: 7.5px;
}
::-webkit-scrollbar-track {
box-shadow: inset 0 0 5px grey;
border-radius: 15px;
}
::-webkit-scrollbar-thumb {
background: #a0a0a0;
border-radius: 15px;
}
::-webkit-scrollbar-thumb:hover {
background: #a0a0a0;
}
// =====================================
.blue-btn {
font-size: 14px;
padding: 20px 49px;
background-color: #0164FF;
color: #fff;
border-radius: 50px;
margin: 0 10px;
font-weight: 500;
}
.white-btn {
font-size: 14px;
padding: 20px 10px;
background-color: #fff;
color: #0164FF;
border-radius: 50px;
margin: 0 10px;
font-weight: 500;
}
// =====================================
.main-section {
position: relative;
.effect-one {
height: 384px;
width: 384px;
position: absolute;
left: 0;
top: 100px;
z-index: -1;
}
}
.container {
max-width: 1080px;
margin-right: auto;
margin-left: auto;
}
.header {
height: 76px;
display: flex;
align-items: center;
justify-content: space-between;
.header-logo {}
.header-side {
display: flex;
align-items: center;
justify-content: center;
}
}
.slider {
padding-top: 15px;
.slider-inner {
display: flex;
// align-items: center;
justify-content: space-between;
}
.s-left {
width: 50%;
padding-top: 50px;
h1 {
font-family: 'Roboto-Bold';
font-size: 89px;
font-weight: 900;
background-image: radial-gradient(52.27% 52.27% at 50% 50%, #0164FF 0%, #2EEAE1 100%);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
// margin-bottom: 50px;
}
h3 {
font-family: 'Roboto-Bold';
font-weight: 900;
font-size: 48px;
color: #0164FF;
margin-top: 40px;
margin-bottom: 40px;
}
strong {
font-family: 'Roboto-Bold';
font-weight: 900;
font-size: 32px;
color: #222222;
}
p {
font-size: 16px;
font-weight: 400;
color: #777;
margin-top: 20px;
}
}
.s-right {
width: 50%;
.s-right-inner {
position: relative;
img {
position: absolute;
top: 0;
right: -25%;
}
}
}
}
.our-sec {
padding-top: 120px;
padding-bottom: 130px;
.our-sec-inner {
display: flex;
align-items: center;
justify-content: space-between;
.os-item {
width: 30%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
h1 {
font-family: 'Roboto-Bold';
font-size: 89px;
font-weight: 900;
background-image: radial-gradient(52.27% 52.27% at 50% 50%, #0164FF 0%, #2EEAE1 100%);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
margin-bottom: 20px;
}
span {
font-size: 20px;
color: #000;
font-weight: 600;
}
p {
margin-top: 20px;
font-size: 16px;
color: #777777;
text-align: center;
}
}
}
}
.footer {
position: relative;
.effect-2 {
position: absolute;
right: 0;
bottom: 0;
z-index: -1;
}
.footter-inner {
display: flex;
align-items: center;
justify-content: space-between;
flex-direction: column;
padding-top: 30px;
padding-bottom: 50px;
border-top: 1px solid #e7e7e7;
.f-top {
padding-bottom: 40px;
img {
width: 177px;
}
}
.f-midd {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 40px;
.footer-item {
width: 32%;
display: flex;
align-items: center;
justify-content: center;
span {
display: flex;
align-items: center;
justify-content: center;
img {
margin-right: 20px;
}
}
}
}
.f-bott {
p {
font-size: 12px;
color: #9E9E9E;
text-align: center;
padding-bottom: 15px;
}
}
}
}
css/style.css
-73
View File
@@ -1,73 +0,0 @@
@font-face {
font-family: "IRAN SANS";
src: url("../font/IRAN SANS.TTF") format("truetype");
}
@font-face {
font-family: "Lato-Regular";
src: url("../font/Lato-Regular.ttf") format("truetype");
}
html body {
position: relative;
min-height: 100%;
font-family: "Lato-Regular";
font-size: 16px;
color: #505050;
margin: 0;
}
html:focus,
body:focus,
*:focus {
outline: unset;
}
* {
box-sizing: border-box;
}
ul {
padding: 0;
margin: 0;
}
li {
list-style: none;
}
ul, li, h1, h2, h3, h4, h5, h6, p, strong, span {
margin: 0;
padding: 0;
}
html body button {
cursor: pointer;
}
html body a {
color: #505050;
}
html body a:hover {
text-decoration: none;
color: #505050;
}
::-webkit-scrollbar {
width: 7.5px;
}
::-webkit-scrollbar-track {
box-shadow: inset 0 0 5px grey;
border-radius: 15px;
}
::-webkit-scrollbar-thumb {
background: #a0a0a0;
border-radius: 15px;
}
::-webkit-scrollbar-thumb:hover {
background: #a0a0a0;
}
/*# sourceMappingURL=style.css.map */
css/style.css.map
-1
View File
@@ -1 +0,0 @@
{"version":3,"sourceRoot":"","sources":["../assets/scss/style.scss"],"names":[],"mappings":"AAAA;EACE;EACA;;AAGF;EACE;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;AAAA;AAAA;EAGE;;;AAEF;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;;;AAEF;EACI;EACA;;;AAEJ;EACE;;;AAEF;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE","file":"style.css"}
index.html
+121 -29
View File
@@ -1,49 +1,141 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
<title>Irancell</title>
<title>tm landing</title>
<link rel="stylesheet" href="assets/css/style.css">
</head>
<body style="height: 100%">
<div class="container">
<div class="main">
<div class="main-box-left">
<ul class="slider-box">
<li class="active">
<img class="xl d-none" src="./assets/image/slide-xl.jpg" alt="">
<img class="md d-none" src="./assets/image/slider-md.jpg" alt="">
</li>
<body>
<div class="main-section">
<div class="effect-one">
<img src="./assets/image/effect-1.svg" alt="">
</div>
<li class="">
<img class="xl d-none" src="./assets/image/slide-xl.jpg" alt="">
<img class="md d-none" src="./assets/image/slider-md.jpg" alt="">
</li>
<li class="">
<img class="xl d-none" src="./assets/image/slide-xl.jpg" alt="">
<img class="md d-none" src="./assets/image/slider-md.jpg" alt="">
</li>
</ul>
<div class="container">
<div class="slider-dots">
<div class="slider-bots-box"></div>
<div class="header">
<div class="header-logo">
<img src="./assets/image/logo.png" alt="">
</div>
</div>
<div class="main-box-right">
<div>
<img src="./assets/image/mtni-black-fa.svg" alt="">
<div class="mbr-btns">
<a href="https://www.irancell.ir/">محصولات ایرانسل</a>
<a href="https://www.google.com/">جستجو در گوگل</a>
<div class="header-side">
<div>
<a class="white-btn" href="">Contact us</a>
<a class="blue-btn" href="">Login</a>
</div>
<div>
eng
</div>
</div>
</div>
<div class="slider">
<div class="slider-inner">
<div class="s-left">
<h1>AI-Powered</h1>
<h3>Tender <br> Management</h3>
<strong>Win more tenders, automatically!</strong>
<p>Our platform finds tenders tailored to your business, <br> automates document handling, and
sends
real-time alerts. Win <br> more opportunities with less effort and zero manual search.</p>
</div>
<div class="s-right">
<div class="s-right-inner">
<img src="./assets/image/mobile.png" alt="">
</div>
</div>
</div>
</div>
<div class="our-sec">
<div class="our-sec-inner">
<div class="os-item">
<h1>200</h1>
<span>User</span>
<p>
Lacking the time, dedicated staff, and
expertise to constantly monitor the market
and prepare high-quality bids.
</p>
</div>
<div class="os-item">
<h1>520</h1>
<span>Contract</span>
<p>
Lacking the time, dedicated staff, and
expertise to constantly monitor the market
and prepare high-quality bids.
</p>
</div>
<div class="os-item">
<h1>1500</h1>
<span>tenders</span>
<p>
Lacking the time, dedicated staff, and
expertise to constantly monitor the market
and prepare high-quality bids.
</p>
</div>
</div>
</div>
</div>
</div>
<footer>
<div class="footer">
<img class="effect-2" src="./assets/image/effect-2.svg" alt="">
<div class="container">
<div class="footter-inner">
<div class="f-top">
<img src="./assets/image/logo.png" alt="">
</div>
<div class="f-midd">
<div class="footer-item">
<span>
<img src="./assets/image/Location.svg" alt="">
USA , California
</span>
</div>
<div class="footer-item">
<span>
<img src="./assets/image/Location.svg" alt="">
USA , California
</span>
</div>
<div class="footer-item">
<span>
<img src="./assets/image/Location.svg" alt="">
USA , California
</span>
</div>
</div>
<div class="f-bott">
<p>© 2025 Opplens.com by PBL Partners AB. All Rights Reserved.</p>
<p>Democratizing Tender Access for SMEs.</p>
</div>
</div>
</div>
</div>
</footer>
<script src="assets/js/main.js"></script>
</body>
</html>