Swagger. Выделить цветом методы
От: BlackEric http://black-eric.lj.ru
Дата: 02.11.24 18:17
Оценка:
Можно ли в сваггере выделить различным цветом методы в зависимости от их названия?
Так кто-то делал?
https://github.com/BlackEric001
Re: Swagger. Выделить цветом методы
От: RushDevion Россия  
Дата: 04.11.24 13:11
Оценка: 12 (2)
Подключаешь свои css и js
app.UseSwaggerUI(c =>
{
  c.InjectStylesheet("/css/swagger-ui/custom.css");
         
  c.InjectJavascript("/js/swagger-ui/custom.js");
});


И в custom.js
const elements = document.querySelectorAll("TODO: подобрать селектор");
// Навешиваешь на элементы кастомные стили по любым условиям
Re[2]: Swagger. Выделить цветом методы
От: BlackEric http://black-eric.lj.ru
Дата: 06.11.24 13:41
Оценка:
Здравствуйте, RushDevion, Вы писали:

RD>Подключаешь свои css и js

RD>
RD>app.UseSwaggerUI(c =>
RD>{
RD>  c.InjectStylesheet("/css/swagger-ui/custom.css");
         
RD>  c.InjectJavascript("/js/swagger-ui/custom.js");
RD>});
RD>


RD>И в custom.js

RD>
RD>const elements = document.querySelectorAll("TODO: подобрать селектор");
RD>// Навешиваешь на элементы кастомные стили по любым условиям
RD>


Там страница или javascript генерится или по вебсокету с сервера забирается. Не так все просто. Нужно во фронте разбираться.
https://github.com/BlackEric001
Re[3]: Swagger. Выделить цветом методы
От: RushDevion Россия  
Дата: 06.11.24 15:36
Оценка: 9 (1)
BE>Там страница или javascript генерится или по вебсокету с сервера забирается. Не так все просто. Нужно во фронте разбираться.

Ну можно сделать в своем custom.js задержку перед применением своих стилей или функцию, которая будет периодически проверять готовность сгенерированного UI.

А можно еще проще.
На примере с последней версией свагера с официального сайта
Просто добавляем в custom.css
// Раскрашиваем метод /pet/{petId}/uploadImage
span.opblock-summary-path[data-path="/pet/{petId}/uploadImage"] {
  background-color: red;
}

Вот еще статья на тему с полноценным примером.
Re[4]: Swagger. Выделить цветом методы
От: BlackEric http://black-eric.lj.ru
Дата: 07.11.24 10:19
Оценка:
Здравствуйте, RushDevion, Вы писали:

RD>Ну можно сделать в своем custom.js задержку перед применением своих стилей или функцию, которая будет периодически проверять готовность сгенерированного UI.


RD>А можно еще проще.

RD>На примере с последней версией свагера с официального сайта
RD>Просто добавляем в custom.css
RD>
RD>// Раскрашиваем метод /pet/{petId}/uploadImage
RD>span.opblock-summary-path[data-path="/pet/{petId}/uploadImage"] {
RD>  background-color: red;
RD>}
RD>


Я этот пример видел. Насколько понимаю css — фон должен быть красным, но ничего такого в браузере не вижу. Не работает?
https://github.com/BlackEric001
Re[5]: Swagger. Выделить цветом методы
От: RushDevion Россия  
Дата: 07.11.24 10:29
Оценка:
BE>Я этот пример видел. Насколько понимаю css — фон должен быть красным, но ничего такого в браузере не вижу. Не работает?

Конечно не работает. Это же чужой сайт, откуда там наш custom.css возьмется?
Локально будет работать.

Я оф.сайт в пример привожу, чтобы CSS селекторы соответствовали последней версии swagger UI.
 
Подождите ...
Wait...
Пока на собственное сообщение не было ответов, его можно удалить.