User:Vaileasys/sandbox: Difference between revisions

From PZwiki
No edit summary
(add more todo and vector-2022.css)
 
(29 intermediate revisions by 3 users not shown)
Line 1: Line 1:
{| class="pztable" width=100%
<div class="sitenotice-card">
! Generic Heading 1
<div class="image-container-left">
! Generic Heading 2
[[File:Spiffo rummage.png|64px]]
! Generic Heading 3
</div>
|-
<div>
| width=33.33% style="vertical-align:top" |
'''Wiki maintenance!'''
{{MainPage Box1}}
{{MainPage Box3}}
{{MainPage Box2}}
| width=33.33% style="vertical-align:top" |
  <div id="Items" style="margin:10px 0 0 0; background-color:#821E21; color:#FFF; text-align:center; font: 20px Calibri, sans-serif; padding:3px 0 3px 0;><!--T-31-->Items
  </div>
    <div style="padding:5px 10px 10px 10px;">'''<!--T-76-->[[Items/Clothing|Clothing]]'''
:<!--T-77-->[[Items/Clothing#Head|Head]] • [[Items/Clothing#Upper Body|Upper Body]] • [[Items/Clothing#Belts|Belts]] • [[Items/Clothing#Lower Body|Lower Body]] • [[Items/Clothing#Suit|Suit]] • [[Items/Clothing#Underwear|Underwear]] • [[Items/Clothing#Jewellery|Jewellery]] • [[Bags|Bags]]
'''<!--T-78-->[[Weapons|Weapons]]'''
:<!--T-79-->[[Weapons#Axe|Axes]] • [[Weapons#Long_Blunt|Long Blunt]] • [[Weapons#Short_Blunt|Short Blunt]] • [[Weapons#Long_Blade|Long Blades]] • [[Weapons#Short_Blade|Short Blades]] • [[Weapons#Spear_2|Spears]] • [[Weapons#Firearms|Firearms]] • [[:Category:Ammo|Ammo]] • [[Weapon mods]] • [[Weapons#Throwables|Throwables]]
'''<!--T-80-->[[Items/Literature|Literature]]'''
:<!--T-81-->[[Map|Maps]] • [[Skill Books]] • [[Recipe Magazines]] • [[Items/Literature#Leisure|Leisure]] • [[Items/Literature#Writable|Writable]]
'''<!--T-82-->[[Items/Medicine|Medical]]'''
:<!--T-83-->[[Items/Medicine#Pharmaceuticals|Pharmaceuticals]] • [[Items/Medicine#Bandages|Bandages]] • [[Items/Medicine#Herbal Remedies|Herbal Remedies]] • [[Items/Medicine#Medical Equipment|Medical Equipment]]
'''<!--T-84-->[[Items/Food|Food]]'''
:<!--T-85-->[[Items/Food#Drink|Drinks]] • [[Items/Food#Fruit|Fruits]] • [[Items/Food#Vegetable|Vegetables]] • [[Items/Food#Meat|Meat]] • [[Recipe_Ingredients#Condiments_and_Spices|Spices]] • [[Items/Food#Canned food|Canned foods]] • [[Recipe Ingredients|Cooking Ingredients]]
'''<!--T-86-->Other'''
:<!--T-87-->[[Items/Materials#Electrical|Electronics]] • [[Items/Materials#Fabric|Fabrics]] • [[Fuel]] • [[Fire sources]] • [[Keys]] • [[Light sources]] • [[Items/Materials#Metalwork|Metals]] • [[Items/Vehicle|Vehicle parts]] • [[Items/Materials#Woodwork|Woods]]
    </div>
  <div id="Announcements" style="margin:10px 0 0 0; background-color:#821E21; color:#FFF; text-align:center; font: 20px Calibri, sans-serif; padding:3px 0 3px 0;><!--T-31-->Tiles
  </div>
    <div style="padding:5px 10px 10px 10px;"><!--T-77-->'''[[Tiles/Appliances|Appliances]]'''
:[[Tiles/Appliances#Refrigerators|Refrigerators]]  • [[Tiles/Appliances#Ovens|Oven]]  • [[Tiles/Appliances#Washing Machines|Washing Machines]]  • [[Tiles/Appliances#Communications|Communication]]  • [[Generator|Generator]]
'''[[Tiles/Lighting|Lighting]]'''
:[[Tiles/Lighting#Lamps|Lamps]] • [[Tiles/Lighting#Outdoor Lights|Outdoor Lights]] • [[Tiles/Lighting#Wall Sconces|Wall Sconces]] • [[Tiles/Lighting#Other|Other]]
'''[[Tiles/Plumbing|Plumbing]]'''
:[[Tiles/Plumbing#Sinks|Sinks]] • [[Tiles/Plumbing#Baths and Showers|Baths and Showers]] • [[Tiles/Plumbing#Toilets|Toilets]] • [[Tiles/Plumbing#Other|Other]]
'''[[Tiles/Comfort|Comfort]]'''
:[[Tiles/Comfort#Beds|Beds]] • [[Tiles/Comfort#Couches|Couches]] • [[Tiles/Comfort#Armchairs|Armchairs]] • [[Tiles/Comfort#Chairs|Chairs]] • [[Tiles/Comfort#Benches|Benches]] • [[Tiles/Comfort#Stools|Stools]] • [[Tiles/Comfort#Seats|Seats]] • [[Tiles/Comfort#Other|Other]]
'''[[Tiles/Tables|Tables]]'''
:[[Tiles/Tables#Counters|Counters]] • [[Tiles/Tables#Dining Tables|Dining Tables]] • [[Tiles/Tables#Coffee Tables|Coffee Tables]] • [[Tiles/Tables#Desks|Desks]]
'''[[Containers|Storage]]'''
:[[Tiles/Storage#Desks|Desks]] • [[Tiles/Storage#Counters|Counters]] • [[Tiles/Storage#Displays|Displays]] • [[Tiles/Storage#Shelves|Shelves]] • [[Tiles/Storage#Dressers|Dressers]] • [[Tiles/Storage#Cabinets|Cabinets]] • [[Tiles/Storage#Lockers|Lockers]] • [[Tiles/Storage#Crates|Crates]] • [[Tiles/Storage#Cash Registers|Cash Registers]] • [[Tiles/Storage#Vending Machines|Vending Machines]] • [[Tiles/Storage#Bins|Bins]] • [[Tiles/Storage#Mail Boxes|Mail Boxes]] • [[Tiles/Storage#Nature|Nature]] • [[Tiles/Storage#Mannequins|Mannequins]] • [[Tiles/Storage#Nature|Nature]] • [[Composter|Composter]] • [[Tiles/Storage#Stashes|Stashes]]


The wiki will be undergoing some maintenance while we modify the default theme.<br>
Notice any oddities or want to provide feedback? Let us know on the [[PZwiki_talk:Community_portal/Wiki_theme|discussion page]] or the [https://discord.com/channels/136501320340209664/473467044050894858 pzwiki discord channel].
</div>
<div class="image-container-right">
[[File:Be crafty.png|64px]]
</div>
</div>


<!-- • [[Tiles/Curtains|Curtains]] • [[Tiles/Mirrors|Mirrors]] • [[Tiles/Signs|Signs]] • [[Tiles/Miscellaneous|Miscellaneous]] -->
'''[[MediaWiki:Common.css|Common.css]]'''
    </div>
<syntaxhighlight lang="css">
| width=33.33% style="vertical-align:top" |{{MainPage_News}}
/* Mediawiki:Sitenotice */
|}
.sitenotice-card {
    display: flex;
    justify-content: space-between;
    align-items: center
    text-align: center;
    background-color: #f8f9fa;
    padding: 0.5rem 1rem;
    border-bottom: 1px solid #eaecf0;
    width: auto;
}
 
.sitenotice-card > div {
    display: flex;
    flex-direction: column
}
 
.sitenotice-card .image-container-left {
    margin-right: 1rem
}
 
.sitenotice-card .image-container-right {
    margin-left: 1rem
}
/* hide images if screen size is less than 720px */
@media screen and (max-width: 719px) {
    .sitenotice-card .image-container-left,
    .sitenotice-card .image-container-right {
        display:none
    }
}
</syntaxhighlight>
 
'''[[MediaWiki:Vector-2022.css|Vector-2022.css]]'''
<syntaxhighlight lang="css">
.vector-sitenotice-container {
    display: flex;
    justify-content: center;
    align-items: center;
}
 
.sitenotice-card {
    box-sizing: border-box;
    max-width: 1000px;
    width: 944px;
}
</syntaxhighlight>
 
===TODO===
*add <code>class="text-container"</code> for div with the text, so it can be modified per skin.
<syntaxhighLight lang="css">
.sitenotice-card .text-container {
    /* styles go here */
}
</syntaxhighlight>
*consider adding {{code|<p>}} or {{code|<div>}} tag with <code>class="title"</code> for styling the title.
<syntaxhighLight lang="css">
.sitenotice-card .text-container .title {
    /* styles go here */
}
</syntaxhighlight>
*create an [[MediaWiki:Anonnotice|anonnotice]] for users that aren't logged in
**wording will be adjusted directing them to create an account to change the theme
*Once style implemented, modify to advise how to change the theme

Latest revision as of 09:40, 29 March 2024

Spiffo rummage.png

Wiki maintenance!

The wiki will be undergoing some maintenance while we modify the default theme.
Notice any oddities or want to provide feedback? Let us know on the discussion page or the pzwiki discord channel.

Be crafty.png

Common.css 

/* Mediawiki:Sitenotice */
.sitenotice-card {
    display: flex;
    justify-content: space-between;
    align-items: center
    text-align: center;
    background-color: #f8f9fa;
    padding: 0.5rem 1rem;
    border-bottom: 1px solid #eaecf0;
    width: auto;
}

.sitenotice-card > div {
    display: flex;
    flex-direction: column
}

.sitenotice-card .image-container-left {
    margin-right: 1rem
}

.sitenotice-card .image-container-right {
    margin-left: 1rem
}
/* hide images if screen size is less than 720px */
@media screen and (max-width: 719px) {
    .sitenotice-card .image-container-left,
    .sitenotice-card .image-container-right {
        display:none
    }
}

Vector-2022.css 

.vector-sitenotice-container {
    display: flex;
    justify-content: center;
    align-items: center;
}

.sitenotice-card {
    box-sizing: border-box;
    max-width: 1000px;
    width: 944px;
}

TODO

  • add class="text-container" for div with the text, so it can be modified per skin.
.sitenotice-card .text-container {
    /* styles go here */
}
  • consider adding <p> or <div> tag with class="title" for styling the title.
.sitenotice-card .text-container .title {
    /* styles go here */
}
  • create an anonnotice for users that aren't logged in
    • wording will be adjusted directing them to create an account to change the theme
  • Once style implemented, modify to advise how to change the theme
Retrieved from "https://pzwiki.net/w/index.php?title=User:Vaileasys/sandbox&oldid=293995"