image links in comment bar?

Feb 18, 2011 16:24

Journal Preview: usagiljtest
Style Name: S2 Minimalism; Aquatic Moon theme
Account Type: Paid

Problem/Question: I'm looking to replace the links in the comment bar with images. I have zero experience with the Minimalism layout so I have no idea where to even begin with this. I'm using a heavily modified version of this layout.

I'm comfortable with using theme layers, if that's what it takes.


/* LAYERS PT2
a Minimalism layout for Aquatic Moon
by sulfuricfusion@yearzeta
tiny icons from:
http://somerandomdude.com/projects/iconic/
http://www.famfamfam.com/lab/icons/silk/ */

/* GENERAL PROPERTIES */

body {
background:url("http://www.backgroundlabs.com/backgrounds/126.jpg") bottom center repeat #ede8d5 fixed;
padding:0px;
width:100%;
margin:0px;
}
#page{
margin:0px;
padding:0px;
font-family:arial, helvetica, "sans serif";
font-size:11px;
width:100%;
min-width:950px;
}
div.layout{
margin:0px;
margin-top:-2px;
padding:0px;
font-family:arial, helvetica, "sans serif";
}
div.content{
width:70%;
min-width:800px;
padding:20px 0px;
background:transparent;
margin:auto;
}
.entry-wrap{
background:#e1dcca;
padding-right:150px;
padding-left:150px;
margin:20px 0px 80px 0px;
border-top:solid 25px #d7295e;
border-bottom:solid 25px #d7295e;
-moz-border-radius:5px;
border-radius:5px;
}
.sidebar{
height:220px;
width:75%;
overflow:hidden;
padding:0px;
position:absolute;
top:43px;
right:0px;
background:#d6d1c0;
}
.sidebar-inner{
overflow:hidden;
font-family:arial, helvetica, "sans serif";
}
.sidebar-block{
float:left;
margin:0px 3%;
padding:10px 1%;
overflow:hidden;
width: 25%;
margin-right:-25px;
}
.entry{
padding:10px 10px 0px 10px;
background:#fff;
z-index:7;
position:relative;
}
.hentry{
margin:0px;
}
.hr{
display:none;
}
ul.page-nav{
display:inline-block;
width:100%;
text-align:right;
list-style:none;
margin:0px 0px 5px -60px;
}
li.prev a.item, li.next a.item{
font-size:18px;
color:#b2aea0;
text-transform:uppercase;
}

/* HEADER INFORMATION */
.header{
margin:0px 0px 40px 0px;
background:#e1dcca;
padding:30px 0px;
height:160px;
}
.header h2, .header h3{
display:block;
padding:0px;
margin:0px;
z-index:6;
text-align:center;
font-family:arial;
width:50%;
margin-left:0px;
}
.header h2{
font-weight:bold;
font-size:80px;
color:#fff;
display: none;
}
.header h3{
font-size:18px;
letter-spacing:3px;
color:#fff;
display: none;
}
ul.nav{
padding:0px;
list-style: none;
background:transparent;
color: #ffffff !important;
text-align:left;
margin:5px;
display:block;
position:absolute;
top:60px;
left:20px;
width: 45%;
}
ul.nav li a, ul.nav li a:link, ul.nav li a:visited{
display:block;
background:#d7295e;
margin:5px;
text-align:left;
color: #ffffff !important;
font-size: 16px;
width:45%;
border-left:solid 8px #d8ef3c;
-moz-border-radius:15px 0px 0px 15px;
border-radius:15px 0px 0px 15px;
padding: 5px;
}

ul.nav li a:hover, ul.nav li a:active {
display:block;
background:#d8ef3c;
text-transform: uppercase;
margin:5px;
text-align:left;
color: #ffffff !important;
border-left:solid 8px #d7295e;
-moz-border-radius:15px 0px 0px 15px;
border-radius:15px 0px 0px 15px;
padding: 5px;
}

.header .userpic, h1 span.ljuser, .header div.hr hr, .item-rss{
display:none ;
}

/* SIDEBAR */

