This commit is contained in:
2026-05-17 21:09:32 +08:00
commit 1870400c47
1564 changed files with 544713 additions and 0 deletions

View File

@@ -0,0 +1,240 @@
.hero-1 {
padding: 0px 2rem 0;
text-align: center;
background-position: bottom center;
background-repeat: no-repeat;
background-size: 100%;
position: relative;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
//min-height: 60rem;
position: relative;
padding: 5rem 2rem 2rem;
background-image: linear-gradient(179deg,var(--bs-body-bg) 49%,var(--bs-body-bg) 77%, rgba(var(--bs-body-bg-rgb), 0.8) 100%);
/*
&::before {
background: url(../img/background.svg);
width: 100%;
height: 100%;
content: " ";
position: absolute;
top: 0px;
left: 0px;
pointer-events:none;
opacity:0.1;
background-size: 100%;
background-position: bottom center;
background-size: cover;
background-position: bottom 0px center;
background-repeat: no-repeat;
background-blend-mode: luminosity;
}
*/
h1 {
//line-height: 1.2;
//font-size: 4.2rem;
color: var(--bs-body-color);
font-weight:700;
z-index: 2;
text-shadow: 1px 1px 2px var(--bs-body-bg);
letter-spacing:-0.04em;
//letter-spacing: 0.014em;
//line-height: 64px;
}
/*
@media (max-width: 1601px) {
h1 {
font-size: 5rem;
}
}
@media (max-width: 1281px) {
h1 {
font-size: 5rem;
}
}
@media (max-width: 961px) {
h1 {
font-size: 4.5rem;
line-height: 4.5rem;
}
}
@media (max-width: 661px) {
h1 {
font-size: 3.2rem;
line-height: 3.2rem;
}
}
@media (max-width: 481px) {
h1 {
font-size: 3rem;
line-height: 3rem;
}
}
*/
h2 {
//font-size: 1.5rem;
//line-height: 1.5;
font-weight: normal;
line-height: 1.5;
margin: 1.4rem auto 0rem;
z-index: 2;
position: relative;
text-shadow: 1px 1px 2px var(--bs-body-bg);
//letter-spacing: 0.03em;
max-width: 750px;
color: var(--bs-body-color);
}
.heading {
text-align: center;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
max-width: var(--width-xl);
width: 100%;
z-index: 3;
padding: 2rem 0 0rem;
}
.btns {
margin-top:4rem;
}
.btn {
b {
margin-left: 5px;
display: inline-block;
font-family:system-ui;
}
//min-width:250px;
display: inline-block;
//width: 200px;
//height: 49px;
border-radius: 2px;
//background-color: #419bf9;
//background-color: rgb(65, 155, 249);
//padding: 12px 20px;
line-height: 20px;
font-size: 16px;
text-align: center;
//color: var(--bs-body-color);
margin-right: 7px;
margin-left: 7px;
margin-bottom: 20px;
border-radius: 6px;
//font-weight: 600;
//box-shadow:0 1px 3px 0 rgba(var(--bs-body-color-rgb), 0.07);
//letter-spacing: 0.01em;
&:hover {
//background: var(--bs-dark);
//background: #2781df;
}
span {
//font-size: 24px;
//line-height: 24px;
//vertical-align: text-top;
margin-left: 0.2rem;
//display: none;
}
}
.btn.btn-outline-primary {
b {
transform: rotate(90deg);
}
//background-color: transparent;
//background-color: rgba(65, 155, 249, 0.07);
//background-color: #f1f8ff;
box-shadow: -1px 1px 2px 0px rgba(var(--bs-body-bg-rgb), 0.2) inset;
box-shadow: 0 1px 3px 0 rgba(var(--bs-body-color-rgb), 0.07);
//border: 1px solid var(--bs-border-color);
//background:var(--bs-body-bg);
//color: var(--bs-blue);
&:hover {
//background-color: rgba(65, 155, 249, 0.14);
background: rgba(var(--bs-primary-rgb), 0.07);
color: var(--bs-primary);
}
&:after {
display:none;
}
}
.btn.btn-outline-secondary {
border: 1px solid var(--bs-dark-border-subtle);
--bs-secondary: var(--bs-border-color);
color:var(--bs-body-color);
}
.btn.btn-primary {
//box-shadow: -1px 1px 2px 1px rgba(var(--bs-body-color-rgb), 0.07), -1px 1px 2px 0px rgba(var(--bs-body-bg-rgb), 0.2) inset;
//box-shadow: 0 1px 3px 0 rgba(var(--bs-body-color-rgb), 0.07);
//padding: 1rem 2.5rem;
border:none;
span {
//font-size: 28px;
margin-right: 0.2rem;
}
&:hover {
//color: var(--bs-body-color);
//background: var(--bs-dark);
}
}
.dropdown {
display: inline-block;
.dropdown-menu {
min-width: 240px;
z-index:3;
}
}
> img {
margin-top: 2rem;
max-width: 100%;
//opacity: 0;
transition: opacity 3s;
border-radius: 10px 10px 0px 0px;
border: 1px solid var(--bs-border-color);
background: #f0f4f9;
box-shadow: 0 0 1px 0 rgba(var(--bs-body-color-rgb), 0.2), 0 3px 4px 0 rgba(87, 87, 87, 0.1), 0 10px 15px 0 rgba(5, 4, 10, 0.06%);
border-radius: 4px;
width: 100%;
overflow: hidden;
padding-top: 2rem;
position: relative;
}
.show {
img {
opacity: 1;
}
}
@media screen and (max-width: 767px) {
.btn {
min-width: 300px;
width: 100%;
}
}
.overlay {
background:var(--bs-body-bg);
}
}

