OpenIntegrations/docs/docusaurus/src/css/custom.css

:root {
  --ifm-color-primary: #ffffff;
  --ifm-color-primary-dark: #ffffff;
  --ifm-color-primary-darker: #ffffff;
  --ifm-color-primary-darkest: #ffffff;
  --ifm-color-primary-light: #ffffff;
  --ifm-color-primary-lighter: #ffffff;
  --ifm-color-primary-lightest:#ffffff;
  --ifm-code-font-size: 95%;
  --docusaurus-highlighted-code-line-bg: #004943;
  --ifm-tabs-color-active: #004943;
  --ifm-pagination-nav-color-hover: black;
  --ifm-footer-link-hover-color: black;
}

p{
  font-weight: lighter;
}

h3,h2,h1{
  font-weight: 400;
}

strong{
  font-weight: 500;
}

@media (min-width: 996px) {

  .main-wrapper,.navbar{
    
    
    border: 1px solid #ddd;
    border-radius: 12px; /* Более округлые формы */

    font-size: 1rem;
    color: #333;
    box-shadow: 
      inset 0 1px 3px rgba(255, 255, 255, 0.7), /* Мягкий внутренний свет */
      0 4px 8px rgba(0, 0, 0, 0.1); /* Легкая внешняя тень */
    transition: all 0.3s ease;

    
    margin: 20px;
  }

  .main-wrapper{
    margin-top: 0px;
    padding: 20px;
    padding-top: 5px;
    
  }

}

.navbar-github-link, .navbar-boosty-link {
  display: flex;
  align-items: center; /* Вертикальное выравнивание */
  text-decoration: none; /* Убираем подчеркивание */
  color: inherit; /* Унаследовать цвет текста */
}

.navbar-github-link::before, .navbar-boosty-link::before {
  content: '';
 /* Замените на путь к вашему логотипу */
  background-size: contain;
  background-repeat: no-repeat;
  width: 20px; /* Ширина логотипа */
  height: 20px; /* Высота логотипа */
  margin-right: 5px; /* Отступ между изображением и текстом */
}

/* Если хотите добавить эффект при наведении */
.navbar-github-link:hover, .navbar-boosty-link:hover {
  opacity: 0.8; /* Легкая прозрачность при наведении */
}

.navbar-github-link::before{
    background-image: url('./../../static/img/github-logo.svg');
}

.navbar-boosty-link::before{
    background-image: url('./../../static/img/boosty-logo.svg');
}

.tipimage{
  width: 64px; 
  height: 64px; 
  margin-right: 16px;
  padding-top: 0px;
  margin-top: 0px;
  float: left;
  vertical-align: top;

}

.addin{
  padding-top: 3px;
  padding-bottom: 3px;
}

.alert{
  margin-top: 10px;
}

.hearthnstar{

  margin-right: 12px;
  margin-top: 5px;
}

.orangelink{
  color: #E6A700;
}

.orangelink:hover{
  color: #E6A700;
}

.footer{
  background-color: white;
}

.hero{
  background-color: transparent;
}

.heroBanner{
  margin-top: 10px;
}

.hero__subtitle{
  margin-top: -15px;
}

.menu__link{
  font-weight: 350;
}

.menu__link--active, .menu__link--active:hover, .navbar__link--active {
  color: black;
}

.table-of-contents__link{
  color: grey;
  font-weight: 400;
}

.table-of-contents__link:hover, .table-of-contents__link--active, .table-of-contents__link--active:hover{
  color: black;
  font-weight: 450;
}

.navbar__item:hover, .navbar__link:hover, .navbar__brand:hover, .navbar__title:hover{
  color: #004943;
}

.navbar__item, .navbar__link, .navbar__brand, .navbar__title{
  font-weight: 350;
}

a{
  color: #004943e8;
  font-weight: 500;
}

a:hover, .navbar__title:hover{
  color: #004943;
}

.breadcrumbs__item--active .breadcrumbs__link {
  border-color: #004943 !important;
  border: 1px solid;
  color: black;
  background-color: white;
}

.navbar__title{
  font-weight: 490;
}

.footer__title{
  font-weight: 390;
}

li > a.menu__link {
  justify-content: flex-start;
}



.theme-code-block,.tabs-container{
  border: 1px solid rgba(27, 31, 35, 0.15);
  border-radius: 16px;
  box-shadow: rgba(27, 31, 35, 0.04) 0 1px 0, rgba(255, 255, 255, 0.25) 0 1px 0 inset;
}