.sidebar-block{
color:#ede8d5;
display:none;
}
.sidebar-cal, .sidebar-links, .sidebar-custom{
display:inline;
}
.sidebar-block dt{
display:none;
}
.sidebar dd{
padding:10px 1%;
}
.sidebar-powered{
text-transform:lowercase;
color:#999;
font-size:12px;
text-align:center;
}
.sidebar-powered a{
font-size:12px;
}
.sidebar-links dd, .sidebar-summary li{
display:list-item;
list-style:none;
text-align:left;
margin:0px;
}
.sidebar-summary ul, .sidebar-summary dd{
width:100%;
display:block;
margin:0px;
padding:0px;
}
.sidebar-summary a:link, .sidebar-summary a:visited, .sidebar-links a:link, .sidebar-links a:visited,

dd.tags a:link, dd.tags a:visited{
letter-spacing:-0.01em;
font-size:12px;
line-height:15px;
margin-top:-12px;
font-weight:normal;
color:#fff;
display:block;
background:#cbc6b6;
border-right:solid 8px #d8ef3c;
-moz-border-radius:0px 15px 15px 0px;
border-radius:0px 15px 15px 0px;
padding:3px;
}
.sidebar-summary a:hover, .sidebar-summary a:active, .sidebar-links a:hover, .sidebar-links a:active,

dd.tags a:hover, dd.tags a:active{
color:#999;
letter-spacing:0.01em;
font-style:italic;
border-right:solid 8px #d7295e;
text-indent:15px;
}
.emdash, sidebar-block .comma{
color:#777;
}
dd.tags{
text-align:center;
}
.sidebar-block .comma{
color:#ccc;
}
.sidebar-custom{
text-align:justify;
color: #555;
width: 35%;
}
.sidebar-cal caption{
text-align:right;
line-height:14px;
}
.sidebar-cal .calendar-wrap caption a{
font-size:18px;
font-weight:normal;
}

/* ENTRY AND FONTS */
dt.entry-title a.subj-link, .entry-title{

color:#ac214b !important;
font-family:arial;
font-size:25px !important;
letter-spacing:-2px !important;
background-color:transparent;
text-align:center;
text-decoration:none;
text-transform:uppercase;
line-height:17px;
font-weight:bold;
margin-top:-30px;
margin-bottom:10px;
}
.entry-title{
padding:0px;
}
dt.entry-title a{
padding:0px;
margin:0px;
}
dt.entry-title img{
margin-left:-34px;
float:left;
}
dt.entry-title a img{
margin:0px;
float:none;
}
.entry-text{
padding:7px 7px 0px 7px;
margin:0px;
text-align: justify;
min-height: 200px;
}
.entry-content{
color:#555;
line-height:20px;
font-size:12px;
}
dl.vcard{
width:150px;
margin:0px 10px 0px 10px;
display:inline;
float:left;
margin-left:-167px;
text-align:center;
position:relative;
z-index:10;
}
dl.vcard dt{
display:block;
}
dl.vcard dt img{
width:100px;
height:100px;
padding:13px;
background:#d8ef3c;
-moz-border-radius:3px;
border-radius:3px;
}
dd.username .ljuser a:link b, dd.username .ljuser a:visited b{
font-size:12px;
}
dd.entry-date, dd.username{
display:block;
padding:0px;
width:100%;
margin:0px;
text-align;center;
text-transform:lowercase;
}
abbr.updated{
letter-spacing:.03em;
font-weight:100;
color:#b2aea0;
text-decoration:none;
font-size:12px;
border-bottom:none !Important;
}
big{
font-size:150%;
letter-spacing:-1px;
}
small{
font-size:75%;
letter-spacing:0.04em;
}
blockquote{
-moz-border-radius:5px;
border-radius:5px;
background:#f5f3e9;
padding:10px;
margin:0px 25px -25px 25px;
}
textarea{
font-size:12px;
line-height:15px;
letter-spacing:1px;
background:rgba(0,0,0,.05);
border:solid 1px #d7295e;
color:#999;
}
input, select{
font-size:11px;
color:#747474;
text-transform:none;
letter-spacing:0px;
}
a:link, a:visited{
font-weight:bold;
color:#d7295e;
font-style:normal;
text-decoration:none;
letter-spacing:0.03em;
}
a:hover, a:active{
color:#d8ef3c;

}

/* METADATA */