View File

@@ -0,0 +1,84 @@
.hero-2 {
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
position: relative;
padding-top: 15rem;
padding-bottom: 15rem;
.btn {
padding: 1rem 2rem;
border-radius: 30px;
text-transform: uppercase;
font-size: 12px;
font-weight: 700;
letter-spacing: .1rem;
&.btn-white {
background:rgba(var(--bs-body-bg-rgb), 0.2);
color:#fff;
}
}
>.container {
position: relative;
z-index: 2;
}
.heading {
font-size: 3.2rem;
font-weight: 700;
color: var(--bs-light);
}
.subheading {
font-size: 1.4rem;
color: var(--bs-light);
}
.svg-wrapper {
position: absolute;
bottom: 0;
width: 100%;
left: 0;
z-index: 2;
}
.overlay {
background-color:rgba(var(--bs-primary-rgb), 1);
opacity: 0.7;
}
.video-wrap {
display: inline-block;
position: relative;
top: 0;
-webkit-transition: .2s all ease;
-o-transition: .2s all ease;
transition: .2s all ease;
.play-button {
width: 50px;
height: 50px;
border-radius: 50%;
background-color: var(--bs-success);
color: var(--bs-white);
line-height: 50px;
text-align: center;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
img {
border-radius: 7px;
-webkit-box-shadow: 0 15px 30px 0 rgba(var(--bs-body-color-rgb), 0.2);
box-shadow: 0 15px 30px 0 rgba(var(--bs-body-color-rgb), 0.2);
}
&:hover {
-webkit-transform: scale(1.05);
-ms-transform: scale(1.05);
transform: scale(1.05);
}
}
}

View File

@@ -0,0 +1,113 @@
.hero-3 {
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
position: relative;
//background-image:url("../img/demo/hero-3.jpg");
//height:100vh;
//min-height:960px;
/*
> .container > .row {
height:100vh;
min-height:800px;
}*/
.btn {
padding: 1rem 3rem;
margin: 0rem 1rem 1rem 0;
//border-radius: 30px;
//text-transform: uppercase;
//font-size: 16px;
//font-weight: 600;
//letter-spacing: .1rem;
box-shadow: rgba(var(--bs-body-color-rgb), 0.25) 0px 5px 15px -5px;
/*
&.btn-white {
background:rgba(var(--bs-white-rgb), 0.2);
color: var(--bs-light);
}
*/
&.btn-primary {
//background:#006cff;
}
}
>.container, > .container-fluid {
position: relative;
z-index: 2;
> div {
position: relative;
height: 100%;
min-height:960px;
min-height:calc(100vh - 200px);
min-height:calc(max(100vh - 200px, 1080px));
display: flex;
justify-content: center;
align-items: center;
}
}
.heading {
//font-size: 60px;
font-weight: 700;
//color: var(--bs-light);
}
h1, h2, h3, h4, h5, h6 {
//font-size: 32px;
color: var(--bs-light);
}
h3 {
font-weight:normal;
}
.svg-wrapper {
position: absolute;
bottom: 0;
width: 100%;
left: 0;
z-index: 2;
}
.buttons {
margin-top:5rem;
}
/*
&.overlay {
position: relative;
&:before {
z-index: 1;
position: absolute;
left: 0;
right: 0;
bottom: 0;
top: 0;
content: "";
//background: rgba(var(--bs-body-color-rgb), 0.6);
background: rgba(var(--bs-body-color-rgb), 0.6);
}
}
*/
@media screen and (max-width: 767px) {
>.container, > .container-fluid {
> div {
position: relative;
height: 100%;
min-height:100vh;
}
}
.btn {
min-width: 300px;
//width: 90%;
margin:0 0 1rem 0;
}
}
}

View File

@@ -0,0 +1,64 @@
.hero-4 {
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
position: relative;
//background-image:url("../img/demo/hero-3.jpg");
height:100vh;
min-height:800px;
> .container > .row {
height:100vh;
min-height:800px;
}
.btn {
padding: 1rem 2rem;
border-radius: 30px;
text-transform: uppercase;
font-size: 12px;
font-weight: 700;
letter-spacing: .1rem;
&.btn-white {
background:rgba(var(--bs-body-bg-rgb), 0.2);
color:#fff;
}
}
>.container {
position: relative;
z-index: 2;
}
.heading {
//font-size: 50px;
font-weight: 700;
color: var(--bs-light);
}
.subheading {
font-family:var(--bs-font-body);
//font-size:2rem;
margin-bottom:3rem;
color: var(--bs-light);
}
.svg-wrapper {
position: absolute;
bottom: 0;
width: 100%;
left: 0;
z-index: 2;
}
.buttons {
margin-top:3rem;
font-family:var(--bs-font-body);
}
.overlay {
background: rgba(0,0,0, 1);
opacity:0.5;
}
}

View File

@@ -0,0 +1,18 @@
.hero-5 {
height:100vh;
min-height:800px;
> .container > .row {
height:100vh;
min-height:800px;
}
.overlay {
background: rgba(0,0,0, 1);
opacity:0.5;
}
h1, p.lead {
color: var(--bs-light);
}
}

View File

@@ -0,0 +1,32 @@
.hero-6 {
height:100vh;
min-height:800px;
> .container > .row {
height:100vh;
min-height:800px;
}
>.container, > .container-fluid {
position: relative;
z-index: 2;
> div {
position: relative;
height: 100%;
min-height:960px;
display: flex;
justify-content: center;
align-items: center;
}
}
.overlay {
background: rgba(0,0,0, 1);
opacity:0.5;
}
h1, h2 {
color: var(--bs-light);
}
}

View File

@@ -0,0 +1,32 @@
.hero-7 {
height:100vh;
min-height:800px;
> .container > .row {
height:100vh;
min-height:800px;
}
>.container, > .container-fluid {
position: relative;
z-index: 2;
> div {
position: relative;
height: 100%;
min-height:960px;
display: flex;
justify-content: center;
align-items: center;
}
}
.overlay {
background: rgba(0,0,0, 1);
opacity:0.5;
}
h1, h2 {
color: var(--bs-light);
}
}

View File

@@ -0,0 +1,49 @@
header.hero-slider {
height:100vh;
min-height:800px;
> .container > .row {
height:100vh;
min-height:800px;
}
.overlay {
background: rgba(0,0,0, 1);
opacity:0.5;
}
.swiper-slide {
> img + .content {
position:absolute;
z-index:2;
top:0;
left:0;
width:100%;
height:100%;
>.container, > .container-fluid {
position: relative;
z-index: 2;
> div {
position: relative;
height: 100%;
min-height:960px;
display: flex;
justify-content: center;
align-items: center;
}
}
}
.overlay {
z-index:1;
}
h1, h2, h3, h4 {
color: var(--bs-light);
}
}
}