[2] Minimal Rainbow Layout

[lina_trinch]

❖ Mobile friendly! ❖ Stylized control strip ❖ Comment, tag, archive pages ❖ New images for user & community names ❖ Navigation links at the bottom ❖ Links turn rainbow on hover

code here!
temporary live-preview here!
imgur album preview here!

❖ Go to Select a New Theme and select Tabula Rasa, the Plain version. ❖ Copy and paste the code into the Use embedded CSS field under Custom CSS. ❖ Under Choose Page Setup (at the bottom), select "1 Column (modules at bottom; no sidebar)," aka the first one. ❖ Make sure Use layout's stylesheet(s) is checked. In the Custom stylesheet URL field, paste in: https://fonts.googleapis.com/css2?family=Sawarabi+Mincho&display=swap ❖ Go to the Presentation tab. Select "text-only" for the following options: • Select whether user interaction links are printed as text or using the available icons • Select whether entry management links are printed as text or using the available icons • Select whether comment management links are printed as text or using the available icons ❖ Images for the user and community links provided by Icons8. If you'd like to replace the images, here are the urls to CTRL+F for. About 10-12 pixels is your target size. These are both 11px. https://img.icons8.com/office/11/000000/rainbow.png https://img.icons8.com/office/11/000000/rgb-circle-2.png Activating Entry Interaction/Management Links Click here for image preview of entries with interaction/management links. ❖ First, CTRL+F for the text below and remove the whole thing the first time you find it in the code, including that comma at the start. , ul.entry-interaction-links, ul.entry-management-links ❖ Next, scroll down to the bottom of the code. CTRL+F this text and remove that, too. /*--If you want entry interaction & management links to appear in the layout, remove this. ❖ You're done! If you hit a snag, let me know. #fff #999 #858585 Links rgba(241,133,133) rgba(213,210,121) rgba(154,228,145) rgba(144,180,222) rgba(233,130,222) Entry & comment border rgba(241,133,133,0.5) rgba(213,210,121,0.5) rgba(154,228,145,0.5) rgba(144,180,222,0.5) rgba(233,130,222,0.5) Text boxes, drop downs, & archive days backgrounds rgba(241,133,133,0.2) rgba(213,210,121,0.2) rgba(154,228,145,0.2) rgba(144,180,222,0.2) rgba(233,130,222,0.2) Blockquote background rgba(241,133,133,0.1) rgba(213,210,121,0.1) rgba(154,228,145,0.1) rgba(144,180,222,0.1) rgba(233,130,222,0.1) Guide to RGBA Colors! Guide to Gradients! Guide to Percentages in Gradients!

Comments

[adore]

hello! this is beautiful! is it possible to have icons display alongside the posts?

[lina_trinch]

Sure! Try adding this at the end of your layout.

.userpic { display: block; background: #fff; padding: 10px 0 0 10px; height: 50px; } .userpic img { width: 75px; height: 75px; border-radius: 50px; }

It'll look like this.

Alternatively:

.userpic { display: block; background: #fff; padding: 10px 0 0 10px; height: 0; } .userpic img { width: 75px; height: 75px; border-radius: 50px; position: relative; right: 120px; }

This one will look like this.

Let me know if you'd like a different look!

[adore]

lovely, thank you so much!