div.metadata{
line-height:15px;
float:right;
width:125px;
margin-right:-102px;
}
.metadata img{
max-height:100px;
}
dt.meta-location-label, dt.meta-mood-label, dt.meta-music-label, dt.meta-groups-label{
display:none;
}
dd.meta-mood-value, dd.meta-location-value, dd.meta-music-value, dd.meta-groups-value{
font-size:11px;
width:100%;
letter-spacing:0.02em;
text-transform:lowercase;
color:#333;
margin-bottom:5px;
line-height:16px;
-moz-border-radius:0px 5px 5px 0px;
border-radius:0px 5px 5px 0px;
padding:2px 2px 2px 20px;
}
.meta-mood-value{
background:#d8ef3c url("http://resublimity.net/elljay/tinyicons/heart.png") no-repeat;
}
.meta-location-value{
background:#d8ef3c url("http://resublimity.net/elljay/tinyicons/world.png") no-repeat;
}
.meta-music-value{
background:#d8ef3c url("http://resublimity.net/elljay/tinyicons/music.png") no-repeat;
}
.meta-groups-value{
background:#d8ef3c url("http://resublimity.net/elljay/tinyicons/group.png") no-repeat;
}
dd.meta-location-value a{
font-size:11px;
color:#000;
text-transform:lowercase;
}
div.ljtags{
width:100%;
color:#fff;
font-size:15px;
font-weight:bold;
letter-spacing:-0.05em;
text-transform:uppercase;
padding:17px 17px;
background:#d8ef3c;
margin-left:-17px;
margin-top:15px;
clear:both;
}
div.ljtags a:link, div.ljtags a:visited{
font-size:12px;
color:#96a62a;
letter-spacing:0px;
text-decoration:none;
text-transform:lowercase;
font-weight:normal;
}
div.ljtags a:hover, div.ljtags a:active{
color:#111;
}

/* ENTRYMENU LINKS */
.entrymenu, .entrysubmenu{
margin:0px;
margin-bottom:-21px;
}
.entrysubmenu{
float:left;
width:500px;
margin-left:-150px;
text-align:left;
}
.entrymenu{
display:inline;
float:right;
margin-right:-150px;
text-align:right;
}
dd.entrymenu ul, dd.entrysubmenu ul{
padding:0px;
margin:0px;
list-style:none;
margin-left:0px;
}
dd.entrymenu ul li, dd.entrysubmenu ul li{
display:inline;
padding:0px 2px;
}
.entrymenu a:link, .entrymenu a:visited, .entrysubmenu a:link, .entrysubmenu a:visited{
font-size:17px;
font-weight:bold;
color:#ac214b;
text-transform:uppercase;
font-family:arial;
letter-spacing:-1px;
line-height:27px;
}
.entrymenu a:hover, .entrymenu a:active, .entrysubmenu a:hover, .entrysubmenu a:active{
color:#fff;
}

/* IMAGES */

.ljuser img[src*="userinfo.gif"], .ljuser img[src*="http://files.livejournal.com/userhead/"]{
background-image:url("http://resublimity.net/elljay/tinyicons/star.png") !important;
background:transparent no-repeat;
width:0px;
height:0px;
padding:9px !Important;
}
.ljuser img[src*="community.gif"]{
background-image:url("http://resublimity.net/elljay/tinyicons/rainbow.png") !important;
background:transparent no-repeat;
width:0px;
height:0px;
padding:8px !Important;
}
.ljuser img[src*="syndicated.gif"]{
background-image:url("http://resublimity.net/elljay/tinyicons/feed.png") !important;
background:transparent no-repeat;
width:0px;
height:0px;
padding:8px !Important;
}
.ljuser img[src*="newsinfo.gif"]{
background-image:url("http://resublimity.net/elljay/tinyicons/newspaper.png") !important;
background:transparent no-repeat;
width:0px;
height:0px;
padding:8px !Important;
}
.entry-title img[src*="icon_protected.gif"] {
background-image:url("http://resublimity.net/elljay/tinyicons/lock.png") !important;
background:transparent no-repeat;
width:0px;
height:0px;
padding:8px !Important;
}
.entry-title img[src*="icon_groups.gif"] {
background-image:url("http://resublimity.net/elljay/tinyicons/key.png") !important;
background:transparent no-repeat;
width:0px;
height:0px;
padding:8px !Important;
}
.entry-title img[src*="icon_private.gif"] {
background-image:url("http://resublimity.net/elljay/tinyicons/eye.png") !important;
background:transparent no-repeat;
width:0px;
height:0px;
padding:8px !Important;
}

