User:THE OWL/Sandbox: Difference between revisions

From Valve Developer Community
Jump to navigation Jump to search
No edit summary
 
(80 intermediate revisions by 2 users not shown)
Line 1: Line 1:
{{DISPLAYTITLE:THE OWL's Sandbox}}
{{DISPLAYTITLE:THE OWL’s Sandbox}}
'''Welcome to [[{{NAMESPACE}}:{{ROOTPAGENAME}}|THE OWL]]'s sandbox!''' Here he creates templates, articles and much more that is not yet completed enough to be published. If you want to change something in this sandbox, just do it.
<center> <p>'''Sandbox Navigation'''</p> </center>


<div style="display:flex; justify-content:center; gap:.5em"><!--
--> {{Link|plain|developer.valvesoftware.com/wiki/Special:PrefixIndex/User:THE_OWL/Sandbox/Templates|Templates}} <span style="opacity:.5">•</span> {{Link|plain|developer.valvesoftware.com/wiki/Special:PrefixIndex/User:THE_OWL/Sandbox/Pages|Pages}}
</div>


{{toc|style=display:inline-flex; box-shadow:0 0 80px rgb(0 0 0 / 80%); border-radius:.4em; pointer-events:all; overflow:hidden; position:relative|background style = background-image:linear-gradient(135deg, transparent, rgba(0, 0, 0, 0.25)); border-radius:inherit; border:1px solid #686868; box-shadow:inset 0 0 3px rgb(0 0 0 / 60%);}}
<center style="margin-top:1.3em"> <p>'''Redesign Preview'''</p> </center>


== Articles ==
<div style="display:flex; justify-content:center; gap:.5em"><!--
* [[{{FULLPAGENAME}}/Future version of the article|<span style="background-image:linear-gradient(135deg, rgba(94 137 219 / 17%), rgba(255 255 255 / 2%)); border:1px solid rgba(255, 255, 255, 0.1); border-radius: .8em; padding:.25em .6em">Future version of the article</span>]]
--> [[/Pages/Main_Page|Main Page]] <span style="opacity:.5">•</span> [[/Pages/Software_docs|Software docs]]
</div>


== Outputs, Inputs, Flags template ==
{{Clr}}
'''Description:''' Compact list with switchable description on the right.


'''Status:''' <span style="background-image:linear-gradient(135deg, rgba(219 158 94 / 17%), rgba(255 255 255 / 2%)); border:1px solid rgba(255, 255, 255, 0.1); border-radius: .3em; color:#FFDA69; padding:.25em .6em">Work in Progress</span>
{{Note|[[User:Cvoxalury#Documenting_VDC_Redesign_Flaws|Documenting VDC Redesign Flaws]].}}


'''Preview:'''
== Colors ==
<div style="box-shadow:0 10px 32px rgba(0 0 0 / 25%); background-image:linear-gradient(135deg, rgb(255 255 255 / 3%), transparent); border:1px solid rgb(255 255 255 / 6%); border-radius:.4em; padding:.4em .8em">
<div style="display:flex; flex-wrap:wrap; gap:1em">
<div style="display:inherit; gap:.4em">
<div style="border-radius:50%; padding:.5em .75em; background-color:rgb(38 38 38); outline:1px solid rgb(255 255 255 / 50%)"></div>
<div> Article Background <span style="opacity:.5"> (38 38 38) (#262626) </span> </div>
</div>
<div style="display:inherit; gap:.4em">
<div style="border-radius:50%; padding:.5em .75em; background-color:rgb(41 41 41); outline:1px solid rgb(255 255 255 / 50%)"></div>
<div> Island <span style="opacity:.5"> (41 41 41) </span> </div>
</div>
<div style="display:inherit; gap:.4em">
<div style="border-radius:50%; padding:.5em .75em; background-color:rgb(100 140 200); outline:1px solid rgb(255 255 255 / 50%)"></div>
<div> Link <span style="opacity:.5"> (100 140 200) </span> </div>
</div>
<div style="display:inherit; gap:.4em">
<div style="border-radius:50%; padding:.5em .75em; background-color:rgb(150 165 145); outline:1px solid rgb(255 255 255 / 50%)"></div>
<div> Code <span style="opacity:.5"> (150 165 145) </span> </div>
</div>
</div>


{{:{{FULLPAGENAME}}/Templates/OIF}}
== Typography ==
=== Typeface ===
sans-serif <span style="opacity:.5">(general)</span>


<div style="display:flex; gap:1em; margin-bottom:.5em">
<div style="border-radius:6px; padding:1em 3em 2em 1em; background-color:rgb(0 0 0 / 50%)">
<div style="font-size:1.5em; font-weight:400; color:rgb(255 255 255 / 85%)"> Aa </div>
<div> Regular <span style="opacity:.5">(400)</span> </div>
</div>
<div style="border-radius:6px; padding:1em 3em 2em 1em; background-color:rgb(0 0 0 / 50%)">
<div style="font-size:1.5em; font-weight:700; color:rgb(255 255 255 / 85%)"> Aa </div>
<div> Bold <span style="opacity:.5">(700)</span> </div>
</div>
<div style="border-radius:6px; padding:1em 3em 2em 1em; background-color:rgb(0 0 0 / 50%)">
<div style="font-size:1.5em; font-weight:900; color:rgb(255 255 255 / 85%)"> Aa </div>
<div> Black <span style="opacity:.5">(900)</span> </div>
</div>
</div>
</div>


== Inline user template ==
monospace <span style="opacity:.5">(for code)</span>
 
'''Description:''' Just an idea.
 
'''Status:''' <span style="background-image:linear-gradient(135deg, rgba(219 94 94 / 17%), rgba(255 255 255 / 2%)); border:1px solid rgba(255, 255, 255, 0.1); border-radius: .3em; color:#FF7069; padding:.25em .6em">Unreleased</span>
 
'''Preview:'''
 
<div style="box-shadow:0 10px 32px rgba(0 0 0 / 25%); background-image:linear-gradient(135deg, rgb(255 255 255 / 3%), transparent); border:1px solid rgb(255 255 255 / 6%); border-radius:.4em; padding:.4em .8em">
 
* I'm <span style="background-color:rgba(50, 84, 188,.6); border-radius:2px; white-space:nowrap; padding:2px 3px 1px 4px"><span style="pointer-events:none; user-select:none; margin-right:.3em">[[File:icon-user.png|baseline|8px|link=]]</span>'''[[User:THE OWL|<font style="color:rgba(255,255,255,.85)">THE OWL</font>]]'''</span>. Who are you?
 
* I'm <span style="background-color:rgba(50, 84, 188,.6); border-radius:2px; white-space:nowrap; padding:2px 4px 1px 4px">'''[[User:THE OWL|<font style="color:rgba(255,255,255,.85)">THE OWL</font>]]'''</span>. Who are you?
 
* Hi, this is <span style="background-color:rgba(225, 75, 75,.35); border-radius:2px; white-space:nowrap; padding:2px 3px 1px 3px">'''[[User:Gabe Newell|<font style="color:rgba(255,255,255,.9)">Gabe Newell</font>]]''' <span style="pointer-events:none; user-select:none; position:relative; margin-right:.3em; bottom:-1px">[[File:Valve icon.png|baseline|13px|link=]]</span></span>. I work at Valve.
 
* Hi, this is <span style="background-color:rgba(225, 75, 75,.35); border-radius:2px; white-space:nowrap; padding:2px 3px 1px 3px"><span style="pointer-events:none; user-select:none; position:relative; margin-right:.3em; bottom:-1px">[[File:Valve icon.png|baseline|13px|link=]]</span>'''[[User:Gabe Newell|<font style="color:rgba(255,255,255,.9)">Gabe Newell</font>]]'''</span>. I work at Valve.
 
* Hi, this is <span style="background-color:rgba(225, 75, 75,.4); border-radius:2px; white-space:nowrap; padding:2px 3px 1px 3px"><span style="pointer-events:none; user-select:none; margin-right:.3em">[[File:icon-user.png|baseline|8px|link=]]</span>'''[[User:Gabe Newell|<font style="color:rgba(255,255,255,.9)">Gabe Newell</font>]]'''</span>. I work at Valve.
 
* Hi, this is <span style="background-color:rgba(225, 75, 75,.4); border-radius:2px; white-space:nowrap; padding:2px 4px 1px 4px">'''[[User:Gabe Newell|<font style="color:rgba(255,255,255,.9)">Gabe Newell</font>]]'''</span>. I work at Valve.
 
<hr style="opacity:.3; margin:10px 0">
 
* I'm <b style="white-space:nowrap; background-color:rgba(50, 84, 188,.6); border-radius:2px; padding:2px 3px 1px 3px"><span style="user-select:none; pointer-events:none; padding-right:3px">[[File:Icon-user.png|baseline|link=|8px]]</span>[[User:THE OWL|<font style="color:#DFE7FF">THE OWL</font>]]</b>. Who are you?
 
* Hi, this is <b style="white-space:nowrap; background-color:rgba(225, 75, 75,.4); border-radius:2px; padding:2px 3px 1px 3px"><span style="user-select:none; pointer-events:none; padding-right:3px">[[File:Icon-user.png|baseline|link=|8px]]</span>[[User:Gabe Newell|<font style="color:#DFE7FF">Gabe Newell</font>]]</b>. I work at Valve.


<div style="display:flex; gap:1em; margin-bottom:.5em">
<div style="border-radius:6px; padding:1em 3em 2em 1em; background-color:rgb(0 0 0 / 50%)">
<div style="font-family:monospace; font-size:2.2em; font-weight:400; color:rgb(255 255 255 / 85%)"> Aa </div>
<div> Regular <span style="opacity:.5">(400)</span> </div>
</div>
</div>
</div>


== Inline path template ==
=== Inline Code ([[Template:Code|T]]) ===
'''Status:''' [[Template:Path|<span style="background-image:linear-gradient(135deg, rgba(121 219 94 / 17%), rgba(255 255 255 / 2%)); border:1px solid rgba(255, 255, 255, 0.1); border-radius: .8em; color:#A6FF69; padding:.25em .6em">Released</span>]]
<code style="border-radius:3px; background-color:rgba(0 0 0 / 35%); padding:2px 3px; user-select:unset"> $basetexture </code>
 
'''Actions:''' [[/Templates/Path|<span style="background-image:linear-gradient(135deg, rgba(94 137 219 / 17%), rgba(255 255 255 / 2%)); border:1px solid rgba(255, 255, 255, 0.1); border-radius: .8em; padding:.25em .6em">View the Base</span>]]


'''Preview:'''
=== Keyboard Key ([[Template:Key|T]])===
<span style="display:inline-block; box-shadow:0 2px 0 #505050; border:1px solid #505050; border-radius:3px; background-color:#303030; margin:0 0.2em; padding:0 3.5pt"> Ctrl </span>


<div style="box-shadow:0 10px 32px rgba(0 0 0 / 25%); background-image:linear-gradient(135deg, rgb(255 255 255 / 3%), transparent); border:1px solid rgb(255 255 255 / 6%); border-radius:.4em; padding:.4em .8em">
== Iconography ==
=== Navigation ===
It’s empty here for now.


The magic folder of the game is located in {{:{{FULLPAGENAME}}/Templates/Path|C:\Program Files\Steam\steamapps\common\half-life 2}}.
== Buttons ==
It’s empty here for now.


The magic executable file is located in {{:{{FULLPAGENAME}}/Templates/Path|C:\Program Files\Steam\steamapps\common\half-life 2|hl2.exe}}.


The magic folder is located in {{:{{FULLPAGENAME}}/Templates/Path|select=all|%appdata%\discord}}.
== Selectors & Elements ==
=== Checkbox ===
It’s empty here for now.


The magic file is located in {{:{{FULLPAGENAME}}/Templates/Path|select=all|%appdata%\discord|badge-1.ico}}.
=== Toggle button ===
It’s empty here for now.


=== Tabs ([[Template:Tabs|T]]) ===
<div style="box-sizing:border-box; width:100%; background-color:rgb(0 0 0 / 9%); border:1px solid rgb(255 255 255 / 3%); border-bottom:0; border-radius:4px 4px 0 0; overflow:hidden; overflow-x:auto; position:relative; padding:.5em .5em 0 .5em; float:left; margin-bottom:8px">
<div style="width:100%; border-bottom: 1px solid rgb(255 255 255 / 15%); position:absolute; z-index:2; bottom:0; left:0"></div>
<div style="background-color:rgb(36 36 36); border:1px solid rgb(255 255 255 / 1%); border-bottom:0; border-radius:6px 6px 0 0; z-index:1; float:left; padding:.5em 1em; margin-right:.25em"> [[User:THE OWL|GoldSrc]] </div>
<div style="background-image:linear-gradient(0deg, rgb(38 38 38), rgb(42 42 42)); border:1px solid rgb(255 255 255 / 15%); border-bottom:0; border-radius:6px 6px 0 0; color:rgb(255 255 255 / 75%); position:relative; float:left; z-index:3; padding:.5em 1em; margin-right:.25em"> [[{{FULLPAGENAME}}|Source Engine]] </div>
<div style="background-color:rgb(36 36 36); border:1px solid rgb(255 255 255 / 1%); border-bottom:0; border-radius:6px 6px 0 0; z-index:1; float:left; padding:.5em 1em; margin-right:.25em"> [[User:THE OWL|Source 2]] </div>
</div>
</div>


== New version of the Software template ==
{{lorem}}
'''Description:''' An attempt to improve the {{tl|link=Software}} template. The work is not finished yet.
__NOTOC__
 
'''Status:''' <span style="background-image:linear-gradient(135deg, rgba(219 94 94 / 17%), rgba(255 255 255 / 2%)); border:1px solid rgba(255, 255, 255, 0.1); border-radius: .3em; color:#FF7069; padding:.25em .6em">Unreleased</span>
 
'''Actions:''' [[/Templates/Software|<span style="background-image:linear-gradient(135deg, rgba(94 137 219 / 17%), rgba(255 255 255 / 2%)); border:1px solid rgba(255, 255, 255, 0.1); border-radius: .8em; padding:.25em .6em">View the Base<span>]]&ensp;·&ensp;[[/Templates/Software/Child|<span style="background-image:linear-gradient(135deg, rgba(94 137 219 / 17%), rgba(255 255 255 / 2%)); border:1px solid rgba(255, 255, 255, 0.1); border-radius: .8em; padding:.25em .6em">View Child</span>]]
 
'''Examples and Preview:'''
 
<div style="box-shadow:0 10px 32px rgba(0 0 0 / 25%); background-image:linear-gradient(135deg, rgb(255 255 255 / 3%), transparent); border:1px solid rgb(255 255 255 / 6%); border-radius:.4em; padding:.4em .8em">
 
{| class="standard-table"
|- style="position:sticky; z-index:10; top:0"
! Example
! Preview
|-
| align="center" style="padding:5px" | {{Code|<nowiki>{{csgo}}</nowiki>}}
| style="padding:5px" | {{:{{FULLPAGENAME}}/Templates/Software/Child}}
|-
| align="center" style="padding:5px" | {{Code|<nowiki>{{csgo|0}}</nowiki>}}
| style="padding:5px" | {{:{{FULLPAGENAME}}/Templates/Software/Child|0}}
|-
| align="center" style="padding:5px" | {{Code|<nowiki>{{csgo|2}}</nowiki>}}
| style="padding:5px" | {{:{{FULLPAGENAME}}/Templates/Software/Child|2}}
|-
| align="center" style="padding:5px" | {{Code|<nowiki>{{csgo|3}}</nowiki>}}
| style="padding:5px" | {{:{{FULLPAGENAME}}/Templates/Software/Child|3}}
|-
| align="center" style="padding:5px" | {{Code|<nowiki>{{csgo|4}}</nowiki>}}
| style="padding:5px" | {{:{{FULLPAGENAME}}/Templates/Software/Child|4}}
|-
| align="center" style="padding:5px" | {{Code|<nowiki>{{csgo|5}}</nowiki>}}
| style="padding:5px" | {{:{{FULLPAGENAME}}/Templates/Software/Child|5}}
|-
| align="center" style="padding:5px" | {{Code|<nowiki>{{csgo|icon}}</nowiki>}}
| style="padding:5px" | {{:{{FULLPAGENAME}}/Templates/Software/Child|icon}}
|-
| align="center" style="padding:5px" | {{Code|<nowiki>{{csgo|icon|2}}</nowiki>}}
| style="padding:5px" | {{:{{FULLPAGENAME}}/Templates/Software/Child|icon|2}}
|-
| align="center" style="padding:5px" | {{Code|<nowiki>{{csgo|icon|3}}</nowiki>}}
| style="padding:5px" | {{:{{FULLPAGENAME}}/Templates/Software/Child|icon|3}}
|-
| align="center" style="padding:5px" | {{Code|<nowiki>{{csgo|color}}</nowiki>}}
| style="padding:5px" | {{:{{FULLPAGENAME}}/Templates/Software/Child|color}}
|}
 
{| class="standard-table"
| align="center" style="padding:5px" | {{CodeBlock|<nowiki>{{csgo| addtext:before = The legendary | addtext:after = looks weird, but we even like it. }}</nowiki>}}
|-
| bgcolor="#303030" style="padding:5px" | {{:{{FULLPAGENAME}}/Templates/Software/Child| addtext:before = The legendary | addtext:after = looks weird, but we even like it. }}
|}
 
{| class="standard-table"
| align="center" style="padding:5px" | {{CodeBlock|<nowiki>{{csgo| 5 | addtext:before = The legendary | addtext:after = looks weird, but we even like it. }}</nowiki>}}
|-
| bgcolor="#303030" style="padding:5px" | {{:{{FULLPAGENAME}}/Templates/Software/Child| 5 | addtext:before = The legendary | addtext:after = looks weird, but we even like it. }}
|}
 
{| class="standard-table"
| align="center" style="padding:5px" | {{CodeBlock|<nowiki>{{csgo| icon | 3 | addtext:before = {{cs|icon}} {{css|icon}} | addtext:after = {{cs2|icon}} }}</nowiki>}}
|-
| bgcolor="#303030" style="padding:5px" | {{:{{FULLPAGENAME}}/Templates/Software/Child| icon | 3 | addtext:before = {{cs}} {{css}} | addtext:after = {{cs2}} }}
|}
 
<hr>
 
[[File:csgo.png|thumb]]
[[File:csgo.png|thumb]]
 
{{Lorem ipsum}} {{:{{FULLPAGENAME}}/Templates/Software/Child|4}} ({{Code|{{:{{FULLPAGENAME}}/Templates/Software/Child|color}}}}) {{Lorem ipsum}} {{:{{FULLPAGENAME}}/Templates/Software/Child|icon}} {{:{{FULLPAGENAME}}/Templates/Software/Child|0}} {{Lorem ipsum}} {{:{{FULLPAGENAME}}/Templates/Software/Child|2}} {{Lorem ipsum}} {{:{{FULLPAGENAME}}/Templates/Software/Child}} {{Lorem ipsum}}
 
<hr>
 
# {S} {{:{{FULLPAGENAME}}/Templates/Software/Child|icon}} {C} {{:{{FULLPAGENAME}}/Templates/Software/Child|2}} {E}
# {S} {{:{{FULLPAGENAME}}/Templates/Software/Child|4}} {E}
 
* {S} {{:{{FULLPAGENAME}}/Templates/Software/Child|icon}} {C} {{:{{FULLPAGENAME}}/Templates/Software/Child|2}} {E}
 
<hr>
 
# {S} {{csgo}} {C} {{csgo|3.1}} {E}
# {S} {{csgo|4}} {E}
 
* {S} {{csgo}} {C} {{csgo|3.1}} {E}
 
</div>

Latest revision as of 09:22, 7 September 2025

Sandbox Navigation

Templates • Pages

Redesign Preview

Main Page • Software docs
Note.pngNote:Documenting VDC Redesign Flaws.

Colors

Article Background (38 38 38) (#262626)
Island (41 41 41)
Link (100 140 200)
Code (150 165 145)

Typography

Typeface

sans-serif (general)

Aa
Regular (400)
Aa
Bold (700)
Aa
Black (900)

monospace (for code)

Aa
Regular (400)

Inline Code (T)

$basetexture

Keyboard Key (T)

Ctrl

Iconography

Navigation

It’s empty here for now.

Buttons

It’s empty here for now.


Selectors & Elements

Checkbox

It’s empty here for now.

Toggle button

It’s empty here for now.

Tabs (T)

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Retrieved from "https://developer.valvesoftware.com/w/index.php?title=User:THE_OWL/Sandbox&oldid=488286"