okseby/orchard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Finalized i18n Draft Before Testing

Browse source
This commit is contained in:
Maikiwi 2022-01-24 20:07:00 -08:00
parent 0359bffac5
commit 9c0dca8001
10 changed files with 96 additions and 81 deletions
Download patch file Download diff file Expand all files Collapse all files

13
src/i18n/en_US.jsonc
View file

@ -12,7 +12,6 @@
"notification.updatingLibrarySongs": "Updating library songs...",
"notification.updatingLibraryAlbums": "Updating library albums...",
"notification.updatingLibraryArtists": "Updating library artists...",
"notification.connectionError": "There was a problem connecting to Apple Music.",
// Terms
"term.appleMusic": "Apple Music",
@ -86,17 +85,22 @@
"term.defaultView": "Default View",
"term.spacializedAudioSetting": "Spacialized Audio Setting",
"term.clearAll": "Clear All",
"term.recentStations": "Recent Stations",
"term.language": "Language",
// Home
"home.title": "Home",
"home.recentlyPlayed": "Recently Played",
"home.recentlyAdded": "Recently Added",
"home.artistsFeed": "Your Artists Feed",
"home.artistsFeed.noArtist": "Follow some artists first and their latest releases will be here",
"home.madeForYou": "Made For You",
"home.friendsListeningTo": "Friends Listening To",
"home.followedArtists": "Followed Artists",
// Errors
"error.appleMusicSubRequired": "Apple Music requires a subscription.",
"error.connectionError": "There was a problem connecting to Apple Music.",
// Actions
"action.addToLibrary": "Add to Library",
@ -160,9 +164,11 @@
"settings.header.visual.animatedArtworkQuality.low": "Low",
"settings.header.visual.animatedArtworkQuality.medium": "Medium",
"settings.header.visual.animatedArtworkQuality.high": "High",
"settings.header.visual.animatedArtworkQuality.veryHigh": "Very High",
"settings.header.visual.animatedArtworkQuality.extreme": "Extreme",
"settings.option.visual.animatedWindowBackground": "Animated Window Background", // Toggle
"settings.option.visual.hardwareAcceleration": "Hardware Acceleration", // Dropdown
"settings.option.visual.hardwareAcceleration.description": "Requires relaunch",
"settings.header.visual.hardwareAcceleration.default": "Default",
"settings.header.visual.hardwareAcceleration.webGPU": "WebGPU",
// Refer to term.disabled for the disabled option
@ -186,7 +192,7 @@
// Refer to term.disabled for the disabled option
"settings.header.connectivity.discordRPC.cider": "Display as 'Cider'",
"settings.header.connectivity.discordRPC.appleMusic": "Display as 'Apple Music'",
"settings.header.connectivity.discordRPC.clearOnPause": "Clear Discord Rich Presence on Pause", // Toggle
"settings.option.connectivity.discordRPC.clearOnPause": "Clear Discord Rich Presence on Pause", // Toggle
"settings.option.connectivity.lastfmScrobble": "LastFM Scrobbling", // Option to Connect
// Refer to term.connect for the connect button
@ -196,6 +202,9 @@
"settings.option.experimental.compactUI": "Compact UI", // Toggle
// Refer to term.disabled & term.enabled
// Settings - Unfinished
"settings.header.unfinished": "Unfinished",
// Web Remote
"remote.web.title": "Cider Remote",
"remote.web.description": "Scan the QR code to pair your phone up with this Cider instance"

6
src/i18n/ja_JP.jsonc
View file