/* CSS */
.button {
  appearance: none;
  background-color: white;
  border: 1px solid rgba(27, 31, 35, 0.15);
  border-radius: 16px;
  box-shadow: rgba(27, 31, 35, 0.04) 0 1px 0, rgba(255, 255, 255, 0.25) 0 1px 0 inset;
  box-sizing: border-box;
  color: #24292E;
  cursor: pointer;
  display: inline-block;
  font-family: -apple-system, system-ui, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  list-style: none;
  padding: 6px 16px;
  position: relative;
  transition: background-color 0.2s cubic-bezier(0.3, 0, 0.5, 1);
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  vertical-align: middle;
  white-space: nowrap;
  word-wrap: break-word;
}

.button:hover {
  background-color: #F3F4F6;
  text-decoration: none;
  transition-duration: 0.1s;
}

.button:disabled {
  background-color: #FAFBFC;
  border-color: rgba(27, 31, 35, 0.15);
  color: #959DA5;
  cursor: default;
}

.button:active {
  background-color: #EDEFF2;
  box-shadow: rgba(225, 228, 232, 0.2) 0 1px 0 inset;
  transition: none 0s;
}

.button:focus {
  outline: 1px transparent;
}

.button:before {
  display: none;
}

.button:-webkit-details-marker {
  display: none;
}

.wp_logo{
  margin-right: 5px;
}

[class*='iconExternalLink_'] {
  display: none;
}

.falling-icon {
  position: absolute;
  top: -50px;
  width: 40px;
  height: auto;
  opacity: 0;
  animation: falling linear infinite;
  will-change: transform;
  user-select: none;
  pointer-events: none;
}

@keyframes falling {
  0% {
    transform: translateY(-30px) ;
    opacity: 0.3;
  }
  25% {
    opacity: 0;
  }
  100% {
    transform: translateY(calc(100vh + 100px));
    opacity: 0;
  }
}

/* Адаптивность для мобильных устройств */
@media (max-width: 768px) {
  .falling-icon {
    width: 30px !important;
  }
}

.Messenger > div > a::before{
  content: url(../../static/img/Categories/chat.png);
}

.Social > div > a::before{
  content: url(../../static/img/Categories/social-media.png);
}

.Database > div > a::before{
  content: url(../../static/img/Categories/database.png);
}

.Calendar > div > a::before{
  content: url(../../static/img/Categories/calendar.png);
}

.CRM > div > a::before{
  content: url(../../static/img/Categories/crm.png);
}

.Exchange > div > a::before{
  content: url(../../static/img/Categories/network.png);
}

.Folder > div > a::before{
  content: url(../../static/img/Categories/folder.png);
}

.Commerce > div > a::before{
  content: url(../../static/img/Categories/e-commerce.png);
}

.Start > div > a::before{
  content: url(../../static/img/Categories/welcome.png);
}

.Other > div > a::before{
  content: url(../../static/img/Categories/other.png);
}

.AI > div > a::before{
  content: url(../../static/img/Categories/ai.png);
}

.WebUI > div > a::before{
  content: url(../../static/img/Categories/webui.png);
}

.CL > div > a::before{
  content: url(../../static/img/Categories/cl.png);
}

.Info > div > a::before{
  content: url(../../static/img/Categories/info.png);
}

.Addons > a::before{
  content: url(../../static/img/Categories/addons.png);
}

.Melezh > a::before{
  content: url(../../static/img/Categories/melezh.png);
}

.Messenger a::before,
.Social a::before, 
.Database a::before, 
.Folder a::before, 
.Calendar a::before, 
.CRM a::before, 
.Commerce a::before,
.Start a::before, 
.Other a::before,
.AI a:before,
.Exchange a::before, 
.Addons a::before, 
.Melezh a::before, 
.CL a::before, 
.WebUI a::before,
.Info a::before{
  padding-right: 0.7rem;
  padding-top: 0.4rem;
}


/* AUTOGENERATED */

