Difference between revisions of "Template:Vilnius-Lithuania/styles/sideindex-mobile"

Latest revision as of 11:55, 21 October 2021

@media (max-width: 1024px) {

 .index-container {
   position: fixed;
   display: flex;
   align-items: center;
   flex-direction: column;
   bottom: 5vw;
   right: 5vw;
   background-color: #FCCEC0;
   padding: 1.5vh;
   border-radius: 100%;
   width: 10vh;
   height: 10vh;
   z-index: 1;
 }

 .index-container:focus-within .index-header, .index-container:focus .index-header {
   height: 0;
   overflow: hidden;
 }

 .index-container:focus-within .index-content, .index-container:focus .index-content {
   height: 100%;
   overflow-y: auto;
   overflow-x: hidden;
 }

 .index-container:focus-within, .index-container:focus {
   width: 33vw;
   max-height: 50vh;
   height: auto;
   border-radius: 25px;
   padding: 48px 48px;
   align-items: flex-start;
 }

 .index-header {
   width: 100%;
   height: 100%;
   position: relative;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 100%;
   text-align: center;
   font-family: var(--secondary-font);
   font-weight: 800;
   font-style: normal;
   font-size: 2vh;
   color: rgba(13, 75, 94, 1);
   text-transform: uppercase;
 }

 .index-content {
   font-family: var(--main-font);
   font-size: 2vh;
   font-style: normal;
   font-weight: 300;
   letter-spacing: 0em;
   text-align: left;
   color: #000000;
   width: 100%;
   padding-right: 25px;
 }

 .index-header > .vertical-breaker {
   display: none;
 }

 #figures-button {
   display: none;
 }

 #references-button {
   display: none;
 }

 .index-header > div {
   cursor: pointer;
 }

 .index-content {
   height: 0px;
   overflow: hidden;
 }

 .index-content > div {
   margin-bottom: 24px;
   padding-left: 18px;
   cursor: pointer;
 }

 .index-content > .active {
   border-left: 0.5vw solid #0D4B5E;
   padding-left: 12px;
 }

 .index-content::-webkit-scrollbar {
   width: 5px;
 }

 .index-content::-webkit-scrollbar-thumb {
   background-color: rgba(0, 0, 0, 0.1);
   border-radius: 100px;
   height: 10px;
 }

 .index-content::-webkit-scrollbar-track {
   background-color: rgba(255, 255, 255, 0.2);
   border-radius: 100px;
 }

}