|
|
| (не показаны 43 промежуточные версии 2 участников) |
| Строка 48: |
Строка 48: |
| display: flex; | | display: flex; |
| width: 100%; | | width: 100%; |
| border: 1px solid #1e222c; | | border: 1px solid #1e222ccc; |
| border-radius: 6px; | | border-radius: 6px; |
| overflow: hidden; | | overflow: hidden; |
| Строка 57: |
Строка 57: |
| flex-direction: column; | | flex-direction: column; |
| width: 220px; | | width: 220px; |
| background-color: #0d121b; | | background-color: #1a232ab3; |
| border-right: 1px solid #1e222c; | | border-right: 1px solid #1e222ccc; |
|
| |
|
| } | | } |
| Строка 67: |
Строка 67: |
| font-weight: bold; | | font-weight: bold; |
| color: #fcfcfc; | | color: #fcfcfc; |
| border-bottom: 1px solid #1e222c; | | border-bottom: 1px solid #1e222ccc; |
| transition: background 0.2s, color 0.2s; | | transition: background 0.2s, color 0.2s; |
| } | | } |
|
| |
|
| .vtabs-button:hover { | | .vtabs-button:hover { |
| background-color: #1e222c; | | background-color: #1e222ccc; |
| } | | } |
|
| |
|
| .vtabs-button.active { | | .vtabs-button.active { |
| background-color: #1e222c; | | background-color: #1a232ab3; |
| color: #2a6ddf; | | color: #2a6ddf; |
| border-left: 4px solid #2a6ddf; | | border-left: 4px solid #2a6ddf; |
| Строка 84: |
Строка 84: |
| flex-grow: 1; | | flex-grow: 1; |
| padding: 20px; | | padding: 20px; |
| background: #0d121b; | | background: #1a232ab3; |
| color: #fcfcfc; | | color: #fcfcfc; |
| } | | } |
| Строка 94: |
Строка 94: |
| .vtabs-content.active { | | .vtabs-content.active { |
| display: block; | | display: block; |
| }
| |
|
| |
| /* Сворачиваемая панель */
| |
|
| |
| .colstr-panel {
| |
|
| |
| border-radius: 2px;
| |
| margin: 10px 0;
| |
| box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
| |
| }
| |
|
| |
| .colstr-header {
| |
| background-color: #0d121b;
| |
| padding: 10px 14px;
| |
| cursor: pointer;
| |
| font-weight: bold;
| |
| display: flex;
| |
| justify-content: space-between;
| |
| align-items: center;
| |
| border-radius: 5px 5px 0 0;
| |
| transition: background-color 0.1s;
| |
| color: #fcfcfc;
| |
| }
| |
|
| |
| .colstr-header:hover {
| |
| background-color: #1e222c;
| |
| }
| |
|
| |
| .colstr-content {
| |
| padding: 10px 14px;
| |
| display: none;
| |
| animation: fadeIn 0.3s ease-in-out;
| |
| background-color: #0d121b;
| |
| color: #fcfcfc;
| |
| }
| |
|
| |
| .colstr-panel.open .colstr-content {
| |
| display: block;
| |
| }
| |
|
| |
| .colstr-panel .arrow {
| |
| transition: transform 0.3s;
| |
| }
| |
|
| |
| .colstr-panel.open .arrow {
| |
| transform: rotate(180deg);
| |
| }
| |
|
| |
| .colstr-panel.open .colstr-header {
| |
| border-bottom: 3px solid #4a90e2;
| |
| background-color: #1e222c;
| |
| } | | } |
|
| |
|
| Строка 221: |
Строка 170: |
| z-index: -1; | | z-index: -1; |
| opacity: 0.3; | | opacity: 0.3; |
| }
| |
| /* Стрелочка url('/images/a/a7/Testbg2.png')*/
| |
|
| |
| a.back-to-top {
| |
| display: none;
| |
| width: 70px;
| |
| height: 70px;
| |
| text-indent: -9999px;
| |
| position: fixed;
| |
| z-index: 999;
| |
| right: 100px;
| |
| bottom: 40px;
| |
| background-color: darkred;
| |
| background: url(https://wiki.ss13-bluemoon.ru/images/4/41/Arrowtop.png) 0% 0%/70px
| |
| 70px no-repeat;
| |
| background-position: 43%;
| |
| background-position-x: center;
| |
| border-radius: 30px;
| |
| } | | } |
|
| |
|
| a.back-to-top:hover {
| |
| background-color: transparent;
| |
| }
| |
|
| |
|
| /* Панель для гайдов */ | | /* Панель для гайдов */ |
| Строка 373: |
Строка 301: |
| } | | } |
|
| |
|
| .whitemoon-bg { | | .palemoon-bg { |
| background-image: linear-gradient(to bottom right, rgba(91, 99, 109, 0.45), rgba(150, 150, 150, 0.45)); | | background-image: linear-gradient(to bottom right, rgba(63, 69, 77, 0.45), rgba(110, 107, 107, 0.45)); |
| } | | } |
|
| |
|
| Строка 526: |
Строка 454: |
| } | | } |
| } | | } |
|
| |
|
| |
|
| .tooltip { | | .tooltip { |
| Строка 551: |
Строка 478: |
| } | | } |
|
| |
|
| .tooltip:hover > .tooltiptext { | | .tooltip:hover > .tooltiptext{ |
| visibility: visible; | | visibility: visible; |
| opacity: 1; | | opacity: 1; |
| transition-delay: 0.1s; | | transition-delay: 0.1s; |
| }
| |
|
| |
|
| |
| .floating-dropdown {
| |
| position: relative;
| |
| user-select: none;
| |
| cursor: pointer;
| |
| text-align: center;
| |
| margin: 0.25em;
| |
| font-weight: bold;
| |
| border-radius: var(--border-radius-small);
| |
|
| |
| &[data-position='top'] {
| |
| .floating-dropdown--content {
| |
| transform-origin: bottom;
| |
| }
| |
|
| |
| .floating-dropdown--contains {
| |
| box-shadow: var(--box-shadow-medium--inv);
| |
| }
| |
| }
| |
|
| |
| &[data-position='bottom'] {
| |
| .floating-dropdown--content {
| |
| transform-origin: top;
| |
| }
| |
|
| |
| .floating-dropdown--contains {
| |
| box-shadow: var(--box-shadow-medium);
| |
| }
| |
| }
| |
|
| |
| .dropdown-fill {
| |
| border-radius: var(--border-radius-small);
| |
| transition-property: background-color, color;
| |
| transition-duration: var(--transition-time);
| |
| }
| |
|
| |
| &:hover .dropdown-fill {
| |
| background-color: var(--color-bg-hover);
| |
| }
| |
|
| |
| &--content {
| |
| position: absolute;
| |
| visibility: hidden;
| |
| opacity: 0;
| |
| transform: scale(0.75);
| |
| transition-property: opacity, visibility, transform;
| |
| transition-duration: var(--transition-time);
| |
| z-index: var(--index-medium);
| |
|
| |
| &.visible {
| |
| visibility: visible;
| |
| opacity: 1;
| |
| transform: scale(0.99999);
| |
|
| |
| ~ .dropdown-fill {
| |
| background-color: var(--color-green);
| |
| color: var(--color-white);
| |
|
| |
| &:hover {
| |
| background-color: var(--color-green-light);
| |
| }
| |
| }
| |
| }
| |
|
| |
| .dropdown-content-fill {
| |
| .absolute-fill();
| |
| background-color: var(--color-base-fill);
| |
| border-radius: var(--border-radius-medium);
| |
| }
| |
| }
| |
|
| |
| &--contains {
| |
| cursor: auto;
| |
| user-select: text;
| |
| overflow: auto;
| |
| font-weight: normal;
| |
| line-height: 1.3;
| |
| max-height: 50vh;
| |
| padding: 0.25rem 0.5rem;
| |
| border: var(--border-classic);
| |
| border-radius: var(--border-radius-medium);
| |
| }
| |
| } | | } |