@ -12,7 +12,6 @@
"notification.updatingLibrarySongs": "ライブラリの更新中...",
"notification.updatingLibraryAlbums": "ライブラリの更新中...",
"notification.updatingLibraryArtists": "ライブラリの更新中...",
"notification.connectionError": "Apple Musicに接続できません。",
// Terms
"term.appleMusic": "Apple Music", // Follows brand term
@ -61,6 +60,7 @@
"term.viewAs": "表示",
"term.viewAs.coverArt": "カバーアート",
"term.viewAs.list": "リスト",
"term.size": "サイズ",
"term.size.normal": "普通",
"term.size.compact": "コンパクト",
"term.enable": "ON",
@ -73,7 +73,7 @@
"term.less": "減らす",
"term.showMore": "もっと見る",
"term.showLess": "表示数を少なくする",
"term.topSongs" : "人気曲",
"term.topSongs" : "トップソング",
"term.latestReleases": "ニューリリース",
"term.time.added": "追加日",
"term.time.released": "配信開始日",
@ -93,6 +93,8 @@
"home.followedArtists": "フォローしているアーティスト",
// Errors
"error.appleMusicSubRequired": "Apple Musicのサブスクリプションが必要です。",
"error.connectionError": "Apple Musicに接続できません。",
// Actions
"action.addToLibrary": "ライブラリに追加",
"action.addToLibrary.success": "ライブラリに追加されました",

3
src/i18n/zh_CN.jsonc
View file

@ -12,7 +12,6 @@
"notification.updatingLibrarySongs": "正在更新资料库的歌曲信息...",
"notification.updatingLibraryAlbums": "正在更新资料库的专辑信息...",
"notification.updatingLibraryArtists": "正在更新资料库的艺人信息...",
"notification.connectionError": "无法连接到 Apple Music。",
// Terms
"term.appleMusic": "Apple Music", // Follows brand term
@ -61,6 +60,7 @@
"term.viewAs": "显示模式",
"term.viewAs.coverArt": "专辑封面",
"term.viewAs.list": "列表",
"term.size": "大小",
"term.size.normal": "正常",
"term.size.compact": "紧凑",
"term.enable": "启用",
@ -94,6 +94,7 @@
// Errors
"error.appleMusicSubRequired": "需要订阅 Apple Music 以使用 Cider",
"error.connectionError": "无法连接到 Apple Music。",
// Actions
"action.addToLibrary": "加入资料库",

3
src/i18n/zh_TW.jsonc
View file

@ -12,7 +12,6 @@
"notification.updatingLibrarySongs": "正在更新資料庫的歌曲...",
"notification.updatingLibraryAlbums": "正在更新資料庫的專輯...",
"notification.updatingLibraryArtists": "正在更新資料庫的藝人...",
"notification.connectionError": "無法連接到 Apple Music。",
// Terms
"term.appleMusic": "Apple Music", // Follows brand term
"term.applePodcasts": "Apple Podcasts", // Follows brand term
@ -60,6 +59,7 @@
"term.viewAs": "顯示模式",
"term.viewAs.coverArt": "專輯封面",
"term.viewAs.list": "列表",
"term.size": "大小",
"term.size.normal": "正常",
"term.size.compact": "緊凑",
"term.enable": "啟用",
@ -92,6 +92,7 @@
"home.followedArtists": "追蹤的藝人",
// Errors
"error.appleMusicSubRequired": "需要訂閱Apple Music以使用Cider",
"error.connectionError": "無法連接到 Apple Music。",
// Actions
"action.addToLibrary": "加入資料庫",
"action.addToLibrary.success": "成功加入資料庫",

28
src/renderer/index.js
View file

