Changeset 51 in code


Ignore:
Timestamp:
Oct 7, 2023, 5:36:50 PM (20 months ago)
Author:
yakumo.izuru
Message:

もう少しいじってください

Signed-off-by: Izuru Yakumo <yakumo.izuru@…>

Location:
trunk
Files:
2 deleted
4 edited

Legend:

Unmodified
Added
Removed
  • trunk/Makefile

    r49 r51  
    33build:
    44        go build -v ./cmd/simplytranslate
     5clean:
     6        rm -f simplytranslate
    57install:
    68        install -Dm0755 simplytranslate ${DESTDIR}${PREFIX}/bin/simplytranslate
  • trunk/docker-compose.yml

    r28 r51  
    1010    ports:
    1111      - 5000:5000
    12     environment:
    13       - ADDRESS=0.0.0.0:5000
  • trunk/static/style.css

    r48 r51  
     1body {
     2    background-color: #ffffff;
     3    color: rgb(206, 147, 191);
     4}
     5a {
     6    color: rgb(206, 147, 191);
     7}
     8a:visited {
     9    color: rgb(206, 147, 191);
     10}
    111.center {
    212    text-align: center;
    313}
    4 
    514.wrap {
    615    display: flex;
     
    817    justify-content: center;
    918}
    10 
    1119.wrap.languages {
    1220    flex-wrap: nowrap;
    1321    margin-bottom: 20px;
    1422}
    15 
    1623#could_not_switch_languages_text {
    1724    color: red;
    1825}
    19 
    2026.item {
    2127    width: 100%;
    2228    height: 150px;
    2329}
    24 
    2530.item-wrapper {
    2631    display: flex;
     
    3136    gap: 10px;
    3237}
    33 
    34 
    3538.language,
    3639.switch_languages {
    3740    display: flex;
    3841}
    39 
    4042.language {
    4143    margin: 0px 10px;
    4244}
    43 
    4445.switch_languages {
    4546    margin: 0px 5px;
    4647}
    47 
    4848#switchbutton {
    4949    white-space: nowrap;
    5050}
    51 
    5251button {
    5352    font-size: 1rem;
     
    5554    border: 2px solid #888888;
    5655}
    57 
    5856input,
    5957select,
     
    6462    border: 2px solid #888888;
    6563}
    66 
    6764textarea {
    6865    resize: vertical;
     
    7370    width: 100%;
    7471}
    75 
    7672input:focus,
    7773select:focus,
     
    9692
    9793}
    98 
    9994.def_type {
    10095    color: #007979;
     
    105100    color: #804700;
    106101}
    107 
    108102.syn_type {
    109103    color: #007979;
    110104}
    111 
    112105.use_in_sentence {
    113106    color: #009902;
    114107}
    115 
    116108.definitions li:not(:last-child) {
    117109    margin-bottom: 1rem;
    118110}
    119 
    120111@media screen and (max-width: 1200px) {
    121112    #definitions_and_translations {
    122         display: grid;
    123         width: 90vw;
    124         grid-template-areas:
    125             "definitions definitions"
    126             "translations translations";
     113        display: grid;
     114        width: 90vw;
     115        grid-template-areas:
     116            "definitions definitions"
     117            "translations translations";
    127118    }
    128119}
    129 
    130 
    131120div.definitions {
    132121    grid-area: definitions;
    133122}
    134 
    135123div.translations {
    136124    grid-area: translations;
    137125}
    138 
    139126a {
    140127    text-decoration: none;
    141128}
    142 
    143129@media screen and (prefers-color-scheme: dark) {
     130    /* Loosely based on エレガントなお嬢様 - https://github.com/mei23/misskey/blob/mei-m544/src/client/themes/promo.json5 */
    144131    body {
    145         background-color: #212529;
    146         color: #f8f9fa;
     132        background-color: #700000;
     133        color: #ffffff;
    147134    }
    148 
    149135    #could_not_switch_languages_text {
    150         color: #F13333;
     136        color: yellow;
    151137    }
    152138
    153139    a:visited {
    154         color: #9759f6;
     140        color: #18c018;
    155141        text-decoration: none;
    156142    }
    157 
    158143    a {
    159         color: #599bf6;
     144        color: #18c018;
    160145        text-decoration: none;
    161146    }
    162 
     147    button {
     148        background-color: #18c018;
     149        color: #ffffff;
     150    }
    163151    input,
     152    textarea {
     153        background-color: #5b0000;
     154        border-color: #202020;
     155        color: #b3784b;
     156    }
    164157    select,
    165     button,
    166     textarea {
    167         background-color: #131618;
    168         border-color: #495057;
    169         color: #f8f9fa;
     158    option {
     159        background-color: #5b0000;
     160        color: #ffffff;
    170161    }
    171 
    172162    .def_type {
    173         color: cyan;
     163        color: #5d590c;
    174164        text-transform: capitalize;
    175165    }
    176 
    177166    .syn {
    178         color: burlywood;
     167        color: #bc8080;
    179168    }
    180 
    181169    .syn_type {
    182         color: cyan;
     170        color: #358611;
    183171    }
    184 
    185172    .use_in_sentence {
    186         color: yellow;
     173        color: #d7b081;
    187174    }
    188175}
  • trunk/views/index.html

    r48 r51  
    11<!doctype html>
    22<html lang="en">
    3 
    4 <head>
    5     <title>SimplyTranslate</title>
     3  <head>
     4    <title>単に翻訳する</title>
    65    <link rel="shortcut icon" href="/static/favicon.ico">
    7     <meta name="description" content="Experience simple and private Google translations">
     6    <meta name="description" content="Experience simple and private translations">
    87    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    98    <meta charset="UTF-8">
     
    1110    <meta name="referrer" content="no-referrer">
    1211    <link rel="stylesheet" href="/static/style.css">
    13 </head>
    14 
    15 <body>
     12  </head>
     13  <body>
    1614    <header class="center">
    17         <h1>SimplyTranslate</h1>
     15      <h1>単に翻訳する</h1>
    1816    </header>
    19 
    2017    <form action="/?engine={{.Engine}}" method="POST" id="translation-form">
    21 
    22         <div class="center">
    23             Translation Engine
    24             {{$i := 0}}
    25             {{ range $k, $v := .enginesNames }}
    26             <a {{ if eq $k $.Engine }}style="text-decoration:underline" {{end}} href="/?engine={{ $k }}">{{ $v }}</a>
    27             {{$i = (inc $i)}}
    28             {{if eq $i (len $.enginesNames)}}{{else}}|{{end}}
     18      <div class="center">
     19        Choose translation engine:
     20        <br>
     21        {{$i := 0}}
     22        {{ range $k, $v := .enginesNames }}
     23        <a {{ if eq $k $.Engine }}style="text-decoration:underline" {{end}} href="/?engine={{ $k }}">{{ $v }}</a>
     24        {{$i = (inc $i)}}
     25        {{if eq $i (len $.enginesNames)}}{{else}}|{{end}}
     26        {{end}}
     27      </div>
     28      <br>
     29      <div class="wrap languages">
     30        <div class="language">
     31          <select name="from" aria-label="Source language">
     32            {{range $code, $name := .SourceLanguages}}
     33            {{if and (eq $code "auto") $.SourceLanguage}}
     34            <option value="{{ $code }}" {{if eq $code $.From}}selected{{end}}>{{ $name }} ({{index
     35              $.SourceLanguages $.SourceLanguage}})</option>
     36            {{else }}
     37            <option value="{{ $code }}" {{if eq $code $.From}}selected{{end}}>{{ $name }}</option>
     38            {{end}}
     39            {{end}}
     40          </select>
     41        </div>
     42        <div class="switch_languages">
     43          <button id="switchbutton" aria-label="Switch languages"
     44                  formaction="/switchlanguages/?engine={{ .Engine }}" type="submit">&lt;-&gt;</button>
     45        </div>
     46        <div class="language">
     47          <select name="to" aria-label="Target language">
     48            {{range $code, $name := .TargetLanguages}}
     49            <option value="{{ $code }}" {{if eq $code $.To}}selected{{end}}>{{ $name }}</option>
     50            {{end}}
     51          </select>
     52        </div>
     53      </div>
     54      <div class="wrap">
     55        <div class="item-wrapper">
     56          <textarea autofocus class="item" id="input" name="text" dir="auto"
     57                    placeholder="Enter Text Here">{{ .OriginalText }}</textarea>
     58          {{if .TtsFrom}}
     59          <audio controls>
     60            <source type="audio/mpeg" src="{{ .TtsFrom }}">
     61          </audio>
     62          {{end}}
     63        </div>
     64        <div class="item-wrapper">
     65          <textarea id="output" class="translation item" dir="auto" placeholder="Translation"
     66                    readonly>{{.Translation.TranslatedText}}</textarea>
     67          {{if .TtsTo}}
     68          <audio controls>
     69            <source type="audio/mpeg" src="{{ .TtsTo }}">
     70          </audio>
     71          {{end}}
     72        </div>
     73      </div>
     74      <br>
     75      <div class="center">
     76        <button type="submit">Translate with {{ index .enginesNames .Engine }}!</button>
     77      </div>
     78      <br>
     79      <div id="definitions_and_translations">
     80        {{ if .Translation.Definitions }}
     81        <div class="definitions">
     82          {{ range $type, $definitions :=.Translation.Definitions }}
     83          <span class="def_type">{{ $type }}</span>
     84          <ol>
     85            {{ range $definition_item := $definitions }}
     86            <li>
     87              {{ $definition_item.definition }}
     88              <br>
     89              {{with $definition_item.use_in_sentence}}
     90              <span class="use_in_sentence">"{{$definition_item.use_in_sentence}}"</span>
     91              <br>
     92              {{end}}
     93              {{with $definition_item.synonyms}}
     94              {{ range $synonym_type, $_ := $definition_item.synonyms }}
     95              <span class="syn">
     96                {{if $synonym_type }}
     97                <br>
     98                <span class="syn_type">{{$synonym_type}}: </span>{{end}}{{ range $index, $element := index
     99                $definition_item.synonyms $synonym_type}}{{if $index}}, {{end}}{{$element}}{{end}}
     100              </span>
     101              {{end}}
     102              {{end}}
     103            </li>
     104            {{end}}
     105          </ol>
     106          {{end}}
     107        </div>
     108        {{ end}}
     109        {{ if .Translation.Translations }}
     110        <div class="translations">
     111          {{ range $def_type, $translations := .Translation.Translations }}
     112          <span class="def_type">{{ $def_type }}</span>
     113          <ul>
     114            {{ range $word, $word_translations := $translations }}
     115            <li>
     116              <span class="syn_type">{{$word}}:</span>
     117              <span class="syn">{{ range $index, $element := $word_translations.words}}{{if $index}},
     118                {{end}}{{$element}}{{end}}</span>
     119              <span class="syn_type">{{$word_translations.frequency}}</span>
     120            </li>
     121            <br>
    29122            {{end}}
    30         </div>
    31         <br>
    32 
    33         <div class="wrap languages">
    34             <div class="language">
    35                 <select name="from" aria-label="Source language">
    36                     {{range $code, $name := .SourceLanguages}}
    37                     {{if and (eq $code "auto") $.SourceLanguage}}
    38                     <option value="{{ $code }}" {{if eq $code $.From}}selected{{end}}>{{ $name }} ({{index
    39                         $.SourceLanguages $.SourceLanguage}})</option>
    40                     {{else }}
    41                     <option value="{{ $code }}" {{if eq $code $.From}}selected{{end}}>{{ $name }}</option>
    42                     {{end}}
    43                     {{end}}
    44                 </select>
    45             </div>
    46 
    47             <div class="switch_languages">
    48                 <button id="switchbutton" aria-label="Switch languages"
    49                     formaction="/switchlanguages/?engine={{ .Engine }}" type="submit">&lt;-&gt;</button>
    50             </div>
    51 
    52             <div class="language">
    53                 <select name="to" aria-label="Target language">
    54                     {{range $code, $name := .TargetLanguages}}
    55                     <option value="{{ $code }}" {{if eq $code $.To}}selected{{end}}>{{ $name }}</option>
    56                     {{end}}
    57                 </select>
    58             </div>
    59         </div>
    60 
    61         <div class="wrap">
    62             <div class="item-wrapper">
    63                 <textarea autofocus class="item" id="input" name="text" dir="auto"
    64                     placeholder="Enter Text Here">{{ .OriginalText }}</textarea>
    65                 {{if .TtsFrom}}
    66                 <audio controls>
    67                     <source type="audio/mpeg" src="{{ .TtsFrom }}">
    68                 </audio>
    69                 {{end}}
    70             </div>
    71 
    72             <div class="item-wrapper">
    73                 <textarea id="output" class="translation item" dir="auto" placeholder="Translation"
    74                     readonly>{{.Translation.TranslatedText}}</textarea>
    75                 {{if .TtsTo}}
    76                 <audio controls>
    77                     <source type="audio/mpeg" src="{{ .TtsTo }}">
    78                 </audio>
    79                 {{end}}
    80             </div>
    81         </div>
    82 
    83         <br>
    84 
    85         <div class="center">
    86             <button type="submit">Translate with {{ index .enginesNames .Engine }}!</button>
    87         </div>
    88 
    89         <br>
    90 
    91         <div id="definitions_and_translations">
    92             {{ if .Translation.Definitions }}
    93             <div class="definitions">
    94                 {{ range $type, $definitions :=.Translation.Definitions }}
    95                 <span class="def_type">{{ $type }}</span>
    96                 <ol>
    97                     {{ range $definition_item := $definitions }}
    98                     <li>
    99                         {{ $definition_item.definition }}
    100                         <br>
    101                         {{with $definition_item.use_in_sentence}}
    102                         <span class="use_in_sentence">"{{$definition_item.use_in_sentence}}"</span>
    103                         <br>
    104                         {{end}}
    105                         {{with $definition_item.synonyms}}
    106                         {{ range $synonym_type, $_ := $definition_item.synonyms }}
    107                         <span class="syn">
    108                             {{if $synonym_type }}
    109                             <br>
    110                             <span class="syn_type">{{$synonym_type}}: </span>{{end}}{{ range $index, $element := index
    111                             $definition_item.synonyms $synonym_type}}{{if $index}}, {{end}}{{$element}}{{end}}
    112                         </span>
    113                         {{end}}
    114                         {{end}}
    115                     </li>
    116                     {{end}}
    117                 </ol>
    118                 {{end}}
    119             </div>
    120             {{ end}}
    121 
    122             {{ if .Translation.Translations }}
    123             <div class="translations">
    124                 {{ range $def_type, $translations := .Translation.Translations }}
    125                 <span class="def_type">{{ $def_type }}</span>
    126                 <ul>
    127                     {{ range $word, $word_translations := $translations }}
    128                     <li>
    129                         <span class="syn_type">{{$word}}:</span>
    130                         <span class="syn">{{ range $index, $element := $word_translations.words}}{{if $index}},
    131                             {{end}}{{$element}}{{end}}</span>
    132                         <span class="syn_type">{{$word_translations.frequency}}</span>
    133                     </li>
    134                     <br>
    135                     {{end}}
    136                 </ul>
    137                 {{end}}
    138             </div>
    139             {{end}}
    140         </div>
    141 
     123          </ul>
     124          {{end}}
     125        </div>
     126        {{end}}
     127      </div>
    142128    </form>
    143129    <br><br><br><br><br>
    144130    <footer class="center">
    145         <a href="https://codeberg.org/ManeraKai/simplytranslate">Source Code</a>
     131      <a href="https://codeberg.org/ManeraKai/simplytranslate">Source code</a> / <a href="https://git.chaotic.ninja/yakumo.izuru/simplytranslate">Modified source code</a>
    146132    </footer>
    147 
    148133    <script src="/static/script.js"></script>
    149 </body>
    150 
     134  </body>
    151135</html>
Note: See TracChangeset for help on using the changeset viewer.