.Airtable a::before,
.Bitrix24 a::before,
.CDEK a::before,
.ClickHouse a::before,
.Dropbox a::before,
.FTP a::before,
.GoogleCalendar a::before,
.GoogleDrive a::before,
.GreenAPI a::before,
.GreenMax a::before,
.GRPC a::before,
.GoogleSheets a::before,
.MongoDB a::before,
.MSSQL a::before,
.MySQL a::before,
.Neocities a::before,
.Notion a::before,
.Ollama a::before,
.OpenAI a::before,
.PostgreSQL a::before,
.RCON a::before,
.ReportPortal a::before,
.S3 a::before,
.SFTP a::before,
.Slack a::before,
.SQLite a::before,
.SSH a::before,
.TCP a::before,
.Telegram a::before,
.Twitter a::before,
.Viber a::before,
.VK a::before,
.VKTeams a::before,
.YandexDisk a::before,
.HTTP a::before{
  padding-right: 0.7rem;
  padding-top: 0.4rem;
}

.Airtable > div > a::before{
  content: url(../../static/img/APIs/small/Airtable.png);
}

.Bitrix24 > div > a::before{
  content: url(../../static/img/APIs/small/Bitrix24.png);
}

.CDEK > div > a::before{
  content: url(../../static/img/APIs/small/CDEK.png);
}

.ClickHouse > div > a::before{
  content: url(../../static/img/APIs/small/ClickHouse.png);
}

.Dropbox > div > a::before{
  content: url(../../static/img/APIs/small/Dropbox.png);
}

.FTP > div > a::before{
  content: url(../../static/img/APIs/small/FTP.png);
}

.GoogleCalendar > div > a::before{
  content: url(../../static/img/APIs/small/GoogleCalendar.png);
}

.GoogleDrive > div > a::before{
  content: url(../../static/img/APIs/small/GoogleDrive.png);
}

.GreenAPI > div > a::before{
  content: url(../../static/img/APIs/small/GreenAPI.png);
}

.GreenMax > div > a::before{
  content: url(../../static/img/APIs/small/GreenMax.png);
}

.GRPC > div > a::before{
  content: url(../../static/img/APIs/small/GRPC.png);
}

.GoogleSheets > div > a::before{
  content: url(../../static/img/APIs/small/GoogleSheets.png);
}

.MongoDB > div > a::before{
  content: url(../../static/img/APIs/small/MongoDB.png);
}

.MSSQL > div > a::before{
  content: url(../../static/img/APIs/small/MSSQL.png);
}

.MySQL > div > a::before{
  content: url(../../static/img/APIs/small/MySQL.png);
}

.Neocities > div > a::before{
  content: url(../../static/img/APIs/small/Neocities.png);
}

.Notion > div > a::before{
  content: url(../../static/img/APIs/small/Notion.png);
}

.Ollama > div > a::before{
  content: url(../../static/img/APIs/small/Ollama.png);
}

.OpenAI > div > a::before{
  content: url(../../static/img/APIs/small/OpenAI.png);
}

.PostgreSQL > div > a::before{
  content: url(../../static/img/APIs/small/PostgreSQL.png);
}

.RCON > div > a::before{
  content: url(../../static/img/APIs/small/RCON.png);
}

.ReportPortal > div > a::before{
  content: url(../../static/img/APIs/small/ReportPortal.png);
}

.S3 > div > a::before{
  content: url(../../static/img/APIs/small/S3.png);
}

.SFTP > div > a::before{
  content: url(../../static/img/APIs/small/SFTP.png);
}

.Slack > div > a::before{
  content: url(../../static/img/APIs/small/Slack.png);
}

.SQLite > div > a::before{
  content: url(../../static/img/APIs/small/SQLite.png);
}

.SSH > div > a::before{
  content: url(../../static/img/APIs/small/SSH.png);
}

.TCP > div > a::before{
  content: url(../../static/img/APIs/small/TCP.png);
}

.Telegram > div > a::before{
  content: url(../../static/img/APIs/small/Telegram.png);
}

.Twitter > div > a::before{
  content: url(../../static/img/APIs/small/Twitter.png);
}

.Viber > div > a::before{
  content: url(../../static/img/APIs/small/Viber.png);
}

.VK > div > a::before{
  content: url(../../static/img/APIs/small/VK.png);
}

.VKTeams > div > a::before{
  content: url(../../static/img/APIs/small/VKTeams.png);
}

.YandexDisk > div > a::before{
  content: url(../../static/img/APIs/small/YandexDisk.png);
}

.HTTP > div > a::before{
  content: url(../../static/img/APIs/small/HTTP.png);
}