/* FULL VIEW PAGE */
.entry-comments{
color:#888;
background:transparent;
padding:0px;
border:none;
}
.entry-comments .entry, .entry-comments .entry-text{
padding:0px;
}
.entry-comments .entry{
background:transparent;
}
#qrformdiv table{
border:none !important;
font-size:11px;
font-weight:100;
margin-bottom:20px;
}
div.comment-upic{

}
.comment-upic img{
padding:8px;
background:#aaa699;
margin:7px;
width:85px;
height:85px;
}
.entry-comments .ljuser a b{
font-size:12px;
}
div.comments-links{
padding:7px;
text-align:left;
text-transform:uppercase;
font-size:20px;
}
.replylink a{
font-size:20px;
text-transform:uppercase;
}
.comment-wrap{
font-size:11px;
letter-spacing:0.02em;
line-height:18px;
background:#d5d0bf;
text-transform:none;
min-height:130px;
margin:30px 0px;
padding:0px;
}
div.comment-text{
margin-top:-115px;
padding:9px;
background:#fff;
display:block;
margin-left:115px;
margin-right:115px;
min-height:180px;
}
.comment-wrap .hr{
display:inline;
clear:both;
}
.comment-wrap hr{
display:none;
}
div.comment-head-in{
float:right;
text-align:left;
color:#333;
width:105px;
padding:5px;
font-size:0.01%;
margin-top:-110px;
overflow:hidden;
}
.comment-head-in img{
width:16px;
height:16px;
}
.comment-head-in .ljuser img{
display:none;
}
.comment-head-in p{
display:block;
}
.comment-head-in h3{
color:#7f7d72;
text-transform:none;
font-weight:bold;
font-size:13px;
margin:0px;
}
.comment-permalink{
display:block;
margin:0px;
}
.comment-permalink:link, .comment-permalink:visited{
color:#7f7d72;
font-weight:normal;
font-size:11px !important;
text-transform:uppercase
}
.comment-permalink:hover, .comment-permalink:active{
color:#fff;
}
div.comment-menu{
text-align:right;
margin:-100px 0px 5px 0px;
color: transparent;
font-size:0.01%;
float:left;
width:115px;
}
.comment-menu a:link, comment-menu a:visited{
text-transform:uppercase;
font-size:13px;
margin:0px 0px -9px 5px;
-moz-border-radius:5px 0px 0px 5px;
border-radius:5px 0px 0px 5px;
background:#d8ef3c;
display:block;
text-align:center;
color:#fff;
}
.comment-menu a:hover, .comment-menu a:active{
color:#b6ca33;
}
textarea.textbox, input.textbox{
border:#ccc solid 1px;
letter-spacing:0px;
font-size:11px;
color:#888;
background:#fff;
}
.entry-linkbar{
display:block;
width:100%;
margin-top:-35px;
text-align:center;
position:relative;
top:-40px;
}

/* CALENDAR */
.view-archive .entry-text li{
display:inline;
margin:10px;
}
.view-archive .entry-text li a, li.active{
padding:4px;
font-size:16px;
background:#d5d0bf;
-moz-border-radius:5px;
border-radius:5px;
font-weight:normal;
border-left:solid 8px #cbc6b6;
}
li.active{
border-left:solid 8px #d8ef3c;
}
.view-archive .entry-text li a:hover{
padding:9px;
border-left:solid 8px #d7295e;
}
.view-archive .content{
width:80%;
margin:auto;
}
.view-archive .entry{
background:transparent;
}
.view-archive .entry-wrap{
width:100%;
background:transparent;
border:none;
padding:0px;
}
.entry-text .calendar-wrap caption a{
font-size:28px;
}
.calendar-wrap caption a{
font-size:22px;
text-transform:lowercase;
font-family:arial;
letter-spacing:-0.1em;
}
caption a.month{
color:#d7295e;
font-weight:normal;
}
caption a.year{
color:#d7295e;
}
.entry-text div.calendar-wrap caption a:hover, .entry-text div.calendar-wrap caption:active{
background:transparent;
padding:0px;
}
.calendar-wrap caption{
text-align:right;
line-height:14px
}
.calendar-wrap{
margin:0px 10px;
}
.entry-text .calendar-wrap{
width:40%;
float:left;
height:250px;
margin:40px 5%;
}
.entry-text .calendar-wrap table{
width:100%;
text-align:right;
border-spacing:8px;
}
.sidebar-cal .calendar-wrap table{
border-spacing:5px;
width:100%;
text-align:right;
}
.entry-text .calendar-wrap td{
font-size:12px;
line-height:22px;
width:40px;
padding:5px;
background:#e1dcca;
}
.calendar-wrap td{
text-align:center;
font-size:11px;
height:px;
VERTICAL-ALIGN:bottom;
padding:4px;
line-height:px;
color:#fff;
background:#d8ef3c;
-moz-border-radius:100%;
border-radius:100%;
}
.calendar-wrap thead{
display:none;
}
.calendar-wrap td a:link, .calendar-wrap td a:visited{
font-weight:normal;
text-align:center;
font-size:11px;
color:#6c771e;
}
.entry-text .calendar-wrap td a:link, .entry-text .calendar-wrap td a:visited{
font-size:18px;
font-weight:normal;
text-align:center;
height:auto;
color:#878479;
}
.entry-text .calendar-wrap td a:hover, .entry-text .calendar-wrap td a:active{
padding:0px;
color:#d8ef3c;
}

