78 lines
3.5 KiB
Plaintext
78 lines
3.5 KiB
Plaintext
@* Компонент с инструкцией по получению токена Яндекс.Музыки *@
|
||
|
||
<MudContainer Class="pa-4">
|
||
<MudText Typo="Typo.body2" GutterBottom>
|
||
Токен нужен для доступа к вашим плейлистам. Получите его один раз:
|
||
</MudText>
|
||
|
||
<!-- Вертикальный список шагов -->
|
||
<MudStack Class="my-4">
|
||
<MudStack AlignItems="AlignItems.Center">
|
||
<MudPaper Elevation="0" Style="width: 28px; height: 28px; background-color: var(--mud-palette-primary); color: white; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: bold;">1</MudPaper>
|
||
<MudText>
|
||
Перейдите по <MudLink Href="https://oauth.yandex.ru/authorize?response_type=token&client_id=23cabbbdc6cd418abb4b39c32c41195d" Target="_blank">ссылке</MudLink>
|
||
</MudText>
|
||
</MudStack>
|
||
|
||
<MudStack AlignItems="AlignItems.Center">
|
||
<MudPaper Elevation="0" Style="width: 28px; height: 28px; background-color: var(--mud-palette-primary); color: white; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: bold;">1</MudPaper>
|
||
<MudText>
|
||
Авторизуйтесь в Яндексе (если ещё не вошли)
|
||
</MudText>
|
||
</MudStack>
|
||
|
||
<MudStack AlignItems="AlignItems.Center">
|
||
<MudPaper Elevation="0" Style="width: 28px; height: 28px; background-color: var(--mud-palette-primary); color: white; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: bold;">1</MudPaper>
|
||
<MudText>
|
||
Нажмите «Разрешить»
|
||
</MudText>
|
||
</MudStack>
|
||
|
||
<MudStack AlignItems="AlignItems.Center">
|
||
<MudPaper Elevation="0" Style="width: 28px; height: 28px; background-color: var(--mud-palette-primary); color: white; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: bold;">1</MudPaper>
|
||
<MudText>
|
||
Скопируйте <strong>access_token</strong> из адресной строки после перенаправления
|
||
</MudText>
|
||
</MudStack>
|
||
</MudStack>
|
||
|
||
<MudAlert Severity="Severity.Info" Class="mt-4">
|
||
Пример: <code>https://music.yandex.ru/#access_token=ВАШ_ТОКЕН&...</code>
|
||
</MudAlert>
|
||
|
||
<MudAlert Severity="Severity.Warning" Class="mt-2">
|
||
Токен даёт доступ к вашим плейлистам. Никому его не сообщайте.
|
||
</MudAlert>
|
||
|
||
<MudAlert Severity="Severity.Success" Class="mt-2" Icon="@Icons.Material.Filled.Security">
|
||
Ваш токен сохраняется в зашифрованном виде и никому не передаётся.
|
||
</MudAlert>
|
||
</MudContainer>
|
||
|
||
<style>
|
||
.instruction-steps {
|
||
margin: 16px 0;
|
||
}
|
||
.step-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 12px;
|
||
margin-bottom: 16px;
|
||
}
|
||
.step-number {
|
||
width: 28px;
|
||
height: 28px;
|
||
background-color: var(--mud-palette-primary);
|
||
color: white;
|
||
border-radius: 50%;
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-weight: bold;
|
||
flex-shrink: 0;
|
||
}
|
||
.step-content {
|
||
flex: 1;
|
||
font-size: 0.9rem;
|
||
}
|
||
</style> |