Onderwerp: CODE IT LIKE IT'S HOT zo jun 07, 2015 11:47 pm
Dus, uiteindelijk staat het er. Het grote
"Max, ik wil een code, kun jij 'm maken?"-topic
Het antwoord is: ja, ik kan 't wel voor je maken c: Daar heb ik wel informatie voor nodig, en dat moet jij even voor me invullen, via het lijstje hier, dat je onderaan kan terugvinden in de spoiler.
Er zijn wel een paar dingen die ik er bij moet zeggen:
Ik verwerk 2 aanvragen per keer
Ik kan best wel goed coderen, maar ik kan ook niet toveren
De codes die ik schrijf, zijn alleen voor op PoF (Dit omdat ik ze hier test, en dus niet zeker kan zeggen of ze op andere fora ook goed zullen werken zonder problemen te veroorzaken met de codes van het forum in kwestie)
Afbeeldingen worden vervangen door placeholder images, dus die moet je zelf voorzien
Hoe meer je visualiseert wat je wilt (een eenvoudige paint schets mag ook), hoe beter ik kan maken wat jij in gedachten had
De fonts uit de sheets komen van Google Fonts (link)
Dus, dit gezegd zijnde, voor voorbeelden kan je naar al mijn posts kijken, aangezien ik bijna al mijn postsheets/character sheets/gsm-codes zelf heb geschreven c:
Slot 1: Slot 2:
Lijstje:
Code:
[b]Scrollsheet of hoogte afhankelijk van lengte post:[/b] [b]Breedte (+ evt hoogte):[/b] [b]Plaats afbeelding (links, rechts, header):[/b] [b]Grootte afbeelding:[/b] [b]Kleur / dikte randje:[/b] [b]Achtergrondkleur:[/b] [b]Tekst kleur / font:[/b] [b]Quote kleur / font:[/b] [b]Plaats van de quote (hover over img, bovenaan, onderaan):[/b] [b]Screenshot / schets resultaat:[/b]
Laatst aangepast door Kyrylo Wasylyk op di sep 08, 2015 2:31 am; in totaal 4 keer bewerkt
Onderwerp: Re: CODE IT LIKE IT'S HOT di jun 23, 2015 5:21 pm
Scrollsheet of hoogte afhankelijk van lengte post: Scrollsheet c: Breedte (+ evt hoogte): Zoals die van Beartje c: Plaats afbeelding (links, rechts, header): Links^^ Grootte afbeelding: Zoiets als die van Bear c: Kleur / dikte randje: #999900 dat kleurtje, trandje moet maar dun zijn tho iets standaard yk Achtergrondkleur: Dat mag een beetje donker zijn, grijs of zo Tekst kleur / font: Playfair en nja iets wit of zo Quote kleur / font: Shadows Into Light Plaats van de quote (hover over img, bovenaan, onderaan): Quote mag like onderaan over de image of zo c: Screenshot / schets resultaat:
Kyrylo Wasylyk
Class 3
Aantal berichten : 179
Onderwerp: Re: CODE IT LIKE IT'S HOT do jun 25, 2015 1:52 am
Dean's sheetje is klaar c: De code vind je onderaan terug De image voor de sidebar vind je in de class .deansidebar, waar je de url('...') kan veranderen naar de url van de image die je zelf hebt geuploaded. De image is 230 pixels breed en 335 pixels hoog.
Quote here, a longer quote will result in multiple lines
Onderwerp: Re: CODE IT LIKE IT'S HOT zo jun 28, 2015 11:01 pm
Scrollsheet of hoogte afhankelijk van lengte post: Hoogte? Breedte (+ evt hoogte): Zoiets die van Finn en Kai Plaats afbeelding (links, rechts, header): Grootte afbeelding: Zoals die van Kai en Finn maar wat minder hoog als het kan? Kleur / dikte randje: #2a000e en een dun randje Achtergrondkleur: Wit Tekst kleur / font: Lora en zwart Quote kleur / font: Lobster en dezelfde kleur als het randje Plaats van de quote (hover over img, bovenaan, onderaan): bovenaan Screenshot / schets resultaat:
Als het niet duidelijk is zeg het je het oke?
Kyrylo Wasylyk
Class 3
Aantal berichten : 179
Onderwerp: Re: CODE IT LIKE IT'S HOT ma jun 29, 2015 7:07 pm
Cecilia's sheetje is klaar n.n De code staat onderaan De image voor de header vind je in de class .ceciliaheader, waar je de url('...') kan veranderen naar de url van de image die je zelf hebt geuploaded. De image is 480 pixels breed en 200 pixels hoog. Zoals je kan zien is de lengte van de sheet afhankelijk van de lengte van je tekst. Vervang dus de Lorem Ipsum tekst door jouw post en je bent ready to go c:
"Quote here, a longer quote will result in multiple lines"
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris nec aliquam dolor, eget cursus dolor. Phasellus vehicula magna mauris. Donec nisi erat, condimentum vitae sem vitae, cursus fringilla est. Ut a nisi dictum, tincidunt augue faucibus, eleifend diam. Aenean dapibus porttitor sem sed varius. Vivamus libero arcu, tempor et pharetra eget, ultricies tempor ligula. Donec in leo efficitur, dictum tellus a, maximus ligula. Aliquam suscipit pellentesque augue, a semper mi vehicula sit amet. Aenean eget elit quis lorem pulvinar lacinia maximus quis diam. Cras egestas ac risus et ornare. Morbi feugiat justo ut arcu eleifend, nec imperdiet eros sollicitudin. Donec quis ligula leo. Phasellus eget purus consequat, lobortis lacus eu, venenatis felis. Integer in tincidunt augue, vel tincidunt eros. Nunc varius dui id turpis gravida, et sodales lorem tincidunt. Nunc ante risus, feugiat a tempus vitae, efficitur fermentum dui.
Quisque quis augue at risus mattis dignissim imperdiet id mi. Duis sagittis tristique cursus. Donec porta dolor at est sagittis gravida. In porta suscipit suscipit. Proin metus nunc, condimentum sit amet ligula sed, condimentum suscipit mi. Nunc auctor, ipsum nec sodales egestas, ligula urna ornare lacus, fringilla tempor arcu augue ut orci. Fusce consequat convallis nisl sed facilisis. Integer vitae dictum arcu, eget pellentesque urna. Proin tincidunt ex vitae aliquam ullamcorper. Integer vehicula, arcu id pulvinar rhoncus, erat dui pellentesque purus, sit amet hendrerit nisi justo et lectus. Aenean dictum lacus a bibendum viverra. Nunc commodo a massa a efficitur. Integer in leo et purus vulputate pellentesque ac sit amet tellus. Cras imperdiet vehicula dignissim. Etiam ornare quam diam, rhoncus faucibus quam elementum et.
Code:
<style type="text/css">@import url(http://fonts.googleapis.com/css?family=Lora|Lobster); .ceciliacontainer {margin: auto; width: 480px; height: auto; background-color: #ffffff; border: 1px solid #2a000e;} .ceciliaheader {width: 480px; height: 200px; background-image: url('http://i60.tinypic.com/2nksxld.jpg'); position: relative; top: 0px; left: 0px;} .ceciliapost {margin: auto; width: 420px; height: auto; text-align: justify; font-family: 'Lora', serif; font-size: 13px; color: #000000;} #ceciliaquote {display: block; font-family: 'Lobster', cursive; font-size: 20px; text-align: center; color: #2a000e;} .ceciliacontainer hr {border: 0; height: 1px; background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));} </style> <div class="ceciliacontainer"><div class="ceciliaheader"></div> <hr /> <span id="ceciliaquote">"Quote here, a longer quote will result in multiple lines"</span> <hr /> <div class="ceciliapost"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris nec aliquam dolor, eget cursus dolor. Phasellus vehicula magna mauris. Donec nisi erat, condimentum vitae sem vitae, cursus fringilla est. Ut a nisi dictum, tincidunt augue faucibus, eleifend diam. Aenean dapibus porttitor sem sed varius. Vivamus libero arcu, tempor et pharetra eget, ultricies tempor ligula. Donec in leo efficitur, dictum tellus a, maximus ligula. Aliquam suscipit pellentesque augue, a semper mi vehicula sit amet. Aenean eget elit quis lorem pulvinar lacinia maximus quis diam. Cras egestas ac risus et ornare. Morbi feugiat justo ut arcu eleifend, nec imperdiet eros sollicitudin. Donec quis ligula leo. Phasellus eget purus consequat, lobortis lacus eu, venenatis felis. Integer in tincidunt augue, vel tincidunt eros. Nunc varius dui id turpis gravida, et sodales lorem tincidunt. Nunc ante risus, feugiat a tempus vitae, efficitur fermentum dui.
Quisque quis augue at risus mattis dignissim imperdiet id mi. Duis sagittis tristique cursus. Donec porta dolor at est sagittis gravida. In porta suscipit suscipit. Proin metus nunc, condimentum sit amet ligula sed, condimentum suscipit mi. Nunc auctor, ipsum nec sodales egestas, ligula urna ornare lacus, fringilla tempor arcu augue ut orci. Fusce consequat convallis nisl sed facilisis. Integer vitae dictum arcu, eget pellentesque urna. Proin tincidunt ex vitae aliquam ullamcorper. Integer vehicula, arcu id pulvinar rhoncus, erat dui pellentesque purus, sit amet hendrerit nisi justo et lectus. Aenean dictum lacus a bibendum viverra. Nunc commodo a massa a efficitur. Integer in leo et purus vulputate pellentesque ac sit amet tellus. Cras imperdiet vehicula dignissim. Etiam ornare quam diam, rhoncus faucibus quam elementum et.
Onderwerp: Re: CODE IT LIKE IT'S HOT ma jul 13, 2015 8:54 pm
Scrollsheet of hoogte afhankelijk van lengte post: Hoogte Breedte (+ evt hoogte): 460 Plaats afbeelding (links, rechts, header): Bovenin in het midden Grootte afbeelding: 420 x 200 Kleur / dikte randje: 2 pixels, of iets groter als het niet goed te zien is (#4e0000) Achtergrondkleur: Zwart Tekst kleur / font: Droid Sans (#800000 of #cdcdcd wat mooier is) Quote kleur / font: Courgette (#4e0000) Plaats van de quote (hover over img, bovenaan, onderaan): Onder de afbeelding Screenshot / schets resultaat: /
Hoop dat ik het zo een beetje goed heb ingevuld?
Nikita Alves
Deceased
Aantal berichten : 135
Onderwerp: Re: CODE IT LIKE IT'S HOT di jul 28, 2015 10:13 pm
Scrollsheet of hoogte afhankelijk van lengte post: Scrollsheet Breedte (+ evt hoogte): zoiets wat Dean heeft Plaats afbeelding (links, rechts, header): rechts Grootte afbeelding: zoals Dean :) Kleur / dikte randje: dun randje, en een kleur tussen blauwachtig en grijs Achtergrondkleur: kies maar wat jij mooi vind Tekst kleur / font: het liefst zwart, maar als de achtergrond kleur donkerder donkerder word dan wit Quote kleur / font: zelfde kleur als randje & Shadows into light Plaats van de quote (hover over img, bovenaan, onderaan): onderaan evt. in het plaatje zoals Dean's Screenshot / schets resultaat: //
ik weet niet hoe je die kleuren moet veranderen met #cijfers of #letters, maar ik denk wel dat er wat mee kunt (hoop ik). & ik weet niet of ik mocht, maar ik dacht van wel omdat je 2 slotjes hebt
Kyrylo Wasylyk
Class 3
Aantal berichten : 179
Onderwerp: Re: CODE IT LIKE IT'S HOT vr jul 31, 2015 12:30 am
Salina's sheetje is klaar! De code staat onderaan De image voor de header vind je in de class .saliheader, waar je de url('...') kan veranderen naar de url van de image die je zelf hebt geuploaded. De image is 420 pixels breed en 200 pixels hoog. Zoals je kan zien is de lengte van de sheet afhankelijk van de lengte van je tekst. Vervang dus de Lorem Ipsum tekst door jouw post en je bent ready to go c:
"Quote here, a longer quote will result in multiple lines"
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris nec aliquam dolor, eget cursus dolor. Phasellus vehicula magna mauris. Donec nisi erat, condimentum vitae sem vitae, cursus fringilla est. Ut a nisi dictum, tincidunt augue faucibus, eleifend diam. Aenean dapibus porttitor sem sed varius. Vivamus libero arcu, tempor et pharetra eget, ultricies tempor ligula. Donec in leo efficitur, dictum tellus a, maximus ligula. Aliquam suscipit pellentesque augue, a semper mi vehicula sit amet. Aenean eget elit quis lorem pulvinar lacinia maximus quis diam. Cras egestas ac risus et ornare. Morbi feugiat justo ut arcu eleifend, nec imperdiet eros sollicitudin. Donec quis ligula leo. Phasellus eget purus consequat, lobortis lacus eu, venenatis felis. Integer in tincidunt augue, vel tincidunt eros. Nunc varius dui id turpis gravida, et sodales lorem tincidunt. Nunc ante risus, feugiat a tempus vitae, efficitur fermentum dui.
Quisque quis augue at risus mattis dignissim imperdiet id mi. Duis sagittis tristique cursus. Donec porta dolor at est sagittis gravida. In porta suscipit suscipit. Proin metus nunc, condimentum sit amet ligula sed, condimentum suscipit mi. Nunc auctor, ipsum nec sodales egestas, ligula urna ornare lacus, fringilla tempor arcu augue ut orci. Fusce consequat convallis nisl sed facilisis. Integer vitae dictum arcu, eget pellentesque urna. Proin tincidunt ex vitae aliquam ullamcorper. Integer vehicula, arcu id pulvinar rhoncus, erat dui pellentesque purus, sit amet hendrerit nisi justo et lectus. Aenean dictum lacus a bibendum viverra. Nunc commodo a massa a efficitur. Integer in leo et purus vulputate pellentesque ac sit amet tellus. Cras imperdiet vehicula dignissim. Etiam ornare quam diam, rhoncus faucibus quam elementum et.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris nec aliquam dolor, eget cursus dolor. Phasellus vehicula magna mauris. Donec nisi erat, condimentum vitae sem vitae, cursus fringilla est. Ut a nisi dictum, tincidunt augue faucibus, eleifend diam. Aenean dapibus porttitor sem sed varius. Vivamus libero arcu, tempor et pharetra eget, ultricies tempor ligula. Donec in leo efficitur, dictum tellus a, maximus ligula. Aliquam suscipit pellentesque augue, a semper mi vehicula sit amet. Aenean eget elit quis lorem pulvinar lacinia maximus quis diam. Cras egestas ac risus et ornare. Morbi feugiat justo ut arcu eleifend, nec imperdiet eros sollicitudin. Donec quis ligula leo. Phasellus eget purus consequat, lobortis lacus eu, venenatis felis. Integer in tincidunt augue, vel tincidunt eros. Nunc varius dui id turpis gravida, et sodales lorem tincidunt. Nunc ante risus, feugiat a tempus vitae, efficitur fermentum dui.
Quisque quis augue at risus mattis dignissim imperdiet id mi. Duis sagittis tristique cursus. Donec porta dolor at est sagittis gravida. In porta suscipit suscipit. Proin metus nunc, condimentum sit amet ligula sed, condimentum suscipit mi. Nunc auctor, ipsum nec sodales egestas, ligula urna ornare lacus, fringilla tempor arcu augue ut orci. Fusce consequat convallis nisl sed facilisis. Integer vitae dictum arcu, eget pellentesque urna. Proin tincidunt ex vitae aliquam ullamcorper. Integer vehicula, arcu id pulvinar rhoncus, erat dui pellentesque purus, sit amet hendrerit nisi justo et lectus. Aenean dictum lacus a bibendum viverra. Nunc commodo a massa a efficitur. Integer in leo et purus vulputate pellentesque ac sit amet tellus. Cras imperdiet vehicula dignissim. Etiam ornare quam diam, rhoncus faucibus quam elementum et.
Onderwerp: Re: CODE IT LIKE IT'S HOT zo sep 06, 2015 2:58 pm
Scrollsheet of hoogte afhankelijk van lengte post: Scrollertje c: Breedte (+ evt hoogte): Zoals die van Shay c: Plaats afbeelding (links, rechts, header): Links Grootte afbeelding: 230 x 335 of naja hangt er vanaf wat het beste past Kleur / dikte randje: Dat mag minder dik zijn, misschien 1 a 2 pixels? & #191970 Achtergrondkleur: Naja, jij hebt er een goed oog voor tbh dus laat ik dat aan jou over. Tekst kleur / font: Wit of zwart depends voor de achtergrond kleur & Source Sans Pro Quote kleur / font: #191970 & Pacifico Plaats van de quote (hover over img, bovenaan, onderaan): Bovenaan c: Screenshot / schets resultaat: /
Kyrylo Wasylyk
Class 3
Aantal berichten : 179
Onderwerp: Re: CODE IT LIKE IT'S HOT di sep 08, 2015 2:21 am
Nikita's sheetje is klaar! De code staat onderaan De image voor de header vind je in de class .nikitasidebar, waar je de url('...') kan veranderen naar de url van de image die je zelf hebt geuploaded. De image is 230 pixels breed en 335 pixels hoog. Het is een scrollsheetje, die automatisch scrollt als je post lang genoeg is. Vervang dus de Lorem Ipsum tekst door jouw post en je bent ready to go c:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris nec aliquam dolor, eget cursus dolor. Phasellus vehicula magna mauris. Donec nisi erat, condimentum vitae sem vitae, cursus fringilla est. Ut a nisi dictum, tincidunt augue faucibus, eleifend diam. Aenean dapibus porttitor sem sed varius. Vivamus libero arcu, tempor et pharetra eget, ultricies tempor ligula. Donec in leo efficitur, dictum tellus a, maximus ligula. Aliquam suscipit pellentesque augue, a semper mi vehicula sit amet. Aenean eget elit quis lorem pulvinar lacinia maximus quis diam. Cras egestas ac risus et ornare. Morbi feugiat justo ut arcu eleifend, nec imperdiet eros sollicitudin. Donec quis ligula leo. Phasellus eget purus consequat, lobortis lacus eu, venenatis felis. Integer in tincidunt augue, vel tincidunt eros. Nunc varius dui id turpis gravida, et sodales lorem tincidunt. Nunc ante risus, feugiat a tempus vitae, efficitur fermentum dui.
Quisque quis augue at risus mattis dignissim imperdiet id mi. Duis sagittis tristique cursus. Donec porta dolor at est sagittis gravida. In porta suscipit suscipit. Proin metus nunc, condimentum sit amet ligula sed, condimentum suscipit mi. Nunc auctor, ipsum nec sodales egestas, ligula urna ornare lacus, fringilla tempor arcu augue ut orci. Fusce consequat convallis nisl sed facilisis. Integer vitae dictum arcu, eget pellentesque urna. Proin tincidunt ex vitae aliquam ullamcorper. Integer vehicula, arcu id pulvinar rhoncus, erat dui pellentesque purus, sit amet hendrerit nisi justo et lectus. Aenean dictum lacus a bibendum viverra. Nunc commodo a massa a efficitur. Integer in leo et purus vulputate pellentesque ac sit amet tellus. Cras imperdiet vehicula dignissim. Etiam ornare quam diam, rhoncus faucibus quam elementum et.
Quote here, a longer quote will result in multiple lines
Code:
<style type="text/css">@import url(http://fonts.googleapis.com/css?family=Playfair+Display|Shadows+Into+Light); .nikitabox {margin: auto; width: 530px; height: 335px; background-color: #ebebeb; border: 2px solid #00547F;} .nikitasidebar {width: 230px; height: 335px; background-image: url('http://placehold.it/230x335'); float: left;} #nikitaquote {font-family: 'Shadows Into Light', cursive; text-align: center; font-size: 16px; color: #00547F; width: 226px; padding: 3px; display: block; position: relative; top: 245px; left: 0px;} .nikitapost {width: 250px; height: 300px; padding: 5px; font-family: 'Playfair Display', serif; sans-serif; font-size: 13px; color: #000000; overflow-y: scroll; overflow-x: hidden; text-align: justify; line-height: 110%; float: left; margin-left: 20px; margin-right: 20px; margin-top: 10px;}</style> <div class="nikitabox"><div class="nikitapost"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris nec aliquam dolor, eget cursus dolor. Phasellus vehicula magna mauris. Donec nisi erat, condimentum vitae sem vitae, cursus fringilla est. Ut a nisi dictum, tincidunt augue faucibus, eleifend diam. Aenean dapibus porttitor sem sed varius. Vivamus libero arcu, tempor et pharetra eget, ultricies tempor ligula. Donec in leo efficitur, dictum tellus a, maximus ligula. Aliquam suscipit pellentesque augue, a semper mi vehicula sit amet. Aenean eget elit quis lorem pulvinar lacinia maximus quis diam. Cras egestas ac risus et ornare. Morbi feugiat justo ut arcu eleifend, nec imperdiet eros sollicitudin. Donec quis ligula leo. Phasellus eget purus consequat, lobortis lacus eu, venenatis felis. Integer in tincidunt augue, vel tincidunt eros. Nunc varius dui id turpis gravida, et sodales lorem tincidunt. Nunc ante risus, feugiat a tempus vitae, efficitur fermentum dui.
Quisque quis augue at risus mattis dignissim imperdiet id mi. Duis sagittis tristique cursus. Donec porta dolor at est sagittis gravida. In porta suscipit suscipit. Proin metus nunc, condimentum sit amet ligula sed, condimentum suscipit mi. Nunc auctor, ipsum nec sodales egestas, ligula urna ornare lacus, fringilla tempor arcu augue ut orci. Fusce consequat convallis nisl sed facilisis. Integer vitae dictum arcu, eget pellentesque urna. Proin tincidunt ex vitae aliquam ullamcorper. Integer vehicula, arcu id pulvinar rhoncus, erat dui pellentesque purus, sit amet hendrerit nisi justo et lectus. Aenean dictum lacus a bibendum viverra. Nunc commodo a massa a efficitur. Integer in leo et purus vulputate pellentesque ac sit amet tellus. Cras imperdiet vehicula dignissim. Etiam ornare quam diam, rhoncus faucibus quam elementum et. </div><div class="nikitasidebar"><div id="nikitaquote">Quote here, a longer quote will result in multiple lines</div></div></div>
Kyrylo Wasylyk
Class 3
Aantal berichten : 179
Onderwerp: Re: CODE IT LIKE IT'S HOT di sep 08, 2015 2:31 am
Sorry voor de dubbel post, maar Cas' setje is ook klaar c: De code staat onderaan De image voor de header vind je in de class .cassidebar, waar je de url('...') kan veranderen naar de url van de image die je zelf hebt geuploaded. De image is 230 pixels breed en 335 pixels hoog. Het is een scrollsheetje, die automatisch scrollt als je post lang genoeg is. Vervang dus de Lorem Ipsum tekst door jouw post en je bent ready to go c:
"Quote here, a longer quote will result in multiple lines"
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris nec aliquam dolor, eget cursus dolor. Phasellus vehicula magna mauris. Donec nisi erat, condimentum vitae sem vitae, cursus fringilla est. Ut a nisi dictum, tincidunt augue faucibus, eleifend diam. Aenean dapibus porttitor sem sed varius. Vivamus libero arcu, tempor et pharetra eget, ultricies tempor ligula. Donec in leo efficitur, dictum tellus a, maximus ligula. Aliquam suscipit pellentesque augue, a semper mi vehicula sit amet. Aenean eget elit quis lorem pulvinar lacinia maximus quis diam. Cras egestas ac risus et ornare. Morbi feugiat justo ut arcu eleifend, nec imperdiet eros sollicitudin. Donec quis ligula leo. Phasellus eget purus consequat, lobortis lacus eu, venenatis felis. Integer in tincidunt augue, vel tincidunt eros. Nunc varius dui id turpis gravida, et sodales lorem tincidunt. Nunc ante risus, feugiat a tempus vitae, efficitur fermentum dui.
Quisque quis augue at risus mattis dignissim imperdiet id mi. Duis sagittis tristique cursus. Donec porta dolor at est sagittis gravida. In porta suscipit suscipit. Proin metus nunc, condimentum sit amet ligula sed, condimentum suscipit mi. Nunc auctor, ipsum nec sodales egestas, ligula urna ornare lacus, fringilla tempor arcu augue ut orci. Fusce consequat convallis nisl sed facilisis. Integer vitae dictum arcu, eget pellentesque urna. Proin tincidunt ex vitae aliquam ullamcorper. Integer vehicula, arcu id pulvinar rhoncus, erat dui pellentesque purus, sit amet hendrerit nisi justo et lectus. Aenean dictum lacus a bibendum viverra. Nunc commodo a massa a efficitur. Integer in leo et purus vulputate pellentesque ac sit amet tellus. Cras imperdiet vehicula dignissim. Etiam ornare quam diam, rhoncus faucibus quam elementum et.
Code:
<style type="text/css">@import url(https://fonts.googleapis.com/css?family=Pacifico|Source+Sans+Pro); .cascontainer {margin: auto; width: 550px; height: 360px; background-color: #ebebeb; border: 2px solid #191970;} .cassidebar {width: 220px; height: 360px; background-image: url('http://placehold.it/230x335'); float: left;} .caspost {width: 290px; height: 320px; text-align: justify; font-family: 'Source Sans Pro', sans-serif; font-size: 13px; color: #111111; background-color: #ebebeb; padding: 20px; float: left; overflow: scroll;} #casquote {display: block; font-family: 'Pacifico', cursive; font-size: 16px; text-align: center; color: #191970;}</style> <div class="cascontainer"><div class="cassidebar"></div><div class="caspost"><div id="casquote">"Quote here, a longer quote will result in multiple lines"</div> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris nec aliquam dolor, eget cursus dolor. Phasellus vehicula magna mauris. Donec nisi erat, condimentum vitae sem vitae, cursus fringilla est. Ut a nisi dictum, tincidunt augue faucibus, eleifend diam. Aenean dapibus porttitor sem sed varius. Vivamus libero arcu, tempor et pharetra eget, ultricies tempor ligula. Donec in leo efficitur, dictum tellus a, maximus ligula. Aliquam suscipit pellentesque augue, a semper mi vehicula sit amet. Aenean eget elit quis lorem pulvinar lacinia maximus quis diam. Cras egestas ac risus et ornare. Morbi feugiat justo ut arcu eleifend, nec imperdiet eros sollicitudin. Donec quis ligula leo. Phasellus eget purus consequat, lobortis lacus eu, venenatis felis. Integer in tincidunt augue, vel tincidunt eros. Nunc varius dui id turpis gravida, et sodales lorem tincidunt. Nunc ante risus, feugiat a tempus vitae, efficitur fermentum dui.
Quisque quis augue at risus mattis dignissim imperdiet id mi. Duis sagittis tristique cursus. Donec porta dolor at est sagittis gravida. In porta suscipit suscipit. Proin metus nunc, condimentum sit amet ligula sed, condimentum suscipit mi. Nunc auctor, ipsum nec sodales egestas, ligula urna ornare lacus, fringilla tempor arcu augue ut orci. Fusce consequat convallis nisl sed facilisis. Integer vitae dictum arcu, eget pellentesque urna. Proin tincidunt ex vitae aliquam ullamcorper. Integer vehicula, arcu id pulvinar rhoncus, erat dui pellentesque purus, sit amet hendrerit nisi justo et lectus. Aenean dictum lacus a bibendum viverra. Nunc commodo a massa a efficitur. Integer in leo et purus vulputate pellentesque ac sit amet tellus. Cras imperdiet vehicula dignissim. Etiam ornare quam diam, rhoncus faucibus quam elementum et.
Onderwerp: Re: CODE IT LIKE IT'S HOT do jan 07, 2016 9:05 pm
Scrollsheet of hoogte afhankelijk van lengte post: Scrollsheet Breedte (+ evt hoogte): maximum 450 breed, hoogte maakt niet uit Plaats afbeelding (links, rechts, header): Links Grootte afbeelding: 220 x 250-ish Kleur / dikte randje: Alleen een randje rechts, 4px en eender welke kleur Achtergrondkleur: Iets licht? Tekst kleur / font: Zwart & maakt niet uit Quote kleur / font: De achtergrond van de quote hetzelfde als het randje, en dan de kleur goed leesbaar? En wees vrij in het font Plaats van de quote (hover over img, bovenaan, onderaan): Kan het als een soort 'header' bovenin? Screenshot / schets resultaat: /
Wil je misschien voor Marcus dezelfde sheet maken maar in een andere kleur? :)
Kyrylo Wasylyk
Class 3
Aantal berichten : 179
Onderwerp: Re: CODE IT LIKE IT'S HOT za jan 09, 2016 10:54 am
De sheetjes voor Jacob & Marcus zijn klaar! De code staat onderaan de sheets. De image voor de sidebar vind je in onder de quote lijntjes, waar je de img src="..." kan veranderen naar de url van de image die je zelf hebt geuploaded. De image is 200 pixels breed en 300 pixels hoog. Het is een scrollsheetje, die automatisch scrollt als je post lang genoeg is. Vervang dus de tekst door jouw post en je bent ready to go c:
Voor Jacob:
Quote deel 1 Quote deel 2 QUOTE DEEL 3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris nec aliquam dolor, eget cursus dolor. Phasellus vehicula magna mauris. Donec nisi erat, condimentum vitae sem vitae, cursus fringilla est. Ut a nisi dictum, tincidunt augue faucibus, eleifend diam. Aenean dapibus porttitor sem sed varius. Vivamus libero arcu, tempor et pharetra eget, ultricies tempor ligula. Donec in leo efficitur, dictum tellus a, maximus ligula. Aliquam suscipit pellentesque augue, a semper mi vehicula sit amet. Aenean eget elit quis lorem pulvinar lacinia maximus quis diam. Cras egestas ac risus et ornare. Morbi feugiat justo ut arcu eleifend, nec imperdiet eros sollicitudin. Donec quis ligula leo. Phasellus eget purus consequat, lobortis lacus eu, venenatis felis. Integer in tincidunt augue, vel tincidunt eros. Nunc varius dui id turpis gravida, et sodales lorem tincidunt. Nunc ante risus, feugiat a tempus vitae, efficitur fermentum dui.
Quisque quis augue at risus mattis dignissim imperdiet id mi. Duis sagittis tristique cursus. Donec porta dolor at est sagittis gravida. In porta suscipit suscipit. Proin metus nunc, condimentum sit amet ligula sed, condimentum suscipit mi. Nunc auctor, ipsum nec sodales egestas, ligula urna ornare lacus, fringilla tempor arcu augue ut orci. Fusce consequat convallis nisl sed facilisis. Integer vitae dictum arcu, eget pellentesque urna. Proin tincidunt ex vitae aliquam ullamcorper. Integer vehicula, arcu id pulvinar rhoncus, erat dui pellentesque purus, sit amet hendrerit nisi justo et lectus. Aenean dictum lacus a bibendum viverra. Nunc commodo a massa a efficitur. Integer in leo et purus vulputate pellentesque ac sit amet tellus. Cras imperdiet vehicula dignissim. Etiam ornare quam diam, rhoncus faucibus quam elementum et.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris nec aliquam dolor, eget cursus dolor. Phasellus vehicula magna mauris. Donec nisi erat, condimentum vitae sem vitae, cursus fringilla est. Ut a nisi dictum, tincidunt augue faucibus, eleifend diam. Aenean dapibus porttitor sem sed varius. Vivamus libero arcu, tempor et pharetra eget, ultricies tempor ligula. Donec in leo efficitur, dictum tellus a, maximus ligula. Aliquam suscipit pellentesque augue, a semper mi vehicula sit amet. Aenean eget elit quis lorem pulvinar lacinia maximus quis diam. Cras egestas ac risus et ornare. Morbi feugiat justo ut arcu eleifend, nec imperdiet eros sollicitudin. Donec quis ligula leo. Phasellus eget purus consequat, lobortis lacus eu, venenatis felis. Integer in tincidunt augue, vel tincidunt eros. Nunc varius dui id turpis gravida, et sodales lorem tincidunt. Nunc ante risus, feugiat a tempus vitae, efficitur fermentum dui.
Quisque quis augue at risus mattis dignissim imperdiet id mi. Duis sagittis tristique cursus. Donec porta dolor at est sagittis gravida. In porta suscipit suscipit. Proin metus nunc, condimentum sit amet ligula sed, condimentum suscipit mi. Nunc auctor, ipsum nec sodales egestas, ligula urna ornare lacus, fringilla tempor arcu augue ut orci. Fusce consequat convallis nisl sed facilisis. Integer vitae dictum arcu, eget pellentesque urna. Proin tincidunt ex vitae aliquam ullamcorper. Integer vehicula, arcu id pulvinar rhoncus, erat dui pellentesque purus, sit amet hendrerit nisi justo et lectus. Aenean dictum lacus a bibendum viverra. Nunc commodo a massa a efficitur. Integer in leo et purus vulputate pellentesque ac sit amet tellus. Cras imperdiet vehicula dignissim. Etiam ornare quam diam, rhoncus faucibus quam elementum et.
