Just Girly Things Theme
Rating:
Rating w/ Info Pane:
This is a theme for the Just Girly Things Group of Interest. To use this theme on an article, paste the following into your page:
[[include :scp-wiki:theme:just-girly-things]]

An image.
Header
header | header | header | header | header |
---|---|---|---|---|
cell-content | cell-content | cell-content | cell-content | cell-content |
@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap'); /* --------------------------------- Just Girly Things Redux 2020 Wikidot Theme Created by stormbreath, aesthetic consultation from DianaBerry Header Image: https://pixabay.com/illustrations/tablecloth-greeting-solemnly-1628237/ Logo Image by CalibriBold --------------------------------- */ /* -------------- HEADER -------------- */ div#container-wrap { background-image: none; } div#extra-div-1 { height: 140px; width: 100%; top: 0; position: absolute; background: url("https://scp-wiki.wdfiles.com/local--files/theme%3Ajust-girly-things/tablecloth.png"); background-size: cover; background-position: 20% 20%; } div#extra-div-2 { height: 22px; width: 100%; top: 140px; position: absolute; background: linear-gradient(to bottom, hsl(335, 55%, 55%), hsl(335, 55%, 50%)); } div#header { background-image: url("https://scp-wiki.wdfiles.com/local--files/theme%3Ajust-girly-things/JGTLOGONEW.png"); filter: drop-shadow(.1rem .1rem .063rem hsl(335, 100%, 8%)); } #header h1 a { color: transparent; text-shadow: none; } #header h1 a::before { content: "Just Girly Things!"; font-family: 'Lobster', cursive; color: hsl(335, 90%, 95%); } #header h2 span { color: transparent; text-shadow: none; } #header h2 span::before { content: "By Girls, for Girls"; color: hsl(335, 90%, 70%); font-family: 'Lobster', cursive; letter-spacing: 2px; padding-left: 4em; } /*-------------- LOG-IN INFO -------------- */ #login-status, #login-status a { color: hsl(335, 100%, 98%); } #login-status ul a:hover { font-weight: bold; } #account-topbutton { background: transparent; color: hsl(335, 100%, 14%); border: none; } #account-options { background: hsl(335, 90%, 95%); border-color: hsl(335, 55%, 55%); } /* -------------- SEARCH-BAR -------------- */ #search-top-box-input { border: solid 1px #e5e5e5; color: #e5e5e5; background-color: hsl(335, 90%, 30%); } #search-top-box-input:hover, #search-top-box-input:focus { background-color: hsl(335, 90%, 45%); } #search-top-box-form input[type=submit] { border: solid 1px #e5e5e5; color: #e5e5e5; background-color: hsl(335, 90%, 50%); background: linear-gradient( to bottom, hsl(335, 90%, 60%), hsl(335, 90%, 50%), hsl(335, 90%, 40%)); box-shadow: none; } #search-top-box-form input[type=submit]:hover, #search-top-box-form input[type=submit]:focus { background-color: hsl(335, 90%, 60%); background: linear-gradient( to bottom, hsl(335, 90%, 70%), hsl(335, 90%, 60%), hsl(335, 90%, 50%)); box-shadow: none; } /* -------------- TOP-BAR -------------- */ #top-bar ul li ul { border: solid 1px hsl(335, 90%, 85%); } #top-bar ul li.sfhover ul li a, #top-bar ul li:hover ul li a { border-top: 1px solid hsl(335, 90%, 85%); } #top-bar ul li.sfhover a, #top-bar ul li:hover a { background: hsl(335, 90%, 95%); } /* -------------- BODY -------------- */ body { background: hsl(335, 100%, 98%); color: hsl(335, 100%, 14%); } #page-title, h1 { color: hsl(335, 95%, 45%) } #page-title { border-bottom-color: hsl(335, 90%, 75%); } /* -------------- SIDE-BAR -------------- */ #side-bar .side-block, #interwiki .side-block { border: 1px solid hsl(335, 90%, 25%); box-shadow: 0 2px 6px rgba(121, 6, 54,.5); color: hsl(335, 90%, 25%); background: hsl(335, 100%, 98%); } #side-bar .heading, #interwiki .heading { color: hsl(335, 90%, 25%); border-bottom: solid 1px hsl(335, 90%, 25%); } #side-bar .side-block.media { background-color: hsl(335, 55%, 55%); } #side-bar .side-block.resources { background-color: hsl(335, 90%, 95%); } #interwiki .side-block { background: hsl(335, 85%, 95%); } #side-bar .collapsible-block-unfolded-link { border-bottom: solid 1px hsl(335, 90%, 25%); } #side-bar .collapsible-block-unfolded-link .collapsible-block-link { color: hsl(335, 90%, 25%); } #side-bar .collapsible-block-unfolded-link .collapsible-block-link:hover { color: hsl(335, 95%, 45%); } #interwiki .menu-item img { filter: hue-rotate(340deg); } /* -------------- FOOTER -------------- */ #footer { background: hsl(335, 55%, 55%); color: hsl(335, 100%, 98%); } /* -------------- LINKS -------------- */ a, #side-bar a, #interwiki a, #top-bar ul li.sfhover a, #top-bar ul li:hover a, #login-status ul a, #login-status ul a:hover, a.newpage { color: hsl(335, 95%, 45%); } a:visited { color: hsl(335, 95%, 35%); } /* -------------- PAGE EDITING OPTIONS -------------- */ .buttons .btn { background-color: hsl(335, 90%, 95%); border-color: hsl(335, 90%, 85%); color: hsl(335, 100%, 14%); } .buttons .btn:hover { background-color: hsl(335, 90%, 90%); color: hsl(335, 100%, 14%); } #lock-info { background-color: hsl(335, 90%, 95%); border-color: hsl(335, 90%, 85%); } /* -------------- RATING MODULE -------------- */ div.page-rate-widget-box .rate-points { background-color: hsl(335, 55%, 55%); color: hsl(335, 90%, 95%); border: solid 1px hsl(335, 55%, 55%); } .page-rate-widget-box .rateup, .page-rate-widget-box .ratedown { background-color: hsl(335, 90%, 95%); border-top: solid 1px hsl(335, 55%, 55%); border-bottom: solid 1px hsl(335, 55%, 55%); } .page-rate-widget-box .rateup a, .page-rate-widget-box .ratedown a { background: transparent; color: hsl(335, 55%, 55%); } .page-rate-widget-box .rateup a:hover, .page-rate-widget-box .ratedown a:hover { background: hsl(335, 55%, 55%); color: hsl(335, 90%, 95%); } .page-rate-widget-box .cancel { background: transparent; background-color: hsl(335, 55%, 55%); border: solid 1px hsl(335, 55%, 55%); } .page-rate-widget-box .cancel a { color: hsl(335, 90%, 95%); } .page-rate-widget-box .cancel a:hover { background: hsl(335, 90%, 95%); color: hsl(335, 55%, 55%); } /* Info Module */ #page-content .rate-box-with-credit-button { background-color: hsl(335, 55%, 55%); border-color: hsl(335, 55%, 55%); border-radius: 5px; box-shadow: 1px 1px 3px rgba(0,0,0,.5); } #page-content .creditButton p a { border-left-color: hsl(335, 90%, 95%); } #page-content .creditButton p a:hover { color: hsl(305, 100%, 15%); } /* -------------- OTHER ELEMENTS -------------- */ blockquote, div.blockquote, .code { border-color: hsl(335, 90%, 85%); background-color: hsl(335, 90%, 95%); } #page-content .wiki-content-table tr th { background-color: hsl(335, 55%, 55%); color: hsl(335, 100%, 98%); border: 1px solid hsl(335, 100%, 14%); } .scp-image-block .scp-image-caption { background-color: hsl(335, 90%, 95%); } .yui-navset .yui-nav, .yui-navset .yui-navset-top .yui-nav { border-color: hsl(335, 90%, 75%); /* color between tab list and content */ } .yui-navset .yui-nav a, .yui-navset .yui-navset-top .yui-nav a { background-color: transparent !important; /* tab background */ border-color: transparent; color: hsl(335, 100%, 14%); } .yui-navset .yui-nav a em { background-color: hsl(335, 90%, 95%); box-shadow: 0px 1px 2px rgba(0,0,0,0.7); border-color: hsl(335, 90%, 85%); } .yui-navset .yui-nav .selected a, .yui-navset .yui-nav .selected a:focus, .yui-navset .yui-nav .selected a:hover { background-image: none; background-color: hsl(335, 55%, 55%); /* selected tab background */ color: hsl(335, 100%, 98%); } .yui-navset .yui-nav .selected a, .yui-navset .yui-nav .selected a em { border-color: hsl(335, 55%, 55%); box-shadow: 0px 1px 2px rgba(0,0,0,0.7); background-color: hsl(335, 55%, 55%); } .yui-navset .yui-content { background-color: hsl(335, 90%, 95%); /* content background color */ } /* -------------- MOBILE VIEW -------------- */ @media (max-width: 767px) { #side-bar { background-color: hsl(335, 65%, 65%); } #top-bar .open-menu a { border: 0.2em solid hsl(335, 100%, 85%); background-color: hsl(335, 100%, 98%); color: hsl(335, 100%, 85%); } }
page revision: 21, last edited: 27 Sep 2023 01:58