VI

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » VI » Bitwarden » Support custom style sheet


Support custom style sheet

Сообщений 1 страница 5 из 5

1

Здесь я использовать простое: Border.  Его ширина   изначально 0. Граница регулируется TailWind.
Вот так сразу переопределить его у меня не получается.
Внешний border увеличивает  границу TailWind , и вызывает смещение каждого элемента на толщину border  -- 'j неправильно.
Но здесь тема не  для  точного воспроизведения , а для возможностей.

2. Сразу после создания этой темы, через 3 дня, Opera отключила возможность редактирования свойств CSS. И всего кода в целом.
Не через 3 года , не за 3 года до создания этой темы. А через 3 дня.
Вы сами можете предположить, "откуда растут ноги".

Т.е. в Опере вы не увидите этой красоты. Вы не сможете  применить свои знания.

Я понимаю -- вся забота BW в опасности редактирования JS. Т.е. вы сами можете, на своем компьютере ,  отредактировать свой JS и украсть свои же пароли.

Но это не оправдывает отключение редактирования CSS. И как следует из названия этой темы, есть способы и обеспечить целостность BW, и оставить детский развлекательный моддинг своим пользователям. Link

0

2

Да, они отключили моддинг в Опере. И подозреваю, что прямо сейчас ведут переговоры с другими Chromium -- сделать такую же пакость.
Соответсвенно , моей теме с их моддингом грозит удаление -- чтобы не смущать простых тупых юзеров. Нет темы , и нечего на нее смотреть.
Вы будете юзать только с тем цветом, который решили мы.

0

3

Support custom style sheet

A huge request to the developers: provide an address field for custom_style.css This address must be saved in the settings. This means that BITWARDEN will be updated without deleting custom_style.css.

But it’s even better – to the database with logins :slight_smile:

Something like this isdone in Vivaldi. How it fits with Chromium

The whole BITWARDEN is a mini-website.

...\Opera\profile\data\Default\Extensions\ccnckbpmaceehanjmeomladnmlffdjgn\2025.2.0_0\popup\main.css

Add to the END

Код:
// ============= Your CSS ============== 
bit-item { 
       transition: transform 10s cubic-bezier(0.5, -0.8, 0.5, 1.5); 
     &:hover { 
       border: 2px solid red; 
       transform: perspective(300px) rotateX(360deg) rotateY(10deg) scale(1.2); 
       transition: transform 1s; } }
// ============= /Your CSS ============== 

You can add something. Or delete it.

(Opera, and any Chromium)

If you need more, feel the breadth of BW’s capabilities – use

Код:
@keyframes ... {}
and 
animation: ...

0

4

Rather, it is not precisely this implementation that is important here.
But the ability to style the previous and subsequent elements. You can set the rest as you like.
You may to mod simple this code for styling +/-2 elements regarding :hover

Код:
/* ============= /Your CSS ============== */
:root {
	--cubic: ease-out ; /* cubic-bezier(0.5, -0.0, 0.5, 1.0) */
	--fr_col: red;
	--bord1: 1px solid var(--fr_col);
	--bord2: 2px solid var(--fr_col);
	--transf: perspective(300px) rotateY(10deg) translateX(7%) translateZ(3vw) scale(0.95, 1.1);
	--trans-in: 0.5s var(--cubic);
	--trans-out: 1s var(--cubic);
	}

/* ========== Folder, Type ========== */

bit-chip-select {
	transform-origin: center top;
	transition: var(--trans-out);
  &:hover {
	transform: perspective(300px) rotateX(20deg) scale(1.1);
	transition: var(--trans-in); 
	.tw-border  { border: var(--bord2); } }
}

/* ========== List ========== */

[id^="cdk-overlay-"] {
	transform-origin: center top;
	transition: var(--trans-out);
  &:hover {
	transform: perspective(300px) rotateX(5deg) scale(1.05);
	transition: var(--trans-in); 
	.tw-border  { border: var(--bord2) ;} }
}


/* ========== Login ========== */

bit-item {
	transition: var(--trans-out);

  &:hover {
	border: var(--bord2); 
	transform: perspective(300px) rotateY(20deg) translateX(10%) translateZ(4vw) scale(0.95, 1.2); 
    transition: var(--trans-in);
	.tw-border  { border: var(--bord2) ;}
   & + * {
    border: var(--bord1);
    transform: var(--transf) translateY(3%) rotateX(-20deg);
    transition: var(--trans-in);	}
   }
   &:has(+ &:hover) {
    border: var(--bord1);
    transform: var(--transf) translateY(-3%) rotateX(20deg);
    transition: var(--trans-in); 	}
}


/* ============= /Your CSS ============== */

0

5

1. Here I use a simple one: Border: 2px. Its width is initially 0. The border is adjusted by TailWind.
I can’t redefine it right away.
The outer border increases the TailWind border, and causes each element to be offset by the thickness of the border – it is incorrect.
But here the theme is not for accurate reproduction, but for possibilities.

2. Immediately after creating this theme, 3 days later, Opera disabled the ability to edit CSS properties. And the entire code as a whole.
Not 3 years later, not 3 years before the creation of this theme. .But after 3 days.
You can guess for yourself “where the legs grow from.”

In other words, you won’t see this beauty in the Opera. You won’t be able to apply your knowledge.

I understand that BW’s whole concern is in the danger of editing JS. That is, you can edit your JS on your computer and steal your own passwords.

But that doesn’t justify disabling CSS editing. And as the name of this topic suggests, there are ways to both ensure the integrity of BW and leave children’s entertainment modding to their users.

0


Вы здесь » VI » Bitwarden » Support custom style sheet