Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
  • Sign Up
Sign in to follow this  
demonickitten

[Solved] Posting Template Needed

Recommended Posts

Name: Nicole

 

Requesting: Posting Template

 

Size Requirements: Any size

 

Required Images: Any of Jensen Ackles

 

Colors & Mood: Something with a dark background

 

Text and font: In Red. Anything that's easy to read.
"Look into my eyes
It’s where my demons hide"

 

 Additional Info: Template  is gonna be used on Dark Paradise

 

Thank You in advance.

Edited by demonickitten

Share this post


Link to post
Share on other sites

@demonickitten Dunno if you still need or if you'll like this, but it was a little exercise for me.

 

Capture.PNG

 

<div class="ja-post"><div>
  Your text here</div>
  <h3 class="ja-post-footer">
    Look into my eyes It’s where my demons hide<img src="https://cdnw.nickpic.host/xCzV2f.png" height="100px" />
  </h3>
</div>

<style>div.ja-post {
  /* layout */
  width: 90%; /* I prefer to use percentages but adjust as needed */
  position: relative;
  padding-top: 1%;
  margin: 5px auto;
  /* colors */
  background: #1C1A1A;
  color: #ccc;
  border: 5px solid #161616;
  outline: 1px solid #0a0a0a;
  box-shadow: inset 0 0 3px #000;
  /* text */
  line-height: 145%;
}

div.ja-post > div {
  /* padding to give the text some breathing space */
  padding: 0 20px;
}

h3.ja-post-footer {
  /* layout */
  position: relative;
  /* you may need to adjust these values */
  left: 40%;
  width: 50%;
  padding: 1%;
  margin: 0 0 1.25% 0;
  /* colors */
  color: #fbabab;
  box-shadow: inset 0 0 10px rgba(66,3,3, .3), 0 0 5px rgba(0,0,0, .5);
  border: 1px solid rgba(0,0,0, .4);
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
  /* text */
  text-shadow: 0 0 5px #420303;
  font: 1em 'Playfair Display', serif;
  text-transform: uppercase;
  text-align: center;
  font-weight: 700;
}

h3.ja-post-footer > img {
  /* make image round */
  border-radius: 100%;
  /* positioning - you may need to edit this */
  position: absolute;
  bottom: -35px;
  right: -90px;
  z-index: 2;
  /* colors */
  border: 1px solid rgba(0,0,0, 1);
  box-shadow: 0 0 5px rgba(66,3,3, 1);
}
</style>

Feel free to make adjustments and let me know if it's completely off track from what you like. Someone else can give it a go in that case! 😄

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.



×

Important Information

By using this site, you agree to our Terms of Use, Guidelines and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.