SHOW:
|
|
- or go back to the newest paste.
1 | <!-- | |
2 | [คู่มือการแก้ไขโคด] | |
3 | - สีหลัก (สีแดง) : --vibe-primary: #c51427; | |
4 | - สีรอง (สีเทา) :--vibe-secondary: #6d6e71; | |
5 | ||
6 | - สีพื้นหลัง : --vibe-bg: #f2f2f2; | |
7 | - สีตัวอักษร : --vibe-txt: #000; | |
8 | - สีขอบ : --vibe-border: #6d6e71; | |
9 | - | <div class="vibe-picture" style="--vibe-pic: url(https://iili.io/2G3vSX2.png);--vibe-pos: 50% 55%;--vibe-size: 122%;"></div> |
9 | + | |
10 | - | <div class="vibe-picture" style="--vibe-pic: url(https://iili.io/2G3S3F9.png);--vibe-pos: 70% 40%;--vibe-size: 185%;"></div> |
10 | + | - ฟอนต์ภาษาไทย* : --vibe-fontth: 'Bai Jamjuree'; |
11 | - | <div class="vibe-picture" style="--vibe-pic: url(https://iili.io/2G38NEP.png);--vibe-pos: 70% 62%;--vibe-size: 122%;"></div> |
11 | + | * อย่าลืมเอาลิงก์ฟอนต์มาด้วย |
12 | - | <div class="vibe-picture" style="--vibe-pic: url(https://iili.io/2G38z2n.png);--vibe-pos: 70% 80%;--vibe-size: 110%;"></div> |
12 | + | |
13 | ------------------------ | |
14 | [ส่วนแถบด้านบน] | |
15 | ด้านซ้าย แก้ที่ <div class="vibe-topbar-item"> อันแรก | |
16 | - รูป png : [img]https://iili.io/2E047J1.png[/img] | |
17 | - | <p>Christmas is a season of joy, a time for love, and a moment to remember the blessings we have.</p> |
17 | + | - คำ : Vibe Journey |
18 | - ไม่ต้องเว้นบรรทัด วางติดกันไปเลย | |
19 | - | <div class="vibe-btn primary">Joy of Xmas</div> |
19 | + | |
20 | - | <div class="vibe-btn">The best gift</div> |
20 | + | ด้านขวา แก้ที่ <div class="vibe-topbar-item"> อันที่สอง |
21 | - เลือกไอคอนจาก https://fontawesome.com/search มาวางได้เลย | |
22 | - ไม่ต้องเว้นบรรทัด วางติดกันไปเลย | |
23 | - | <p>กลับมาให้หายคิดถึงอีกครั้งกับกิจกรรมที่จะพาทุกคนไปทำความรู้จักกับตัวละครที่คุณรักมากขึ้น ไม่ว่าจะจากเวิร์สหลักหรือจากกิจกรรมใด ๆ ที่ขึ้นแท่นลูกรักมากเป็นพิเศษ !</p> |
23 | + | |
24 | - | <p>[color=#c51427][b]Vibe Journey : Christmas Edition[/b][/color] กิจกรรมที่จะชวนทุกคนให้มาตกแต่งภาพเก้าช่องด้วยรูปอะไรก็ได้ ขอแค่เกี่ยวข้องกับตัวละครของคุณและอยู่ในธีมคริสต์มาสก็เป็นพอ ! อย่าลืมใส่คำอธิบายเล็ก ๆ น้อย ๆ ไม่เกิน 70 คำไว้ด้วยนะ คนอื่นที่แวะเวียนมาเล่นจะได้รู้จักคุณมากขึ้นยังไงล่ะ</p> |
24 | + | ------------------------ |
25 | - | <p>ฟังดูง่ายใช่ไหม งั้นมาเริ่มแชร์ไวบ์ของตัวละครพวกคุณกันเลย</p> |
25 | + | [ส่วนเฮด] |
26 | รูป 4 ช่อง : --vibe-pic: url(--ลิงก์รูป--); | |
27 | ||
28 | ส่วนข้อความด้านขวา | |
29 | - | [*]ทำภาพไวบ์ของตัวละครในรูปแบบ 9 ช่อง โดยจะใช้ภาพแบบไหนก็ได้ที่เกี่ยวข้องกับตัวละครในธีม Christmas |
29 | + | - โลโก้กิจ : [img]https://iili.io/2GfP37V.png[/img] (รูปขนาด 500px ไม่เว้นขอบ) |
30 | - | [*]เขียนคำอธิบายสำหรับภาพไวบ์ตัวละคร ไม่เกิน 70 คำ |
30 | + | - ข้อความสักอย่าง แก้ใน <p></p> |
31 | - | [*]ผู้เล่นจะทำกี่ตัวละครก็ได้ ไม่จำกัด |
31 | + | - ปุ่มมีสี : จะมีชื่อคลาส primary |
32 | - | [*]ใช้โคดของกิจกรรมเท่านั้น |
32 | + | |
33 | ------------------------ | |
34 | [ส่วนเนื้อหา] | |
35 | - หัวข้อ (ตัวไม่ใหญ่มาก ตัวหนา สีตามสีหลัก) ใช้ <h3>หัวข้อ</h3> เวลาใช้ให้เว้นบรรทัดว่างข้างบนไว้ 1 บรรทัดจะห่างพอดี | |
36 | - เนื้อหาเป็นย่อหน้า ใส่ใน <p></p> ถ้าจะเพิ่มย่อหน้าก็ก๊อปวางเพิ่ม ถ้าไม่อยากเว้นย่อหน้าข้อความก็พิมพ์ข้อความปกติได้เลยไม่ต้องใช้ <p></p> | |
37 | - | [*]ผู้เข้าร่วมทุกคนจะได้รับ เงินรางวัล 50 ดอลลาร์ และ คริสตัลคะแนน 1 ชิ้น [b][color=#c51427]*[/color][/b] |
37 | + | |
38 | - | [*]ผู้เข้าร่วมสามารถลงชื่อขอรับแบนเนอร์ประจำกิจกรรมได้ในดิสคอร์ด |
38 | + | - นอกนั้นใช้เครื่องมือปกติได้เลย |
39 | ||
40 | - | [align=center][b][color=#c51427]* หากมีผู้เข้าร่วมเกินจำนวน ทางผู้จัดจะทำการสุ่มคริสตัลให้ผู้เข้าร่วมกิจกรรม[/color][/b][/align] |
40 | + | ------------------------ |
41 | [เพลงประกอบกิจ] | |
42 | - | <h3>โคดส่งกิจกรรม :</h3> |
42 | + | |
43 | - | <details><summary> |
43 | + | --> |
44 | - | [align=center][color=#888888](คลิกที่รูปเพื่อรับโคด)[/color] |
44 | + | |
45 | - | <img src="https://iili.io/2Gf99VV.png" style="width: 600px;max-width: 100%;">[/align] |
45 | + | |
46 | - | </summary> |
46 | + | |
47 | - | <h3>สิ่งที่แก้ไขได้</h3> |
47 | + | |
48 | <div class="vibe-topbar-item">[img]https://iili.io/2E047J1.png[/img]Vibe Journey</div> | |
49 | - | [*][b]สีหลัก[/b] (สำหรับส่วนชื่อ) [b]:[/b] [font=monospace][color=#6d6e71]--vibe-primary: #c51427;[/color][/font] |
49 | + | |
50 | - | [*][b]สีพื้นหลัง :[/b] [font=monospace][color=#6d6e71]--vibe-bg: #f2f2f2;[/color][/font] |
50 | + | |
51 | - | [*][b]สีตัวอักษร :[/b] [font=monospace][color=#6d6e71]--vibe-txt: #000;[/color][/font] |
51 | + | |
52 | - | [*][b]ฟอนต์ภาษาไทย[color=#c51427]*[/color] :[/b] [font=monospace][color=#6d6e71]--vibe-fontth: 'Bai Jamjuree';[/color][/font] |
52 | + | |
53 | - | [*][b]ฟอนต์ภาษาอังกฤษ[color=#c51427]*[/color][/b] (สำหรับส่วนชื่อ) [b]:[/b] [font=monospace][color=#6d6e71]--vibe-fonten: 'Bai Jamjuree';[/color][/font] |
53 | + | <div class="vibe-picture" style="--vibe-pic: url(--ลิงก์รูป1--);"></div> |
54 | <div class="vibe-picture" style="--vibe-pic: url(--ลิงก์รูป2--);"></div> | |
55 | - | [b][color=#c51427]* อย่าลืมแนบลิงก์ฟอนต์มาด้วย[/color][/b] |
55 | + | <div class="vibe-picture" style="--vibe-pic: url(--ลิงก์รูป3--);"></div> |
56 | <div class="vibe-picture" style="--vibe-pic: url(--ลิงก์รูป4--);"></div> | |
57 | - | [b][color=#c51427]หมายเหตุ :[/color][/b] เพื่อไม่ให้ยากต่อการแก้ไขโคด ควรตัดรูปเป็นจตุรัสให้เรียบร้อย |
57 | + | |
58 | <div class="vibe-details"> | |
59 | [img]https://iili.io/2GfP37V.png[/img] | |
60 | <hr> | |
61 | - | [*][b]ขยับตำแหน่งรูป :[/b] [font=monospace][color=#6d6e71]เพิ่ม --vibe-pos: 50% 50%; ต่อท้ายลิงก์รูปที่ต้องการปรับ[/color][/font] |
61 | + | <p>--คำโปรย--</p> |
62 | <div class="vibe-btn-group"> | |
63 | - | [*][b]ขยับซ้ายขวา :[/b] [font=monospace][color=#6d6e71]เพิ่ม/ลดเลข 50% ตัวหน้า[/color][/font] |
63 | + | <div class="vibe-btn primary">--ปุ่มมีสี--</div> |
64 | - | [*][b]ขยับขึ้นลง :[/b] [font=monospace][color=#6d6e71]เพิ่ม/ลดเลข 50% ตัวหลัง[/color][/font] |
64 | + | <div class="vibe-btn">--ปุ่มไม่มีสี--</div> |
65 | </div></div></div> | |
66 | <div class="vibe-content"> | |
67 | <p>--ย่อหน้า 1--</p> | |
68 | <p>--ย่อหน้า 2--</p> | |
69 | - | [*][b]ปรับขนาดรูปในวงกลม :[/b] [font=monospace][color=#6d6e71]เพิ่ม --vibe-size: 100%; ต่อท้ายลิงก์รูปที่ต้องการปรับ[/color][/font] |
69 | + | <p>--ย่อหน้า 3--</p> |
70 | ||
71 | - | [*][b]ขยายใหญ่ :[/b] [font=monospace][color=#6d6e71]เพิ่มเลข 100%[/color][/font] |
71 | + | |
72 | - | [*][b]ลดขนาด :[/b] [font=monospace][color=#6d6e71]ลดเลข 100%[/color][/font] |
72 | + | |
73 | [*]ขั้นตอน 1 | |
74 | [*]ขั้นตอน 2 | |
75 | - | [code]<link href="https://dl.dropbox.com/scl/fi/8ymzebtysl0ptvb2eyzg6/vibe.css?rlkey=5sf0s91nok670edo21icu6raf&st=a3nwl187" rel="stylesheet"> |
75 | + | [*]ขั้นตอน 3 |
76 | - | <div id="zzzcode"><a href="https://discord.com/users/625292873914515456/"></a><div class="vibe-play-container" style="--vibe-primary: #c51427;--vibe-bg: #f2f2f2;--vibe-txt: #000;--vibe-fontth: 'Bai Jamjuree';--vibe-fonten: 'Bai Jamjuree';"> |
76 | + | |
77 | - | <div class="vibe-play-pic" style="--vibe-pic: url(--ลิงก์รูปตัวละคร--);"></div> |
77 | + | |
78 | - | <div class="vibe-play-name">--ชื่อตัวละคร--</div> |
78 | + | |
79 | - | <p>--เขียนอธิบาย 70 คำ--</p> |
79 | + | |
80 | - | <div class="vibe-play-img-group"> |
80 | + | [*]รางวัล 1 |
81 | - | <div id="pic1" class="vibe-play-img" style="--vibe-pic: url(--ลิงก์รูปที่1--);"></div> |
81 | + | [*]รางวัล 2 |
82 | - | <div id="pic2" class="vibe-play-img" style="--vibe-pic: url(--ลิงก์รูปที่2--);"></div> |
82 | + | |
83 | - | <div id="pic3" class="vibe-play-img" style="--vibe-pic: url(--ลิงก์รูปที่3--);"></div> |
83 | + | |
84 | - | <div id="pic4" class="vibe-play-img" style="--vibe-pic: url(--ลิงก์รูปที่4--);"></div> |
84 | + | |
85 | - | <div id="pic5" class="vibe-play-img" style="--vibe-pic: url(--ลิงก์รูปที่5--);"></div> |
85 | + | |
86 | - | <div id="pic6" class="vibe-play-img" style="--vibe-pic: url(--ลิงก์รูปที่6--);"></div> |
86 | + | |
87 | - | <div id="pic7" class="vibe-play-img" style="--vibe-pic: url(--ลิงก์รูปที่7--);"></div> |
87 | + | |
88 | - | <div id="pic8" class="vibe-play-img" style="--vibe-pic: url(--ลิงก์รูปที่8--);"></div> |
88 | + | |
89 | - | <div id="pic9" class="vibe-play-img" style="--vibe-pic: url(--ลิงก์รูปที่9--);"></div> |
89 | + | |
90 | </div></div></div> |