Vivaldi Forum mod

sjudenim

If anyone is interested, I've recreated the old "LightGrey" theme for the new system. It will require the User css option to be selected.

Theme
{"themeName":"Light Grey","colorBg":"#eeeff1","colorFg":"#586e75","colorHi":"#2aa198","colorAc":"#28292a","colorLi":"#2aa198","colorCo":"#2aa198","colorDd":"#28292a"}

css

.btn-primary, .btn-primary[disabled], .account .cover .indicator, .account .cover .save, .btn-danger, .btn-success, a.list-group-item {
    border-radius: 4px;
}

#menucontent { background-color: hsl(210, 3%, 13%); }

.form-control, #vivaldinav #search-form #search-fields input.form-control:not(:focus) {
    background-color: var(--colorAc);
    border-color: transparent;
    color: var(--colorFg);
}

#content {
    margin-top: 30px;
    background: white !important;
    border: 10px solid transparent;
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, .05) !important;
    padding: 25px 50px 0 !important;
}


.topic-list-header, .topic .topic-header {
    background-color: white !important;
    border-color: transparent;
}

.categories>li .content .icon, .category>ul>li .content .icon {border-radius: 50%}

.categories>li,
.category>ul>li {
    border-bottom: 1px solid var(--colorBg);
    padding-bottom: 20px;
}

.categories>li:hover, .category>ul>li:hover {background-color: transparent !important}

.categories>li:last-of-type,
.category>ul>li:last-of-type {
    border-bottom: 1px solid white;
    padding-bottom: 25px;
}

.categories>li .content h2, .category>ul>li .content h2 {font-size: 1.5rem}

h2.title a, a.search-result-text h4, span.pull-right.post-preview-footer a { font-weight: 500; }

.categories .description, .category .description, .subcategory .description {
    font-size: 1.3rem;
    font-weight: 400;
    line-height: 1.2;
    color: var(--colorFg);
    margin-top: 5px;
    min-height: 25px;
}

div.description p {color: var(--colorFg)}

span.category-children a small { font-weight: 400 !important; }

span.category-children a small {font-weight: 500}

span.timeago, small.timeago, .breadcrumb>.active, .topic h1 .topic-title, .posts-list .posts-list-item .topic-title, .topic .posts>li a, a {color: var(--colorHi)}

.topic .posts>li a:hover {color: var(--colorAc)}

.topic [component="post/replies"] {margin-top: 28px}

li[component="post"] {
    background: var(--second-bg);
    position: relative !important;
    padding: 10px 10px !important;
    margin-bottom: 10px !important;
    border-bottom: 1px solid var(--colorBg)
}

li[component="post"]:last-of-type {border-bottom: none}

blockquote {background-color: var(--colorBg)}

div.message-body p, span.chat-timestamp.timeago {font-weight: 400}

luetage

@sjudenim You need to use 3 backticks before and after the theme code to make the install on click work.

{"themeName":"Light Grey","colorBg":"#eeeff1","colorFg":"#586e75","colorHi":"#2aa198","colorAc":"#28292a","colorLi":"#2aa198","colorCo":"#2aa198","colorDd":"#28292a"}

And it’s probably better to precede all selectors with the class name of the theme, to make it possible for people to save more than one theme modification simultaneously and not to influence other themes when switching.

/* Theme Light Grey */

.vfm_Light_Grey .btn-primary,
.vfm_Light_Grey .btn-primary[disabled],
.vfm_Light_Grey .account .cover .indicator,
.vfm_Light_Grey .account .cover .save,
.vfm_Light_Grey .btn-danger,
.vfm_Light_Grey .btn-success,
.vfm_Light_Grey a.list-group-item {
  border-radius: 4px;
}
.vfm_Light_Grey #menucontent {
  background-color: hsl(210, 3%, 13%);
}
.vfm_Light_Grey .form-control,
.vfm_Light_Grey #vivaldinav #search-form #search-fields input.form-control:not(:focus) {
  background-color: var(--colorAc);
  border-color: transparent;
  color: var(--colorFg);
}
.vfm_Light_Grey #content {
  margin-top: 30px;
  background: white !important;
  border: 10px solid transparent;
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.05) !important;
  padding: 25px 50px 0 !important;
}
.vfm_Light_Grey .topic-list-header,
.vfm_Light_Grey .topic .topic-header {
  background-color: white !important;
  border-color: transparent;
}
.vfm_Light_Grey .categories > li .content .icon,
.vfm_Light_Grey .category > ul > li .content .icon {
  border-radius: 50%;
}
.vfm_Light_Grey.categories > li,
.vfm_Light_Grey .category > ul > li {
  border-bottom: 1px solid var(--colorBg);
  padding-bottom: 20px;
}
.vfm_Light_Grey .categories > li:hover,
.vfm_Light_Grey .category > ul > li:hover {
  background-color: transparent !important;
}
.vfm_Light_Grey .categories > li:last-of-type,
.vfm_Light_Grey .category > ul > li:last-of-type {
  border-bottom: 1px solid white;
  padding-bottom: 25px;
}
.vfm_Light_Grey .categories > li .content h2,
.vfm_Light_Grey .category > ul > li .content h2 {
  font-size: 1.5rem;
}
.vfm_Light_Grey h2.title a,
.vfm_Light_Grey a.search-result-text h4,
.vfm_Light_Grey span.pull-right.post-preview-footer a {
  font-weight: 500;
}
.vfm_Light_Grey .categories .description,
.vfm_Light_Grey .category .description,
.vfm_Light_Grey .subcategory .description {
  font-size: 1.3rem;
  font-weight: 400;
  line-height: 1.2;
  color: var(--colorFg);
  margin-top: 5px;
  min-height: 25px;
}
.vfm_Light_Grey div.description p {
  color: var(--colorFg);
}
.vfm_Light_Grey span.category-children a small {
  font-weight: 400 !important;
}
.vfm_Light_Grey span.category-children a small {
  font-weight: 500;
}
.vfm_Light_Grey span.timeago,
.vfm_Light_Grey small.timeago,
.vfm_Light_Grey .breadcrumb > .active,
.vfm_Light_Grey .topic h1 .topic-title,
.vfm_Light_Grey .posts-list .posts-list-item .topic-title,
.vfm_Light_Grey .topic .posts > li a,
.vfm_Light_Grey a {
  color: var(--colorHi);
}
.vfm_Light_Grey .topic .posts > li a:hover {
  color: var(--colorAc);
}
.vfm_Light_Grey .topic [component="post/replies"] {
  margin-top: 28px;
}
.vfm_Light_Grey li[component="post"] {
  background: var(--second-bg);
  position: relative !important;
  padding: 10px 10px !important;
  margin-bottom: 10px !important;
  border-bottom: 1px solid var(--colorBg);
}
.vfm_Light_Grey li[component="post"]:last-of-type {
  border-bottom: none;
}
.vfm_Light_Grey blockquote {
  background-color: var(--colorBg);
}
.vfm_Light_Grey div.message-body p,
.vfm_Light_Grey span.chat-timestamp.timeago {
  font-weight: 400;
}

