Skip to content

N
NewSite
Commit a1df9f72 authored by Sergey Serov's avatar Sergey Serov
Browse files
Options

After delete all style about eop1, eop2 and map

parent 0e15ab0a
Show whitespace changes
Inline Side-by-side
Showing with 2 additions and 455 deletions
src/Main.vue
View file @ a1df9f72
......@@ -2,12 +2,12 @@
<div id="app">
<full-page ref="fullpage" :options="options" id="fullpage">
<!-- <div class="section">
<div class="section">
<div v-if="!mobile">
<ololo :item="item" @move="move" />
</div>
</div> -->
</div>
<div class="section">
<div style="display: table-cell; vertical-align: middle; width: 100vw; height: 100vh; background-color: rgba(0, 149, 255, 0.3);">
<div>
......@@ -64,111 +64,6 @@
</div>
</div>
</div>
<div class="section">
<div id="tech_eop1">
<div class="col-sm-12 col-md-11 col-lg-12">
<p>Технические возможности ЭОП-1</p>
<div class="col-sm-12 col-md-12 col-lg-11 col-xl-10" id="tech1_text">
<span>
Зоной контроля ЭОП является верхняя полусфера, ограниченная минимальным углом места 12 градусов и высотами от 120 км до 200000 км. Оборудование ЭОП позволяет проводить автономный поиск КО в геостационарной области контроля, представляющей собой приэкваториальную область космического пространства на высотах от 30 000 км до 40 000 км и негеостационарной области контроля, представляющей собой часть зоны контроля ЭОП на высотах от 3500 км до 50000 км. ОЭК-40 с полем зрения 2.2х2.2 градуса предназначен для сопровождения фрагментов космического мусора на геостационарной и высокоэллиптических орбитах, ОЭК-25 с полем зрения 3.4х3.4 градуса может использоваться как для проведения обзоров геостационарной орбиты, так и для наблюдения ярких объектов на всех типах орбит по целеуказаниям. Сдвоенный телескоп ОЭК-19,2х2 с полем зрения 7х15 градусов предназначен для проведения обзоров высокоэллиптических орбит и для расширенных обзоров геостационарной области (расширенные обзоры позволяют значительно повысить точность определения орбит ГСО-объектов и лучше выявлять маневры КА в кластерах), а также для обработки барьерных наблюдений низкоорбитальных объектов
</span>
</div>
</div>
</div>
<div id="tech_eop1">
<div class="col-sm-12 col-md-11 col-lg-11">
<div id="tech1_text">
<div class="for">
<p id="eop1_for">Экспериментальный оптический пункт первой очереди (ЭОП-1) предназначен для:</p>
</div>
<div class="container">
<div class="row">
<div class="col-sm-12 col-md-6 col-lg-3">
<div>
<img src="./imgMain/EOP1/EOP1_1.jpg">
<ul><li><span>Автономного обнаружения и последующего сопровождения космических объектов</span></li></ul>
</div>
</div>
<div class="col-sm-12 col-md-6 col-lg-3">
<div>
<img src="./imgMain/EOP1/EOP1_2.jpg">
<ul><li><span>Определения угловых координат и фотометрических характеристик обслуживаемых КО</span></li></ul>
</div>
</div>
<div class="col-sm-12 col-md-6 col-lg-3">
<div>
<img src="./imgMain/EOP1/EOP1_4.jpg">
<ul><li><span>Оперативного идентификации обнаруженных космических объектов с КО из базы данных ОЭК</span></li></ul>
</div>
</div>
<div class="col-sm-12 col-md-6 col-lg-3">
<div>
<img src="./imgMain/EOP1/EOP1_4.jpg">
<ul><li><span>Выдачи полученной информации для обработки и анализа</span></li></ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="section">
<div id="tech_eop2">
<div class="col-sm-12 col-md-11 col-lg-12">
<p class="title">Технические возможности ЭОП-2</p>
<div class="col-sm-12 col-md-12 col-lg-11 col-xl-10" id="tech2_text">
<div>
<span>
Экспериментальный оптический пункт второй очереди (ЭОП-2) предназначен для автономного обнаружения, обнаружения в локальных зонах по целеуказаниям и последующего сопровождения космических объектов, в том числе фрагментов космического мусора, на низких, круговых полусуточных и высокоэллиптических орбитах.
</span>
</div>
<div id="place">
<p>
В настоящее время изготовлены два ЭОП-2, которые находятся в опытной эксплуатации в интересах Роскосмоса на двух площадках:
</p>
<ol>
<li>Кисловодская обсерватория АО «АНЦ» (в районе города Кисловодск, Карачаево-Черкесия, гора Шидзатмаз).</li>
<li>Благовещенская обсерватория АО «АНЦ» (в районе города Благовещенск, Амурская область).</li>
</ol>
</div>
</div>
</div>
</div>
<div id="tech_eop2">
<div class="col-sm-12 col-md-11 col-lg-10">
<div id="tech2_text">
<div class="for">
<p class="title" id="eop2_for">Экспериментальный оптический пункт второй очереди (ЭОП-2) предназначен для:</p>
</div>
<div class="container">
<div class="row">
<div class="col-sm-12 col-md-4 col-lg-4">
<div>
<img src="./imgMain/EOP2/EOP2_1.jpg">
<ul><li><span>Автономного обнаружения и последующего сопровождения космических объектов</span></li></ul>
</div>
</div>
<div class="col-sm-12 col-md-4 col-lg-4">
<div>
<img src="./imgMain/EOP2/EOP2_2.jpg">
<ul><li><span>Определения угловых координат и фотометрических характеристик обслуживаемых КО</span></li></ul>
</div>
</div>
<div class="col-sm-12 col-md-4 col-lg-4">
<div>
<img src="./imgMain/EOP2/EOP2_3.jpg">
<ul><li><span>Оперативного отождествления (идентификации) обнаруженных космических объектов с КО из локальной базы данных ОЭК</span></li></ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="section">
<div class="col-sm-12 col-md-12 col-lg-10" id="base">
<div class="title">
......@@ -336,356 +231,8 @@ div#logo img{
}
#tech_eop1:first-child{
background-color: rgba(0, 174, 255, 0.3);
padding-top: 7vh;
padding-bottom: 3vh;
}
#tech_eop1 p:first-child{
font-weight: bold;
color: white;
font-family: 'BebasNeueBold', Arial;
font-size: 250%;
text-transform: uppercase;
font-stretch: semi-condensed;
margin-bottom: 3vh;
}
@media only screen and (min-width: 320px) and (max-width: 1399px) {
#tech_eop1 #tech1_text{
font-size: 109%;
}
}
@media only screen and (min-width: 1400px) {
#tech_eop1 #tech1_text{
font-size: 120%;
}
}
#tech_eop1 #tech1_text{
color: white;
text-align:justify;
font-family: 'Europe', Arial;
}
#tech_eop1 #tech1_text .for{
text-align: center;
}
#tech_eop1 #tech1_text #eop1_for{
font-size: 220%;
color:#00aeff;
font-family: 'BebasNeue', Arial;
text-transform: uppercase;
}
#tech_eop1 #tech1_text div div img{
max-height:50%;
}
#tech_eop1 #tech1_text img{
width: 100%;
height: 18vh;
object-fit: cover;
}
#tech_eop1 #tech1_text li{
list-style-type: circle;
font-size:27px;
text-align:left;
line-height: 0.65em;
color:#FF0000;
font-family: 'Europe', Arial;
}
#tech_eop1 #tech1_text li span{
font-size: 15px;
color: white;
}
#tech_eop2:first-child{
background-color: rgba(0, 174, 255, 0.3);
padding-top: 7vh;
padding-bottom: 3vh;
}
#tech_eop2 p.title:first-child{
font-weight: bold;
color: white;
font-size: 250%;
font-family: 'BebasNeueBold', Arial;
text-transform: uppercase;
font-stretch: semi-condensed;
margin-bottom: 3vh;
}
#tech_eop2 #tech2_text{
color: white;
text-align:justify;
font-size: 120%;
font-family: 'Europe', Arial;
}
#tech_eop2 #tech2_text #place p{
margin-top: 20px;
margin-bottom: 20px;
text-align:justify;
}
#tech_eop2 #tech2_text .desc{
text-align:justify;
}
#tech_eop2 #tech2_text #place ol{
padding-inline-start: 20px;
}
#tech_eop2 #tech2_text .for{
text-align: center;
}
#tech_eop2 #tech2_text p#eop2_for{
font-size: 220%;
color:#00aeff;
font-family: 'BebasNeue', Arial;
text-transform: uppercase;
}
#tech_eop2 #tech2_text img{
width: 100%;
height: 18vh;
object-fit: cover;
}
#tech_eop2 #tech2_text ul li{
list-style-type: circle;
font-size:27px;
text-align:left;
line-height: 0.65em;
color:#FF0000;
font-family: 'Europe', Arial;
}
#tech_eop2 #tech2_text li span{
font-size: 15px;
color: white;
}
#map{
/* position:relative; */
width: 100vw;
max-width: 1565px;
}
#map div.point:hover{
z-index:100;
}
@media only screen and (min-width: 320px) and (max-width: 1399px) {
#map div.title{
font-weight: bold;
font-family: 'BebasNeueBold', Arial;
color: #00aeff;
font-size: 38px;
text-transform: uppercase;
font-stretch: semi-condensed;
margin-top: 2em;
}
#map #worldmap{
width: 100vw;
position: relative;
}
#map div.point{
position: absolute;
}
#map #description p.PlaceName{
font-size: 131%;
color:#fff;
font-family: 'BebasNeueBold', Arial;
text-transform: uppercase;
text-align: justify;
}
#map #description p.PlaceTelescope{
font-size: 131%;
color: #fff;
font-family: 'BebasNeue', Arial;
text-transform: uppercase;
text-align: justify;
}
#map #description{
position: absolute;
top: 7%;
z-index: 100;
height: 100px;
background-color: #00aeff;
border-radius: 5px;
}
#map #description .opt{
padding: 11px;
}
#map div.point#Kislovodsk{
left: 54%;
top: 32%;
}
#map div.point#Lesosibirsk{
left: 68%;
top: 19%;
}
#map div.point#Artem{
left: 79%;
top: 37%;
}
#map div.point#Blagoveshensk{
left: 73%;
top: 29%;
}
#map div.point#Milkovo{
left: 88%;
top: 21%;
}
#map div.point#Brazil{
left: 28%;
top: 71%;
}
#map div.point img{
width: 100px;
height: 77px;
object-fit: cover;
}
#map div.point div p#circle{
display: none;
}
#map div.point .info_tel{
display: none;
}
}
@media only screen and (min-width: 1400px) {
#map div.title{
font-weight: bold;
font-family: 'BebasNeueBold', Arial;
color: #00aeff;
font-size: 38px;
text-transform: uppercase;
font-stretch: semi-condensed;
margin-top: 2em;
}
#map #worldmap{
width: 100%;
/* max-height: 94vh; */
position: relative;
/* max-width: 1920px; */
/* max-height: 1080px; */
}
#map #worldmap img#worldmap{
width: calc(100% - .5em);
object-fit: cover;
}
#map div.point{
position: absolute;
display: inline;
}
#map div.point#Kislovodsk{
left: 56%;
top: 29%;
}
#map div.point#Lesosibirsk{
left: 72%;
top: 11%;
}
#map div.point#Artem{
left: 83%;
top: 24%;
}
#map div.point#Blagoveshensk{
left: 77%;
top: 19%;
}
#map div.point#Milkovo{
left: 90%;
top: 20%;
}
#map div.point#Brazil{
left: 30%;
top: 70%;
}
#map div.point img{
width: 100px;
height: 66px;
object-fit: cover;
}
/* #map div.point div p#circle{
content: '';
display: inline-block;
width: 0.8em;
height: 0.8em;
border: 2.5px solid red;
border-radius: 50%;
margin-top:-20px;
} */
#map div.point div span.PlaceName{
font-size: 131%;
color:#fff;
font-family: 'BebasNeueBold', Arial;
text-transform: uppercase;
text-align: justify;
background-color: #00aeff;
padding: .3em;
border-radius: 5px;
}
#map div.point div span.PlaceTelescope{
font-size: 131%;
color: #fff;
font-family: 'BebasNeue', Arial;
text-transform: uppercase;
text-align: justify;
background-color: #00aeff;
padding: .3em;
border-radius: 5px;
}
#map div.point .info_tel, #map div.point .info_tel_img{
/* display: inline-block; */
position: absolute;
}
#map div.point .info_tel{
width: 410px;
top: -36px;
left: -148px;
}
.info_tel-enter-active {
animation: bounce-in .5s;
}
.info_tel-leave-active{
animation: bounce-in .5s reverse;
}
@keyframes bounce-in {
0% {
transform: scale(0);
}
50% {
transform: scale(1.5);
}
100% {
transform: scale(1);
}
}
}
div#map div#block{
height: 10%;
width: 100%;
margin: 0px;
margin-top: 0.7vh;
background-color: rgba(0, 174, 255, 0.3);
}
div#map div#block img{
width: 98%;
object-fit: cover;
}
div#map div#block .image{
width: 30vw;
}
div#map div#block .description{
margin-top: 0.5vh;
color:#ffffff;
font-family: 'BebasNeue', Arial;
width: 68%;
font-size: 2rem;
}
#base div.title{
color: rgb(255, 0, 0);
font-family: 'BebasNeueBold', Arial;
......
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