@ -178,12 +178,12 @@ const app = new Vue({
},
songs: {
sortingOptions: {
"albumName": "Album",
"artistName": "Artist",
"name": "Name",
"genre": "Genre",
"releaseDate": "Release Date",
"durationInMillis": "Duration"
"albumName": app.getLz('term.sortBy.album'),
"artistName": app.getLz('term.sortBy.artist'),
"name": app.getLz('term.sortBy.name'),
"genre": app.getLz('term.sortBy.genre'),
"releaseDate": app.getLz('term.sortBy.releaseDate'),
"durationInMillis": app.getLz('term.sortBy.duration')
},
sorting: "name",
sortOrder: "asc",
@ -195,10 +195,10 @@ const app = new Vue({
},
albums: {
sortingOptions: {
"artistName": "Artist",
"name": "Name",
"genre": "Genre",
"releaseDate": "Release Date"
"albumName": app.getLz('term.sortBy.album'),
"artistName": app.getLz('term.sortBy.artist'),
"name": app.getLz('term.sortBy.name'),
"genre": app.getLz('term.sortBy.genre')
},
viewAs: 'covers',
sorting: ["dateAdded", "name"], // [0] = recentlyadded page, [1] = albums page
@ -211,10 +211,10 @@ const app = new Vue({
},
artists: {
sortingOptions: {
"artistName": "Artist",
"name": "Name",
"genre": "Genre",
"releaseDate": "Release Date"
"artistName": app.getLz('term.sortBy.artist'),
"name": app.getLz('term.sortBy.name'),
"genre": app.getLz('term.sortBy.genre'),
"releaseDate": app.getLz('term.sortBy.releaseDate')
},
viewAs: 'covers',
sorting: ["dateAdded", "name"], // [0] = recentlyadded page, [1] = albums page

2
src/renderer/views/components/add-to-playlist.ejs
View file

@ -21,7 +21,7 @@
ref="searchInput"
style="width:100%;"
spellcheck="false"
placeholder="Search..."
:placeholder="app.getLz('term.search') + '...'"
v-model="searchQuery"
@input="search()"
class="search-input">

8
src/renderer/views/main.ejs
View file

@ -466,7 +466,7 @@
<div><input type="text" v-model="quickPlayQuery">
<button @click="quickPlay(quickPlayQuery)">Play</button>
</div>
<h1 class="header-text">Browse</h1>
<h1 class="header-text">{{$root.getLz('term.browse')}}</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed euismod, urna eu
tincidunt
@ -485,7 +485,7 @@
</div>
<br>
<br>
<h1 class="header-text">Listen Now</h1>
<h1 class="header-text">{{$root.getLz('term.listenNow')}}</h1>
<div class="winbox">
<div class="fancy">990kbps</div>
<div class="">
@ -509,8 +509,8 @@
<transition v-on:enter="getRadioStations()" name="wpfade">
<template v-if="page == 'radio'" @created="console.log('radio')">
<div class="content-inner">
<h1 class="header-text">Radio</h1>
<h3>Recent Stations</h3>
<h1 class="header-text">{{$root.getLz('term.radio')}}</h1>
<h3>{{$root.getLz('term.recentStations')}}</h3>
<mediaitem-square :item="item" v-for="item in radio.personal"></mediaitem-square>
</div>
</template>

10
src/renderer/views/pages/home.ejs
View file

@ -3,7 +3,7 @@
<div v-if="page == 'main'">
<div class="row">
<div class="col">
<h3>Recently Played</h3>
<h3>{{$root.getLz('home.recentlyPlayed')}}</h3>
<div class="well artistfeed-well">
<template v-if="isSectionReady('recentlyPlayed')">
<mediaitem-list-item v-for="item in recentlyPlayed.limit(6)"
@ -15,7 +15,7 @@
<div class="col">
<div class="row nopadding">
<div class="col nopadding">
<h3>Your Artists Feed</h3>
<h3>{{$root.getLz('home.artistsFeed')}}</h3>
</div>
<div class="col-auto nopadding flex-center">
<button class="cd-btn-seeall" @click="app.appRoute('artist-feed')">{{app.getLz('term.seeAll')}}</button>
@ -26,7 +26,7 @@
<mediaitem-list-item v-for="item in artistFeed.limit(6)" :item="item"></mediaitem-list-item>
</template>
<div class="spinner" v-else-if="followedArtists.length > 0"></div>
<div class="no-artist" v-else> Follow some artists first and their latest releases will be here</div>
<div class="no-artist" v-else> {{$root.getLz('home.artistsFeed.noArtist')}}</div>
</div>
</div>
</div>
@ -44,7 +44,7 @@
<!-- </div>-->
<div class="row">
<div class="col">
<h3>Made For You</h3>
<h3>{{$root.getLz('home.madeForYou')}}</h3>
<div class="well">
<template v-if="isSectionReady('madeForYou')">
<mediaitem-square kind="small" v-for="item in madeForYou" :item="item"></mediaitem-square>
@ -57,7 +57,7 @@
<div class="col">
<div class="row">
<div class="col nopadding">
<h3>Friends Listening To</h3>
<h3>{{$root.getLz('home.friendsListeningTo')}}</h3>
</div>
<div class="col-auto nopadding flex-center">
<button class="cd-btn-seeall" @click="app.showSocialListeningTo()">{{app.getLz('term.seeAll')}}</button>

2
src/renderer/views/pages/podcasts.ejs
View file

@ -7,7 +7,7 @@
<input type="search"
style="width:100%;"
spellcheck="false"
placeholder="Search..."
:placeholder="app.getLz('term.search') + '...'"
@change="searchPodcasts();librarySearch()"
v-model="search.term" class="search-input">
</div>

102
src/renderer/views/pages/settings.ejs
View file

@ -2,25 +2,25 @@
<div class="content-inner settings-page">
<div class="md-option-container">
<div class="md-option-header">
<span>Audio</span>
<span>{{$root.getLz('settings.header.audio')}}</span>
</div>
<div class="settings-option-body">
<div class="md-option-line">
<div class="md-option-segment">
Audio Quality
{{$root.getLz('settings.option.audio.quality')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select" style="width:180px;" v-model="app.cfg.audio.quality" v-on:change="changeAudioQuality">
<!-- // <option value="990">Extreme</option> -->
<option value="256">High</option>
<option value="64">Low</option>
<option value="auto">Auto</option>
<option value="256">{{$root.getLz('settings.header.audio.quality.high')}}</option>
<option value="64">{{$root.getLz('settings.header.audio.quality.low')}}</option>
<option value="auto">{{$root.getLz('settings.header.audio.quality.auto')}}</option>
</select>
</div>
</div>
<div class="md-option-line">
<div class="md-option-segment">
Seamless Audio Transitions
{{$root.getLz('settings.header.audio.seamlessTransition')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.audio.seamless_audio" switch/>
@ -28,9 +28,9 @@
</div>
<div class="md-option-line">
<div class="md-option-segment">
Enable Advanced Functionality
{{$root.getLz('settings.header.audio.enableAdvancedFunctionality')}}
<br>
<small>Enabling AudioContext functionality will allow for extended audio features like Audio Normalization , Equalizers and Visualizers, however on some systems this may cause stuttering in audio tracks.</small>
<small>{{$root.getLz('settings.header.audio.enableAdvancedFunctionality.description')}}</small>
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.advanced.AudioContext" v-on:change="toggleAudioContext" switch/>
@ -38,7 +38,9 @@
</div>
<div class="md-option-line" v-show="app.cfg.advanced.AudioContext">
<div class="md-option-segment" >
Audio Normalization
{{$root.getLz('settings.option.audio.enableAdvancedFunctionality.audioNormalization')}}
<br>
<small>{{$root.getLz('settings.option.audio.enableAdvancedFunctionality.audioNormalization.description')}}</small>
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.audio.normalization" v-on:change="toggleNormalization" switch/>
@ -46,9 +48,9 @@
</div>
<div class="md-option-line" v-show="app.cfg.advanced.AudioContext">
<div class="md-option-segment" >
Audio Spatialization
{{$root.getLz('settings.option.audio.enableAdvancedFunctionality.audioSpatialization')}}
<br>
<small>Spatialize audio and make audio more 3-dimensional (note: This is not Dolby Atmos)</small>
<small>{{$root.getLz('settings.option.audio.enableAdvancedFunctionality.audioSpatialization.description')}}</small>
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.audio.spatial" v-on:change="toggleSpatial" switch/>
@ -56,49 +58,49 @@
</div>
</div>
<div class="md-option-header">
<span>Visual</span>
<span>{{$root.getLz('settings.header.visual')}}</span>
</div>
<div class="settings-option-body">
<div class="md-option-line">
<div class="md-option-segment">
Window Background Style
{{$root.getLz('settings.option.visual.windowBackgroundStyle')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select" @change="$root.getNowPlayingArtworkBG(undefined, true)" v-model="app.cfg.visual.window_background_style">
<option value="none">None</option>
<option value="artwork">Artwork</option>
<option value="none">{{$root.getLz('settings.header.visual.windowBackgroundStyle.none')}}</option>
<option value="artwork">{{$root.getLz('settings.header.visual.windowBackgroundStyle.artwork')}}</option>
</select>
</div>
</div>
<div class="md-option-line">
<div class="md-option-segment">
Animated Artwork
{{$root.getLz('settings.option.visual.animatedArtwork')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select" v-model="app.cfg.visual.animated_artwork">
<option value="always">Always</option>
<option value="limited">Limit to pages and special entries</option>
<option value="disabled">Disable Everywhere</option>
<option value="always">{{$root.getLz('settings.header.visual.animatedArtwork.always')}}</option>
<option value="limited">{{$root.getLz('settings.header.visual.animatedArtwork.limited')}}</option>
<option value="disabled">{{$root.getLz('settings.header.visual.animatedArtwork.disable')}}</option>
</select>
</div>
</div>
<div class="md-option-line" v-if="app.cfg.visual.animated_artwork == 'always' || app.cfg.visual.animated_artwork == 'limited'">
<div class="md-option-segment">
Animated Artwork Quality
{{$root.getLz('settings.option.visual.animatedArtworkQuality')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select" v-model="app.cfg.visual.animated_artwork_qualityLevel">
<option value="0">Low</option>
<option value="1">Medium</option>
<option value="2">High</option>
<option value="3">Very High</option>
<option value="4">Extreme</option>
<option value="0">{{$root.getLz('settings.header.visual.animatedArtworkQuality.low')}}</option>
<option value="1">{{$root.getLz('settings.header.visual.animatedArtworkQuality.medium')}}</option>
<option value="2">{{$root.getLz('settings.header.visual.animatedArtworkQuality.high')}}</option>
<option value="3">{{$root.getLz('settings.header.visual.animatedArtworkQuality.veryHigh')}}</option>
<option value="4">{{$root.getLz('settings.header.visual.animatedArtworkQuality.extreme')}}</option>
</select>
</div>
</div>
<div class="md-option-line">
<div class="md-option-segment">
Animated Window Background
{{$root.getLz('settings.option.visual.animatedWindowBackground')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" switch v-model="app.cfg.visual.bg_artwork_rotation"/>
@ -106,20 +108,20 @@
</div>
<div class="md-option-line">
<div class="md-option-segment">
Hardware Acceleration<br>
<small>(Requires relaunch)</small>
{{$root.getLz('settings.option.visual.hardwareAcceleration')}}<br>
<small>({{$root.getLz('settings.option.visual.hardwareAcceleration.description')}})</small>
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select" style="width:180px;" v-model="app.cfg.visual.hw_acceleration" >
<option value="default">Default</option>
<option value="webgpu">WebGPU</option>
<option value="disabled">Disabled</option>
<option value="default">{{$root.getLz('settings.header.visual.hardwareAcceleration.default')}}</option>
<option value="webgpu">{{$root.getLz('settings.header.visual.hardwareAcceleration.webGPU')}}</option>
<option value="disabled">{{$root.getLz('term.disabled')}}</option>
</select>
</div>
</div>
<div class="md-option-line">
<div class="md-option-segment">
Show Personal Info
{{$root.getLz('settings.option.visual.showPersonalInfo')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.visual.showuserinfo" v-on:change="toggleUserInfo" switch/>
@ -128,12 +130,12 @@
</div>
<div class="md-option-header">
<span>Lyrics</span>
<span>{{$root.getLz('settings.header.lyrics')}}</span>
</div>
<div class="settings-option-body">
<div class="md-option-line">
<div class="md-option-segment">
Enable Musixmatch Lyrics
{{$root.getLz('settings.option.lyrics.enableMusixmatch')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.lyrics.enable_mxm" switch/>
@ -141,7 +143,7 @@
</div>
<div class="md-option-line" v-if="app.cfg.lyrics.enable_mxm">
<div class="md-option-segment">
Enable Karaoke Mode (Musixmatch only)
{{$root.getLz('settings.option.lyrics.enableMusixmatchKaraoke')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.lyrics.mxm_karaoke" switch/>
@ -149,7 +151,7 @@
</div>
<div class="md-option-line">
<div class="md-option-segment">
Musixmatch Translation Preferred Language
{{$root.getLz('settings.option.lyrics.musixmatchPreferredLanguage')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select" v-model="app.cfg.lyrics.mxm_language">
@ -424,7 +426,7 @@
</div>
<div class="md-option-line">
<div class="md-option-segment">
Enable Youtube Lyrics for Music Videos
{{$root.getLz('settings.option.lyrics.enableYoutubeLyrics')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.lyrics.enable_yt" switch/>
@ -432,36 +434,36 @@
</div>
</div>
<div class="md-option-header">
<span>Connectivity</span>
<span>{{$root.getLz('settings.header.connectivity')}}</span>
</div>
<div class="settings-option-body">
<div class="md-option-line">
<div class="md-option-segment">
Discord Rich Presence
{{$root.getLz('settings.option.connectivity.discordRPC')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select" v-model="app.cfg.general.discord_rpc">
<option value="0">Disabled</option>
<option value="1">Display as 'Cider'</option>
<option value="2">Display as 'Apple Music'</option>
<option value="0">{{$root.getLz('term.disabled')}}</option>
<option value="1">{{$root.getLz('settings.header.connectivity.discordRPC.cider')}}</option>
<option value="2">{{$root.getLz('settings.header.connectivity.discordRPC.appleMusic')}}</option>
</select>
</div>
</div>
<div class="md-option-line" v-show="app.cfg.general.discord_rpc != 0">
<div class="md-option-segment">
Clear Discord RPC on Pause
{{$root.getLz('settings.option.connectivity.discordRPC.clearOnPause')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select" v-model="app.cfg.general.discordClearActivityOnPause">
<option value="0">Disabled</option>
<option value="1">Enabled</option>
<option value="0">{{$root.getLz('term.disabled')}}</option>
<option value="1">{{$root.getLz('term.enabled')}}</option>
</select>
</div>
</div>
<div class="md-option-line">
<div class="md-option-segment">
LastFM Scrobbling
{{$root.getLz('settings.option.connectivity.lastfmScrobble')}}
</div>
<div class="md-option-segment md-btn md-option-segment_auto">
<label class="list-button list-element" id="lfmConnect" ref="lfmConnect"
@ -494,13 +496,13 @@
</div>
</div>
<div class="md-option-header">
<span>Experimental</span>
<span>{{$root.getLz('settings.header.experimental')}}</span>
</div>
<div class="settings-option-body">
<div class="md-option-line">
<div class="md-option-segment">
Compact UI
{{$root.getLz('settings.option.experimental.compactUI')}}
</div>
<div class="md-option-segment md-option-segment_auto" >
<button class="md-btn" :class="{'md-btn-primary': app.cfg.advanced.experiments.includes('compactui')}" @click="app.cfg.advanced.experiments.includes('compactui') ? removeExperiment('compactui') : addExperiment('compactui')">
@ -511,7 +513,7 @@
<div class="md-option-line">
<div class="md-option-segment">
Language
{{$root.getLz('term.language')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select" @change="$root.setLz('')" v-model="app.cfg.general.language">
@ -527,7 +529,7 @@
</div>
<div style="opacity: 0.5; pointer-events: none">
<div class="md-option-header">
<span>Unfinished / Non Functional</span>
<span>{{$root.getLz('settings.header.unfinished')}}</span>
</div>
<div class="settings-option-body">
<div class="md-option-line">