Shan ⛰️ (
moonsweet
) wrote
2022
-
06
-
18
12:54 am
Entry tags:
!layouts
(no subject)
Style: Tabula Rasa
Custom SS
/*------------------------------------- - layout - blossom (tabula rasa) - https://myrtillenne.dreamwidth.org - icon font - material icons - https://material.io - image - picjumbo.com -------------------------------------*/ /*--------------- options ---------------*/ :root { --text-size: 14px; --text-color: #f75d93; --line-height: 1.5; --background-color: #fbc4e2; --link-color: #2a49a2; --link-hover-color: #11d66f; --icon-color: #50dff2; --icon-hover-color: #11d66f; --main-font: Open Sans, sans-serif; --title-font: Courgette, sans-serif; --title-color: #f75d93; --entry-width: 1000px; --entry-background-color: #fef4eb; --sidebar-background-color: #50dff2; --sidebar-image: url("https://starscall.dreamwidth.org/file/5443.png"); --sidebar-image-width: 320px; --sidebar-text-color: #fff; } /*--------------- fonts ---------------*/ @font-face { font-family: "Material Icons"; font-style: normal; font-weight: 400; src: url("https://fonts.gstatic.com/s/materialicons/v48/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2") format("woff2"); } /*--------------- general ---------------*/ H1, H2, H3 { margin: 0.25em 0; padding: 0.25em 0; } body { background: var(--background-color); border: 0; color: var(--text-color); line-height: var(--line-height); font-family: var(--main-font); font-size: var(--text-size); margin: 0; } a { color: var(--link-color); } a:hover { color: var(--link-hover-color); } a, a:link, a:visited, a:active { text-decoration: none; transition: color 0.4s linear; } img { border: none; } hr { display: none; } blockquote { margin: 1em 0; font-style: italic; } blockquote:before { content: "format_quote"; font-family: Material Icons; font-size: 26px; line-height: var(--text-size); font-style: normal; color: var(--icon-color); vertical-align: middle; } blockquote:after { content: "format_quote"; font-family: Material Icons; font-size: 26px; line-height: var(--text-size); font-style: normal; color: var(--icon-color); vertical-align: middle; } #canvas { margin: 20px 0; } #content > .inner:first-child { max-width: var(--entry-width); } @media (min-width: 600px) { #canvas { margin: 50px; } } @media (min-width: 1024px) { #content { margin-left: calc(var(--sidebar-image-width) + 90px); } } @media (min-width: 1280px) { #content { margin-right: 110px; } } /*--------------- header ---------------*/ #header { padding: 2em; text-align: center; background: var(--sidebar-background-color); color: var(--sidebar-text-color); } @media (min-width: 1024px) { #header { position: fixed; left: 44px; top: 0; background-image: var(--sidebar-image); background-size: cover; background-position: center center; background-color: transparent; width: var(--sidebar-image-width); height: 100%; display: table; border-right: 44px solid var(--sidebar-background-color); padding: 0; color: var(--title-color); } #header .inner { display: table-cell; vertical-align: middle; padding: 2em; } } h1#title { font-family: var(--title-font); padding: 0; margin: 0; } h1#title a, h1#title a:hover { color: inherit; } h2#subtitle { text-transform: uppercase; font-size: 1em; font-weight: normal; letter-spacing: 2px; padding: 0; margin: 0; } h2#pagetitle { display: none; } /*--------------- entries ---------------*/ .entry, .full .comment { border: 0; margin: 5px 0; background: var(--entry-background-color); clear: both; position: relative; } .header .inner { padding: 2em 2em 0; text-align: center; } .entry .entry-title { padding: 0; margin: 0; font-family: var(--title-font); font-size: 1.5em; font-weight: normal; line-height: 1.2; } .entry .entry-title a { color: inherit; } .header .datetime { text-transform: uppercase; letter-spacing: 2px; display: block; } .admin-post-icon, .sticky-entry-icon { display: none; } .has-userpic .userpic { float: right; } .restrictions img, .access-filter img { display: none; } .security-protected .access-filter:before { content: "lock"; font-family: Material Icons; font-size: 22px; vertical-align: middle; color: var(--icon-color); } .security-private .access-filter:before { content: "visibility_off"; font-family: Material Icons; font-size: 22px; vertical-align: middle; color: var(--icon-color); } .restrictions-NSFW .restrictions:before { content: "warning"; font-family: Material Icons; font-size: 22px; vertical-align: middle; color: var(--icon-color); } .restrictions-18 .restrictions:before { content: "18+"; font-size: 18px; font-family: arial, sans-serif; font-weight: bold; vertical-align: middle; color: var(--icon-color); } .userpic img { max-width: 50px; max-height: 50px; width: auto; height: auto; } .userpic img { border: 5px solid var(--sidebar-background-color); } @media (min-width: 1280px) { .has-userpic .userpic { position: absolute; width: 110px; top: 0; right: -115px; } .userpic img { max-width: 100px; max-height: 100px; } .entry-content { text-align: justify; } } .entry .poster { font-size: 0; } .entry .poster .ljuser { font-size: var(--text-size); } .entry .poster .ljuser:nth-child(1):before { content: "Written by "; } .entry .poster .ljuser:nth-child(2):before { content: " in "; padding-left: 0.25em; } .poster .ljuser img { display: none; } .poster .ljuser b { font-weight: normal; } .poster.empty { display: none; } .entry .contents, .comment .contents { margin: 2em 2em 0; } .entry-content, .comment-content { margin: 2em 0; } .entry-content ol, .comment-content ol, .entry-content ul, .comment-content ul { padding-left: 1em; } .entry-content li, .comment-content li { list-style-position: inside; } .entry-content img, .comment-content img { max-width: 100%; height: auto; } .cuttag-action { display: flex; align-items: center; line-height: 1; } .cuttag-action img { display: none; } .cuttag-action:before { content: "content_cut"; font-family: Material Icons; font-size: 22px; vertical-align: middle; margin-right: 5px; color: var(--icon-color); } .cuttag-action:after { content: ""; height: 0; width: 100%; border-bottom: 1px dashed var(--icon-color); } .cuttag + b { font-size: 0; } .cuttag + b a { font-size: var(--text-size); text-transform: lowercase; font-weight: normal; margin-left: 27px; } .metadata li { line-height: 1.2; padding-bottom: 0.5em; } .metadata ul { display: inline; list-style: none; margin: 0; padding: 0; } .metadata-label { display: none; } .metadata img { vertical-align: middle; } #metadata-music:before { content: "speaker"; font-family: Material Icons; font-size: 22px; vertical-align: middle; margin-right: 5px; color: var(--icon-color); } #metadata-mood:before { content: "sentiment_satisfied_alt"; font-family: Material Icons; font-size: 22px; vertical-align: middle; margin-right: 5px; color: var(--icon-color); } #metadata-location:before { content: "location_on"; font-family: Material Icons; font-size: 22px; vertical-align: middle; margin-right: 5px; color: var(--icon-color); } #metadata-xpost:before { content: "add_location"; font-family: Material Icons; font-size: 22px; vertical-align: middle; margin-right: 5px; color: var(--icon-color); } .footer { background: var(--sidebar-background-color); } .entry .footer ul { margin: 0; padding: 0; } .entry .tag { background: var(--entry-background-color); padding: 0 2em 0.5em; line-height: 1.2; } .tag-text { display: none; } .tag ul { display: inline; margin-left: 0; padding-left: 0; } .tag ul li { display: inline; } .tag:before { content: "tag"; font-family: Material Icons; font-size: 22px; vertical-align: middle; margin-right: 5px; color: var(--icon-color); } .tag-nav-trigger { vertical-align: middle; } .entry-management-links, .entry-interaction-links { clear: right; } ul.entry-management-links.icon-links li { float: left; list-style: none; margin: 5px 0 0 5px; padding: 0; background: var(--entry-background-color); } ul.entry-management-links.icon-links li a { display: block; width: 32px; height: 32px; color: var(--icon-color); } ul.entry-management-links li a img { display: none; } ul.entry-management-links.icon-links li a:hover { color: var(--icon-hover-color); background: var(--icon-background-hover-color); } ul.entry-management-links li a:before { display: block; font-family: Material Icons; width: 32px; height: 32px; font-size: 22px; line-height: 32px; text-align: center; } .icon-links .link_prev a:before { content: "arrow_back"; } .icon-links .edit_entry a:before { content: "edit"; } .icon-links .edit_tags a:before { content: "local_offer"; } .icon-links .mem_add a:before { content: "favorite"; } .icon-links .tell_friend a:before { content: "share"; } .icon-links .watch_comments a:before { content: "add_alert"; } .icon-links .link_next a:before { content: "arrow_forward"; } ul.entry-interaction-links li { float: left; list-style: none; margin: 5px 0 5px 5px; height: 32px; background: var(--entry-background-color); padding: 0; text-align: center; } li.entry-permalink, li.entry-replylink { width: 32px; } li.entry-readlink { min-width: 32px; box-sizing: border-box; padding: 0 7px !important; line-height: 32px; font-family: var(--title-font); font-size: 18px; font-weight: bold; } li.entry-permalink a { font-size: 0; width: 32px; height: 32px; display: block; } li.entry-replylink a { font-size: 0; width: 32px; height: 32px; display: block; } li.entry-permalink a:before, li.entry-replylink a:before { display: block; font-family: Material Icons; width: 32px; height: 32px; font-size: 22px; line-height: 32px; text-align: center; } li.entry-permalink a:before { content: "launch"; } li.entry-replylink a:before { content: "add_comment"; } ul.entry-interaction-links li a { color: var(--icon-color); } ul.entry-interaction-links li a:hover { color: var(--icon-hover-color); } .entry .footer:after { content: ""; display: block; clear: both; } /*--------------- comments ---------------*/ .comment-pages { margin: 5px 0; text-align: center; color: var(--sidebar-text-color); background: var(--sidebar-background-color); padding: 0.75em; line-height: 1; text-transform: uppercase; letter-spacing: 2px; } .comment-pages a { color: var(--sidebar-text-color); } .comment-wrapper { padding: 0; min-width: 15em; } .partial .comment { margin: 5px 0; padding: 1em; background: var(--entry-background-color); } .comment-title { padding: 0; margin: 0; } .full .comment-title { font-family: var(--title-font); font-size: 1.5em; font-weight: normal; line-height: 1.2; } .comment-title a { color: inherit; } .comment-date-text { display: none; } .poster-ip { display: block; } .comment .footer { text-align: center; padding: 0.75em; line-height: 1; clear: both; } .multiform-checkbox, ul.comment-management-links, ul.comment-interaction-links { margin: 0; padding: 0; display: inline; display: inline; text-transform: uppercase; letter-spacing: 2px; color: var(--sidebar-text-color); } ul.comment-management-links li, ul.comment-interaction-links li { display: inline; padding: 0 0.25em; } .comment-interaction-links a, .comment-management-links a { color: var(--sidebar-text-color); } .comment-interaction-links a:hover, .comment-management-links a:hover { color: var(--sidebar-text-color); } #comments ul.entry-interaction-links { display: none; } #comments ul.entry-management-links { display: none; } .comment-pages.bottompages { display: none; } .bottomcomment { background: var(--entry-background-color); text-align: center; } #qrformdiv { right: 0 !important; min-width: 100% !important; padding: 0; } #qrform { margin-top: 0.75em; background: var(--entry-background-color); padding: 1em; } #qrdiv input[type="button"], #qrdiv input[type="submit"] { background: var(--sidebar-background-color); border: 0; font-size: var(--text-size); font-family: var(--main-font); padding: 0.5em; color: var(--sidebar-text-color); line-height: 1; text-transform: uppercase; letter-spacing: 2px; } #postform { padding: 2em; background: var(--entry-background-color); box-shadow: 0 0 2px var(--shadow-color); } /*------------ archive, tags, icons containers ------------*/ .page-month .month, .tags-container, .icons-container { background: var(--entry-background-color); } .month-wrapper h3, .header h2 { font-weight: normal; font-size: 1.5em; padding: 0; font-family: var(--title-font); line-height: 1; } .page-month .month, .tags-container .contents, .icons-container .contents { padding: 2em; } #primary .manage-link { background: var(--sidebar-background-color); padding: 0.75em; line-height: 1; text-align: center; text-transform: uppercase; letter-spacing: 2px; } .month .footer a, #primary .manage-link a { color: var(--sidebar-text-color); } /*------------ archive------------*/ .month .header { background: var(--entry-background-color); margin: 5px 0; padding-bottom: 2em; } .day-date { display: none; } .month caption { display: none; } table.month { width: 100%; margin: 0 auto; text-align: center; border-collapse: collapse; } table.month th { color: var(--sidebar-text-color); text-transform: uppercase; font-weight: normal; background: var(--sidebar-background-color); padding: 3px; border: none; } table.month td { padding: 3px; background: var(--entry-background-color); height: 3em; } table.month td, table.month th { border-right: 5px solid var(--background-color); } table.month td:last-child, table.month th:last-child { border-right: none; } table.month tr, table.month th { border-bottom: 5px solid var(--background-color); } table.month tr:last-child { border-bottom: none; } table.month td.day-has-entries { background: var(--sidebar-background-color); color: var(--sidebar-text-color); } .month .footer { margin: 5px 0; padding: 10px; line-height: 1; text-align: center; text-transform: uppercase; letter-spacing: 2px; } .page-archive .navigation ul { background: var(--sidebar-background-color); margin: 5px 0; overflow: hidden; padding: 5px 0 0 5px; } .page-archive .navigation li { float: left; background: var(--entry-background-color); margin: 0 5px 5px 0; padding: 0 5px; line-height: 30px; } .page-month .navigation { background: var(--sidebar-background-color); padding: 0.75em; color: var(--sidebar-text-color); } .page-month .navigation a { color: var(--sidebar-text-color); } table.month td p { margin: 0; } .month dl { margin: 0; } .month dl dt { font-family: var(--title-font); font-weight: normal; text-align: center; } .month dl dt a { color: var(--text-color); } .month dd { margin: 1em 0 0; } .month dl .time { padding-right: 0.5em; } .month dl h3 { display: inline; font-size: 1em; } .page-month .month .entry-poster { margin-right: 0.5em; } /*------------ tags ------------*/ ul.ljtaglist { padding: 0; margin-left: 1em; list-style: inside square; } ul.ljtaglist:first-child, .tags_cloud ul { padding: 0; margin: 0; } /*------------ icons page ------------*/ .sorting-options ul { margin: 0 0 2em; padding: 0; text-align: center; } .sorting-options ul li { display: inline; } .page-icons .toppages { display: none; } .page-icons .bottompages { text-align: center; margin-top: 2em; } .icon { margin-top: 1em; overflow: hidden; } .icon-image { float: left; margin-right: 1em; } .icon-image img { display: block; } .icon-keywords ul { display: inline; margin: 0; padding: 0; } .icon-keywords ul li { display: inline; } .default.label { font-size: 0; } .default.label:before { content: "star"; font-family: Material Icons; font-size: 22px; font-style: normal; vertical-align: top; line-height: 22px; } .icon-pages p { margin: 0; } /*------------ modules ------------*/ @media (min-width: 1024px) { .module-section-one { width: 44px; height: 100%; background: var(--sidebar-background-color); position: fixed; top: 0; left: 0; } .module-section-one .inner { padding-top: 10px; } } .module-content ul { list-style: none; margin: 0; padding: 0; } .module-content li { margin: 0; } .module-navlinks li { display: block; padding: 0.75em; margin: 5px 0; background: var(--sidebar-background-color); text-align: center; line-height: 1; } .module-navlinks li a { text-transform: uppercase; color: var(--sidebar-text-color); letter-spacing: 2px; } .module-typelist h2, .module-customtext h2 { font-size: 1em; text-transform: uppercase; letter-spacing: 2px; font-weight: normal; line-height: 1; color: var(--sidebar-text-color); background: var(--sidebar-background-color); padding: 0.75em; text-align: center; } .module-typelist h2 a, .module-customtext h2 a { color: var(--sidebar-text-color); } .module-typelist .module-content, .module-customtext .module-content { background: var(--entry-background-color); padding: 1em; box-sizing: border-box; margin-top: 5px; } @media (min-width: 1024px) { .module-navlinks li { padding: 0; margin: 0; } .module-navlinks li a { width: 34px; height: 34px; display: block; overflow: hidden; margin: 5px; text-transform: none; letter-spacing: 0; } .module-navlinks li a { color: var(--icon-color); } .module-navlinks li a:hover { color: var(--icon-hover-color); } .module-navlinks li a:before { width: 34px; height: 34px; display: block; font-family: Material Icons; font-size: 22px; line-height: 34px; text-align: center; vertical-align: middle; background: var(--entry-background-color); transition: color 0.4s linear; } .list-item-recent a:before { content: "home"; } .list-item-archive a:before { content: "date_range"; } .list-item-read a:before { content: "library_books"; } .list-item-network a:before { content: "public"; } .list-item-tags a:before { content: "style"; } .list-item-memories a:before { content: "collections_bookmark"; } .list-item-userinfo a:before { content: "account_box"; } .module-typelist, .module-customtext { position: relative; height: 34px; width: 0; padding-left: 44px; padding-bottom: 5px; transition: width 0.4s step-end; } .module-typelist:hover, .module-customtext:hover { width: var(--sidebar-image-width); transition: width 0.4s step-start; } .module-typelist:before, .module-customtext:before { width: 34px; height: 34px; display: block; font-family: Material Icons; font-size: 22px; line-height: 34px; text-align: center; vertical-align: middle; color: var(--icon-color); background: var(--entry-background-color); cursor: pointer; position: absolute; top: 0; left: 0; margin: 0 5px; transition: color 0.4s linear; } .module-typelist:hover:before, .module-customtext:hover:before { color: var(--icon-hover-color); } .module-typelist:before { content: "near_me"; } .module-customtext:before { content: "chat"; } .module-typelist h2, .module-customtext h2 { margin: 0 10px; box-sizing: border-box; height: 34px; line-height: 34px; padding: 0; visibility: hidden; opacity: 0; transition: visibility 0.4s step-end, opacity 0.4s linear; } .module-typelist .module-content, .module-customtext .module-content { margin: 5px 10px 0; visibility: hidden; opacity: 0; transition: visibility 0.4s step-end, opacity 0.4s linear; } .module-typelist:hover h2, .module-typelist:hover .module-content, .module-customtext:hover h2, .module-customtext:hover .module-content { visibility: visible; opacity: 1; transition: visibility 0.4s step-start, opacity 0.4s linear; width: auto; } } .module .manage-link, .module-userprofile, .module-calendar, .module-tags_list, .module-cuttagcontrols, .module-pagesummary, .module-active, .module-credit, .module-syndicate, .module-subscriptionfilters, .module-search, .module-time, .module-powered { display: none; } /*------------ navigation & footer ------------*/ .navigation li { display: inline; } .navigation .page-separator, .topnav, .noentries { display: none; } .navigation { text-align: center; } .navigation ul { margin: 0; padding: 0; } li.page-back, li.page-forward { display: block; padding: 0.75em; margin: 5px 0; background: var(--sidebar-background-color); text-align: center; line-height: 1; } li.page-back a, li.page-forward a { text-transform: uppercase; color: var(--sidebar-text-color); letter-spacing: 2px; } @media (min-width: 1024px) { #entries .navigation ul { position: fixed; list-style: none; left: calc(var(--sidebar-image-width) + 44px); bottom: 49px; width: 44px; } li.page-back, li.page-forward { padding: 0; margin: 0; } li.page-back a, li.page-forward a { width: 34px; height: 34px; display: block; overflow: hidden; margin: 5px; text-transform: none; letter-spacing: 0; } li.page-back a, li.page-forward a { color: var(--icon-color); } li.page-back a:hover, li.page-forward a:hover { color: var(--icon-hover-color); } li.page-back a:before, li.page-forward a:before { width: 34px; height: 34px; display: block; font-family: Material Icons; font-size: 22px; line-height: 34px; text-align: center; vertical-align: middle; background: var(--entry-background-color); } li.page-back a:before { content: "arrow_back"; } li.page-forward a:before { content: "arrow_forward"; } } #footer { padding: 0.75em; margin: 5px 0; background: var(--sidebar-background-color); text-align: center; line-height: 1; } .page-top a { text-transform: uppercase; color: var(--sidebar-text-color); letter-spacing: 2px; } @media (min-width: 1024px) { #footer { position: fixed; margin: 0; padding: 0; left: calc(var(--sidebar-image-width) + 44px); bottom: 10px; width: 44px; height: 44px; background: transparent; } .page-top a { width: 34px; height: 34px; display: block; overflow: hidden; margin: 5px; text-transform: none; letter-spacing: 0; } .page-top a { color: var(--icon-color); } .page-top a:hover { color: var(--icon-hover-color); } .page-top a:before { content: "arrow_upward"; width: 34px; height: 34px; display: block; font-family: Material Icons; font-size: 22px; line-height: 34px; text-align: center; vertical-align: middle; background: var(--entry-background-color); } } /*------------ contextual pop-up ------------*/ div.ContextualPopup { background: var(--entry-background-color); color: var(--text-color); font-family: var(--main-font); border: 0; padding: 1em; } .ContextualPopup a { color: var(--link-color); } .ContextualPopup a:visited { color: var(--link-color); } .ContextualPopup a:hover { color: var(--link-hover-color); } .ContextualPopup a:active { color: var(--link-color); } div.ContextualPopup .Relation { font-size: 1em; margin: 0.5em; } div.ContextualPopup .Userpic { border: 0; } div.ContextualPopup .Userpic img { border: 5px solid var(--sidebar-background-color); } /*------------ control strip ------------*/ #lj_controlstrip { background: var(--entry-background-color); color: var(--text-color); width: auto; } @media (min-width: 1024px) { #lj_controlstrip { padding-left: calc(var(--sidebar-image-width) + 88px); } } #lj_controlstrip > div { font-family: var(--main-font); font-size: var(--text-size); line-height: var(--line-height); padding: 0.25em 0.5em; flex-grow: 0; } #lj_controlstrip a { font-family: var(--main-font); color: var(--link-color); } #lj_controlstrip a:hover { color: var(--link-hover-color); text-decoration: none; } #lj_controlstrip_statustext { color: var(--text-color); font-weight: normal; font-size: var(--text-size); } #lj_controlstrip input, #lj_controlstrip select { font-size: var(--text-size) !important; color: var(--text-color) !important; font-family: var(--main-font) !important; } #lj_controlstrip input[type="submit"] { border: 0; background: var(--sidebar-background-color) !important; text-transform: uppercase; color: var(--sidebar-text-color) !important; padding: 0.5em; letter-spacing: 2px; } #lj_controlstrip .ljuser b { font-weight: normal; } #lj_controlstrip .ljuser img { display: none; } #lj_controlstrip_user, #lj_controlstrip_login, #lj_controlstrip_actionlinks { border: 0; }
(
0 comments
)
Post a comment in response:
From:
Anonymous
This account has disabled anonymous posting.
OpenID
Identity URL:
Log in?
Dreamwidth account
Account name
Password
Log in?
If you don't have an account you can
create one now
.
Subject
HTML doesn't work in the subject.
Formatting type
Casual HTML
Markdown
Raw HTML
Rich Text Editor
Message
[
Home
|
Post Entry
|
Log in
|
Search
|
Browse Options
|
Site Map
]