inital commit
This commit is contained in:
533
public/dist/css/_posters.css
vendored
Normal file
533
public/dist/css/_posters.css
vendored
Normal file
@@ -0,0 +1,533 @@
|
||||
body {
|
||||
background-image: url("https://rms.rmto.ir/images/pattern-poster.jpg");
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.container-page {
|
||||
width: 1600px;
|
||||
padding-right: 7.5px;
|
||||
padding-left: 7.5px;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.header-box {
|
||||
background: #1b7e7e;
|
||||
color: #fff;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.header-box::before {
|
||||
content: "";
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-top: 50px solid transparent;
|
||||
border-bottom: 50px solid transparent;
|
||||
border-right: 50px solid #f9f9f9;
|
||||
}
|
||||
|
||||
.header-box::after {
|
||||
content: "";
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-top: 50px solid transparent;
|
||||
border-bottom: 50px solid transparent;
|
||||
border-left: 50px solid #fefefe;
|
||||
}
|
||||
|
||||
.logo {
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.counter-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.counter-box .counter-title {
|
||||
border: 2px solid rgb(87, 45, 1);
|
||||
border-radius: 8px;
|
||||
padding: 20px 20px 50px 20px;
|
||||
background-color: #fcbf49cc;
|
||||
color: #412b01;
|
||||
font-size: 20px;
|
||||
text-align: center;
|
||||
/* box-shadow: rgb(38 57 77) 0px 20px 30px -10px; */
|
||||
}
|
||||
|
||||
.counter-box .counters {
|
||||
padding: 50px 20px;
|
||||
}
|
||||
|
||||
.counter-box .counter-data {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 50%;
|
||||
background-color: #003049;
|
||||
border: 2px solid #011724;
|
||||
color: #fff;
|
||||
margin-top: -30px;
|
||||
padding: 15px;
|
||||
height: 60px;
|
||||
min-width: 60px;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.counter-box .counter-data-top-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
margin-bottom: -30px;
|
||||
font-size: 24px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.counter-box .counter-data-top-box .counter-data-top-right {
|
||||
padding: 10px 20px 10px 60px;
|
||||
background: #04669b;
|
||||
border: 2px solid #011724;
|
||||
border-radius: 30px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.counter-box .counter-data-top-box .counter-data-top-left {
|
||||
padding: 10px 20px;
|
||||
background-color: #003049;
|
||||
border: 2px solid #011724;
|
||||
border-radius: 30px;
|
||||
margin-right: -50px;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.counter-box .counter-data-bottom-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
margin-top: -30px;
|
||||
}
|
||||
|
||||
.counter-box .counter-data-bottom-box .counter-data-bottom-right {
|
||||
padding: 10px 20px 10px 60px;
|
||||
background: #04669b;
|
||||
border: 2px solid #011724;
|
||||
border-radius: 30px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.counter-box .counter-data-bottom-box .counter-data-bottom-left {
|
||||
padding: 10px 20px;
|
||||
background-color: #003049;
|
||||
border: 2px solid #011724;
|
||||
border-radius: 30px;
|
||||
margin-right: -50px;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.counter-box .counter-data-bottom-box-2 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
margin-top: -30px;
|
||||
}
|
||||
|
||||
.counter-box .counter-data-bottom-box-2 .counter-data-bottom-right {
|
||||
padding: 10px 20px;
|
||||
background-color: #003049;
|
||||
border: 2px solid #011724;
|
||||
border-radius: 30px;
|
||||
margin-left: -50px;
|
||||
font-size: 24px;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.counter-box .counter-data-bottom-box-2 .counter-data-bottom-left {
|
||||
padding: 10px 60px 10px 20px;
|
||||
background: #04669b;
|
||||
border: 2px solid #011724;
|
||||
border-radius: 30px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.counter-box .counter-data-bottom-box-2 .success-box {
|
||||
background: #127411;
|
||||
}
|
||||
|
||||
.chart-bar-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.chart-bar-box .chart-bar-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 8px;
|
||||
background-color: #79724d;
|
||||
border: 2px solid #413c24;
|
||||
color: #fff;
|
||||
margin-bottom: -30px;
|
||||
padding: 15px;
|
||||
font-size: 20px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.chart-bar-box .chart-bar-data {
|
||||
border: 2px solid #79724d;
|
||||
border-radius: 8px;
|
||||
padding: 45px 20px 20px 20px;
|
||||
background-color: #eae2b7cc;
|
||||
width: 100%;
|
||||
z-index: 1;
|
||||
/* box-shadow: rgb(38 57 77) 0px 20px 30px -10px; */
|
||||
}
|
||||
|
||||
.rank-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.rank-box .rank-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 8px;
|
||||
background-color: #233d4d;
|
||||
border: 2px solid #14242e;
|
||||
color: #fff;
|
||||
margin-bottom: -30px;
|
||||
padding: 15px;
|
||||
font-size: 20px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.rank-box .rank-data {
|
||||
border: 2px solid #618b82;
|
||||
border-radius: 8px;
|
||||
padding: 45px 20px 20px 20px;
|
||||
background-color: #bee3dbcc;
|
||||
width: 100%;
|
||||
z-index: 1;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
/* box-shadow: rgb(38 57 77) 0px 20px 30px -10px; */
|
||||
}
|
||||
|
||||
.rank-box .rank-data .rank-item {
|
||||
display: flex;
|
||||
border-radius: 30px;
|
||||
background-color: #89b0ae;
|
||||
border: 2px solid #233d4d;
|
||||
color: #0f3634;
|
||||
}
|
||||
|
||||
.rank-box .rank-data .rank-item .rank-item-title {
|
||||
padding: 10px 20px;
|
||||
}
|
||||
|
||||
.rank-box .rank-data .rank-item .rank-item-data {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: #233d4d;
|
||||
color: #fff;
|
||||
border-radius: 30px;
|
||||
min-width: 60px;
|
||||
margin-left: -1px;
|
||||
}
|
||||
|
||||
.table-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.table-box .table-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 8px;
|
||||
background-color: #370617;
|
||||
border: 2px solid #18040b;
|
||||
color: #fff;
|
||||
margin-bottom: -30px;
|
||||
padding: 15px;
|
||||
font-size: 20px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.table-box .table-data-box {
|
||||
border: 2px solid #a86308;
|
||||
border-radius: 8px;
|
||||
padding: 45px 20px 20px 20px;
|
||||
background-color: #df973acc;
|
||||
width: 100%;
|
||||
z-index: 1;
|
||||
height: 100%;
|
||||
/* box-shadow: rgb(38 57 77) 0px 20px 30px -10px; */
|
||||
}
|
||||
|
||||
.table-box .table-data-box .table-subtitle {
|
||||
color: #370617;
|
||||
background: #370617;
|
||||
border-radius: 16px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
font-weight: 500;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.table-box .table-data-box .table-subtitle .title {
|
||||
background: #e2a95e;
|
||||
padding: 0 30px;
|
||||
border-top-left-radius: 16px;
|
||||
border-top-right-radius: 16px;
|
||||
}
|
||||
|
||||
.table-box .table-data-box .table-data {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.table-box .table-data-box .table-data .table-item {
|
||||
display: flex;
|
||||
border-radius: 30px;
|
||||
background-color: #cd674c;
|
||||
border: 2px solid #370617;
|
||||
color: #200700;
|
||||
}
|
||||
|
||||
.table-box .table-data-box .table-data .table-item .table-item-title {
|
||||
padding: 10px 20px;
|
||||
}
|
||||
|
||||
.table-box .table-data-box .table-data .table-item .table-item-data {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: #370617;
|
||||
color: #fff;
|
||||
border-radius: 30px;
|
||||
min-width: 60px;
|
||||
margin-left: -1px;
|
||||
}
|
||||
|
||||
.second-color .table-data-box {
|
||||
border: 2px solid #4b5a35;
|
||||
background-color: #849669cc;
|
||||
}
|
||||
|
||||
.second-color .table-title {
|
||||
background-color: #001a2c;
|
||||
border: 2px solid #010c14;
|
||||
}
|
||||
|
||||
.second-color .table-data-box .table-subtitle {
|
||||
color: #001a2c;
|
||||
background: #001a2c;
|
||||
}
|
||||
|
||||
.second-color .table-data-box .table-subtitle .title {
|
||||
background: #9ba985;
|
||||
}
|
||||
|
||||
.second-color .table-data-box .table-data .table-item {
|
||||
background-color: #9dad6b;
|
||||
border: 2px solid #001a2c;
|
||||
color: #0c1001;
|
||||
}
|
||||
|
||||
.second-color .table-data-box .table-data .table-item .table-item-data {
|
||||
background-color: #001a2c;
|
||||
}
|
||||
|
||||
.counter2-box {
|
||||
height: 70%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
color: #2f4e5c;
|
||||
}
|
||||
|
||||
.counter2-box::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 10px;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
right: calc(50% - 5px);
|
||||
background-color: #4f6d7a;
|
||||
}
|
||||
|
||||
.counter2-box .counter2-data-box {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.counter2-box .counter2-data {
|
||||
background: #c0d6df;
|
||||
padding: 10px 30px;
|
||||
font-size: 24px;
|
||||
border: 4px solid #4f6d7a;
|
||||
border-radius: 32px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.counter2-box .counter2-title-box {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.counter2-box .counter2-title {
|
||||
background: #c0d6df;
|
||||
padding: 10px 40px;
|
||||
font-size: 30px;
|
||||
border: 6px solid #4f6d7a;
|
||||
border-radius: 16px;
|
||||
}
|
||||
|
||||
.counter3-box {
|
||||
height: 70%;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
color: #4e301c;
|
||||
}
|
||||
|
||||
.counter3-box::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 10px;
|
||||
top: calc(50% - 5px);
|
||||
right: 0;
|
||||
background-color: #7f5539;
|
||||
}
|
||||
|
||||
.counter3-box::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 10px;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
right: calc(50% - 5px);
|
||||
background-color: #7f5539;
|
||||
}
|
||||
|
||||
.counter3-box .counter3-data-box {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.counter3-box .counter3-data {
|
||||
background: #ddb892;
|
||||
padding: 20px 30px;
|
||||
font-size: 24px;
|
||||
border: 4px solid #7f5539;
|
||||
border-radius: 32px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.counter3-box .counter3-data-title-box {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.counter3-box .counter3-title {
|
||||
background: #ddb892;
|
||||
padding: 10px 40px;
|
||||
font-size: 30px;
|
||||
border: 6px solid #7f5539;
|
||||
border-radius: 16px;
|
||||
}
|
||||
|
||||
.map-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.map-box .map-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 8px;
|
||||
background-color: #847577;
|
||||
border: 2px solid #3f3738;
|
||||
color: #fff;
|
||||
margin-bottom: -30px;
|
||||
padding: 15px;
|
||||
font-size: 20px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.map-box .map-data-box {
|
||||
border: 2px solid #3f3738;
|
||||
border-radius: 8px;
|
||||
background-color: #fbfbf2cc;
|
||||
width: 100%;
|
||||
z-index: 1;
|
||||
/* box-shadow: rgb(38 57 77) 0px 20px 30px -10px; */
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.map-box .map-data-box .map-data {
|
||||
position: absolute;
|
||||
top: 45px;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.map-box .map-data-box .map-data.leaflet-container {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.map-box .map-data-box .map-guid {
|
||||
position: absolute;
|
||||
bottom: -2px;
|
||||
left: -2px;
|
||||
width: 90px;
|
||||
height: 110px;
|
||||
background-color: #847577;
|
||||
z-index: 400;
|
||||
padding: 10px;
|
||||
color: #fff;
|
||||
border-bottom-left-radius: 8px;
|
||||
border-top-right-radius: 8px;
|
||||
border: 2px solid #3f3738;
|
||||
}
|
||||
|
||||
.map-box .map-data-box .map-guid p {
|
||||
font-size: 11px;
|
||||
margin-bottom: 5px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
|
||||
.text-labels-map {
|
||||
font-family: "IRANSansFaNum" !important;
|
||||
white-space: nowrap;
|
||||
font-size: 10px;
|
||||
font-weight: bold;
|
||||
width: auto !important;
|
||||
height: auto !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
Reference in New Issue
Block a user