But these are minor technicalities, the theme works great, thanks!

hlehyaric

@luetage I knew something was wrong but I wasn't sure it was not on my side…

luetage

@hlehyaric I’m relieved you didn’t mention it. In the event the problem was on your side after all, everyone would have made fun of you and in the end you likely would have been banished. Stay safe!

hlehyaric

@luetage said in Vivaldi Forum mod:

everyone would have made fun of you

I couldn't have stood it & I would have had to flee to the depth of the darkest corner of the Universe…

Btw, when I realized something was wrong, it was way too late to try & figure it out. Just thought there was something I didn't understand & well, there would be a new dawn [at least I hoped so].

ybjrepnfr

@hlehyaric said in Vivaldi Forum mod:

flee to the depth of the darkest corner of the Universe

hey, nick off, this is my dark corner, go pick some other dark corner of the universe. sheesh, there's always one...

hlehyaric

@ybjrepnfr This forum is kind of a black hole… [can't upvote because ten blablabla…]

ybjrepnfr

@hlehyaric

Naa nee naa nee naa naaaaaaaa!

hlehyaric

@ybjrepnfr I'm going to migrate to Opera Forum.

Oh wait… this is not the right place.
And Opera Forum is a dead place… rip

ybjrepnfr

@hlehyaric as a noob around these parts, i was lead to believe that it was a well disciplined community here who know the importance of remaining on topic in threads, and who consequently never stray at all. ever. now i'm beginning to suspect that the cornflakes box on which i'd read that advice, might have been mistaken. shocked, i am.

hlehyaric

@ybjrepnfr said in Vivaldi Forum mod:

it was a well disciplined community

Yes, it is. How it is disciplined remains an open discussion…

cornflakes box

You eat cornflakes????? Flagged, reported & blocked.

luetage

@ybjrepnfr Remaining on topic is no problem. Perhaps we could introduce code in the mod to compare a written post with the topic title, estimating its OTness. Then everyone needs a gadget. Before writing a post you stick your toe in that gadget. Imagine the rest.

See how I brought us back on topic? My toes are safe.

ybjrepnfr

@hlehyaric said in Vivaldi Forum mod:

How it is disciplined remains an open discussion

yes, during drafting i did pause & ponder if anyone might choose to take this conversation into certain unintended directions, but then i recalled the exemplary calibre of all the people here, & concluded there was no risk, as nobody would even think of that, shirley!

@hlehyaric said in Vivaldi Forum mod:

You eat cornflakes????? Flagged, reported & blocked.

no no no, goodness me no of course not; who could be that crazy? all of my friend simply uses c/f boxes for advice on latest browser and tech forum advice.

hlehyaric

@ybjrepnfr said in Vivaldi Forum mod:

c/f boxes for advice on latest browser and tech forum advice.

How clever! Will do the same from now on…

ybjrepnfr

@hlehyaric i would dearly like to reply, but sadly i cannot, as it seems that some mean cruel horrible bully has

Flagged, reported & blocked

me.

TbGbe · Win: Snapshot Vivaldi 7.4.3684.18

@ybjrepnfr said in Vivaldi Forum mod:

uses c/f boxes for advice on latest browser and tech forum advice.

Hey, then you don't even have to purchase them!
Just spend an hour or so browsing market shelves

sjudenim

They've broken it again

luetage

@sjudenim Yes, the changes are quite substantial. This will take some time.

ybjrepnfr

@luetage sisyphus...

shifte