/* MISCELLANEOUS */
div.content-tags{
text-align:center;
}
div.content-tags .comma{
display:none;
}
a img{
border:none !important;
}
#lj_controlstrip{
background:url("") bottom left repeat-x #d7295e !important;
height:43px !important;
z-index:3;
}
#lj_controlstrip td{
border:none !important;
}
#lj_controlstrip_user{
display:none;
}
#lj_controlstrip_actionlinks{
width:250px;
}
#lj_controlstrip_userpic{
display:none;
}
#lj_controlstrip_search a{
display:none;
}
#lj_controlstrip_search table{
width:99% !important;
min-width:150px;
}
#lj_controlstrip span{
color:#fff;
padding:1px;
}
#lj_controlstrip a:link, #lj_controlstrip a:visited{
text-transform:lowercase;
color:#333 !important;
padding:1px;
}
#lj_controlstrip a:hover, #lj_controlstrip a:active{
color:#999 !important;
text-decoration:none;
}
#lj_controlstrip input{
background:#fff;
color:#999;
font-weight:bold;
border:none;
text-transform:lowercase;
}
input#lj_controlstrip_search_submit{
text-transform:uppercase;
font-weight:bold;
font-size:115%;
letter-spacing:-1px;
border:none;
color:#ccc;
}
#lj_controlstrip input:hover{
color:#333;
}
input#lj_controlstrip_search_input_text{
padding:2px;
letter-spacing:0.15em;
text-transform:none;
font-weight:normal;
}
input#lj_controlstrip_search_input_text:hover{
color:#333;
}
input#lj_controlstrip_search_submit{
padding:0px;
margin-left:5px;
}

/*------------------------------------
Look of contextual Popup
------------------------------*/

/*general positioning*/

div.ContextualPopup {
margin: 5px 0 0 20px;
font-family: trebuchet ms;
font-size: 10px;
}

/* attaches border to user icon*/

div.ContextualPopup img {
border: 2px solid #d7295e;
}

/*defines general look, font color/size/background color*/

div.ContextualPopup div.Inner {
background-color: #000000 !important;
background: url(http://www.backgroundlabs.com/backgrounds/126.jpg);
color: #666666 !important;
border: 10px solid #d8ef3c;
padding: 0px;
width: 20em;
-moz-border-radius:3px;
border-radius:3px;
}

/*defines left side of popup without the user icon*/

div.ContextualPopup .Content {
2px 4px 6px 4px;
margin-right: 50px;
line-height: 1.4;
}

/*defines the text that shows the relation to the user (XYZ is your mutual friend) */

div.ContextualPopup .Relation {
font-weight: bold !important;
}

/* look of words LJ Talk */

div.ContextualPopup .Content .OnlineStatus {
font-weight: bold;
}

div.ContextualPopup .Userpic {
padding: 4px 4px 0 0;
border: 2px;
}

div.ContextualPopup div.Inner a:link, div.ContextualPopup div.Inner a:visited {
text-decoration: none !important;
font-weight: bold;
color: #d7295e !important;
}

div.ContextualPopup div.Inner a:hover {
text-decoration: none !important;
font-weight: bold;
color: #d8ef3c !important;
}

resolved, questions

Previous post Next post
Up