Initial commit
2
.gitattributes
vendored
Normal file
@ -0,0 +1,2 @@
|
||||
# Auto detect text files and perform LF normalization
|
||||
* text=auto
|
BIN
hosted-files/DS Game Maker 5 Manual.pdf
Normal file
BIN
hosted-files/DSGM Coding at a Glance.pdf
Normal file
BIN
hosted-files/Index of DS Game Maker Functions.pdf
Normal file
BIN
hosted-files/PAlib Functions Reference.pdf
Normal file
BIN
hosted-files/Troubleshooting Common Errors in DSGM 5.pdf
Normal file
BIN
images/backdrop-grey.png
Normal file
After Width: | Height: | Size: 39 KiB |
BIN
images/favicon.ico
Normal file
After Width: | Height: | Size: 1.1 KiB |
BIN
images/img-documentation.png
Normal file
After Width: | Height: | Size: 98 KiB |
BIN
images/img-dsgm-examples.png
Normal file
After Width: | Height: | Size: 105 KiB |
BIN
images/logo-dsgm.png
Normal file
After Width: | Height: | Size: 34 KiB |
BIN
images/thumbnail-dsgm-virtual-machine-guide.png
Normal file
After Width: | Height: | Size: 66 KiB |
BIN
images/thumbnail-setup-dsgm-on-windows.png
Normal file
After Width: | Height: | Size: 160 KiB |
BIN
images/thumbnail_action-rpg-tut-01.png
Normal file
After Width: | Height: | Size: 240 KiB |
172
index.html
Normal file
@ -0,0 +1,172 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>DSGM Resource Site</title>
|
||||
<link rel="icon" type="image/x-icon" href="images/favicon.ico">
|
||||
|
||||
<!-- LINKING CSS + BOOSTRAP -->
|
||||
|
||||
<!-- Latest compiled and minified CSS -->
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
|
||||
|
||||
<!--Font Awesome CDN -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
|
||||
|
||||
<!-- Site Style -->
|
||||
<link rel="stylesheet" type="text/css" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<main>
|
||||
<header>
|
||||
<img id="site-logo" class="img-fluid" src="images/logo-dsgm.png">
|
||||
<h1 class="themed-text">Resource Site</h1>
|
||||
</header>
|
||||
|
||||
<div class="separator"></div>
|
||||
|
||||
<div id="main-content">
|
||||
|
||||
<!--SECTION - INSTALLATION GUIDES-->
|
||||
<section class="section-container">
|
||||
|
||||
<div class="section-headline">
|
||||
<h2>DS Game Maker Installation Guides</h2>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6 mb-3">
|
||||
<a href="https://github.com/DigitalDesignDude/DS-Game-Maker-5-Setup">
|
||||
<img class="post-thumbnail img-fluid" src="images/thumbnail-setup-dsgm-on-windows.png" alt="DSGM Windows 11/10 Setup">
|
||||
<h3 class="post-thumbnail-title">DSGM Windows 11/10 Setup</h3>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-md-6 mb-3">
|
||||
<a href="https://dsgamemaker.online/vmrelease.html">
|
||||
<img class="post-thumbnail img-fluid" src="images/thumbnail-dsgm-virtual-machine-guide.png" alt="DSGM Virtual Machine Edition">
|
||||
<h3 class="post-thumbnail-title">DSGM Virtual Machine Edition</h3>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
<!--SECTION - DSGM DOCUMENTATION-->
|
||||
<section class="section-container">
|
||||
|
||||
<div class="section-headline">
|
||||
<h2>Documentation</h2>
|
||||
</div>
|
||||
|
||||
<div class="row container-bubble m-0">
|
||||
<div class="col-md-6 d-flex justify-content-center">
|
||||
<img class="text-center" src="images/img-documentation.png" style="width: 100%; max-width: 300px;">
|
||||
</div>
|
||||
<div class="col-md-6 d-flex align-items-center py-3 px-0">
|
||||
<ul>
|
||||
<li><a href="hosted-files/DS%20Game%20Maker%205%20Manual.pdf">DS Game Maker.pdf</a></li>
|
||||
<li><a href="hosted-files/DSGM%20Coding%20at%20a%20Glance.pdf">DSGM Coding at a Glance.pdf</a></li>
|
||||
<li><a href="hosted-files/Index%20of%20DS%20Game%20Maker%20Functions.pdf">Index of DS Game Maker Functions.pdf</a></li>
|
||||
<li><a href="hosted-files/PAlib%20Functions%20Reference.pdf">Palib Functions Reference.pdf</a></li>
|
||||
<li><a href="hosted-files/Troubleshooting%20Common%20Errors%20in%20DSGM%205.pdf">TroubleShooting Common Errors in DSGM 5.pdf</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<!--SECTION - EXAMPLE FILES-->
|
||||
<section class="section-container">
|
||||
|
||||
<div class="section-headline">
|
||||
<h2>Example Files</h2>
|
||||
</div>
|
||||
|
||||
<div class="row banner m-0 p-4">
|
||||
<div class="col-md-6 text-center d-flex justify-content-center align-items-center">
|
||||
<div>
|
||||
<img class="img-fluid mb-3" src="images/logo-dsgm.png" alt="documentation">
|
||||
<h3 class="banner-text mb-3 themed-text">Example Files</h3>
|
||||
<a class="btn btn-primary banner-button" href="https://surrealcubemedia.itch.io/ds-game-maker-examples">View on Itch.io</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6 d-flex justify-content-center">
|
||||
<img class="img-fluid text-center m-1" src="images/img-dsgm-examples.png">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<!--SECTION - TUTORIALS-->
|
||||
<section class="section-container">
|
||||
|
||||
<div class="section-headline">
|
||||
<h2>Tutorials</h2>
|
||||
</div>
|
||||
|
||||
<div class="row ">
|
||||
<div class="col-md-4 mb-3">
|
||||
<img class="post-thumbnail img-fluid" src="images/thumbnail_action-rpg-tut-01.png">
|
||||
<h3 class="post-thumbnail-title">Action RPG Tutorial #01 Sprite Movement</h3>
|
||||
<a href="https://www.youtube.com/channel/UCVmba1o66nWG6p-82g22iyg" class="post-sub-text">Coming soon! Subscribe to be notified.</a>
|
||||
</div>
|
||||
<div class="col-md-4 mb-3">
|
||||
<a href="https://www.youtube.com/watch?v=dHIOLBCViCA&t=109s"></a>
|
||||
<div class="post-thumbnail fluidMedia16x9"><iframe src="https://www.youtube.com/embed/dHIOLBCViCA" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
|
||||
<h3 class="post-thumbnail-title">Tap To Start Screen</h3>
|
||||
</div>
|
||||
<div class="col-md-4 mb-3">
|
||||
<div class="post-thumbnail fluidMedia16x9"><iframe src="https://www.youtube.com/embed/iGOefvkqBlM" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
|
||||
<h3 class="post-thumbnail-title">Fixing Color Palette Error</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<!--SECTION - COMMUNITY & SOCIAL LINKS -->
|
||||
<section class="section-container">
|
||||
|
||||
<div class="section-headline">
|
||||
<h2>Community & Social Links</h2>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-4 mb-3">
|
||||
<h3><i class="fab fa-discord"></i> Discord Servers</h3>
|
||||
<ul>
|
||||
<li><a href="https://discord.gg/uzNM8gGSA4">DS Game Maker</a></li>
|
||||
<li><a href="https://discord.gg/HqbuAy9xJf">DSGM Online</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-md-4 mb-3">
|
||||
<h3><i class="fab fa-youtube"></i> YouTube Channels</h3>
|
||||
<ul>
|
||||
<li><a href="https://www.youtube.com/channel/UCVmba1o66nWG6p-82g22iyg">DigitalDesignDude</a></li>
|
||||
<li><a href="https://www.youtube.com/channel/UCX-OKJjHLaTXOkxIAPSKM7Q">James Garner</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</div>
|
||||
<!--End of Main Content-->
|
||||
<div class="separator"></div>
|
||||
<footer>
|
||||
<p class="mb-0">Site by DigitalDesignDude</p>
|
||||
</footer>
|
||||
|
||||
</main>
|
||||
|
||||
|
||||
<!-- SCRIPTS -->
|
||||
<!-- jQuery library -->
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
|
||||
<!-- Latest compiled JavaScript -->
|
||||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
|
||||
</body>
|
||||
</html>
|
312
style.css
Normal file
@ -0,0 +1,312 @@
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #65BAFF;
|
||||
margin-top: 10px;
|
||||
background-image: linear-gradient(#65BAFF, #0081EA);
|
||||
}
|
||||
|
||||
main {
|
||||
width: 80%;
|
||||
max-width: 1024px;
|
||||
padding: 40px 0px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
#main-content {
|
||||
background-color: white;
|
||||
padding: 80px 5%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
|
||||
p,
|
||||
li,
|
||||
span,
|
||||
label,
|
||||
input,
|
||||
select option,
|
||||
strong,
|
||||
dt,
|
||||
dd {
|
||||
font-family: 'Trebuchet MS', sans-serif;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding-left: 8%;
|
||||
}
|
||||
|
||||
li {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*HEADER====================================*/
|
||||
|
||||
header {
|
||||
background-image: url(images/backdrop-grey.png);
|
||||
background-position: top;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
border-radius: 16px 16px 0px 0px;
|
||||
padding: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#site-logo {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.separator{
|
||||
background-image: linear-gradient(#DEDEDE, #6B6B6B);
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
|
||||
/*FOOTER=====================================*/
|
||||
|
||||
footer {
|
||||
background-color: black;
|
||||
padding: 30px;
|
||||
border-radius: 0px 0px 16px 16px;
|
||||
text-align: center
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*HEADLINES AND SPECIAL TEXT======================*/
|
||||
|
||||
h1 {
|
||||
font-family: 'Ubuntu', 'Trebuchet MS', Sans-Serif !important;
|
||||
font-size: 42px;
|
||||
color: #D8D8D8;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
h2 {
|
||||
font-family: 'Ubuntu', 'Trebuchet MS', Sans-Serif !important;
|
||||
font-size: 32px;
|
||||
color: #666666;
|
||||
display: inline;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
|
||||
h3 {
|
||||
font-family: 'Ubuntu', 'Trebuchet MS', Sans-Serif !important;
|
||||
color: #393939;
|
||||
font-size: 22px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.themed-text {
|
||||
font-family: 'Ubuntu', 'Trebuchet MS', Sans-Serif !important;
|
||||
color: #D8D8D8;
|
||||
font-weight: 400;
|
||||
text-shadow: -2px -2px 0 #3e3e3e, 2px -2px 0 #3e3e3e, -2px 2px 0 #3e3e3e, 2px 2px 0 #3e3e3e;
|
||||
/*-webkit-text-stroke-width: 1.7px;
|
||||
-webkit-text-stroke-color: #3e3e3e;
|
||||
background: -webkit-linear-gradient(#F0F0F0, #B2B2B2);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
*/
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*SECTIONS AND SECTION CONTENT============================*/
|
||||
|
||||
.section-headline {
|
||||
border-bottom: 1px solid #cccccc;
|
||||
margin-bottom: 30px;
|
||||
padding-bottom: 10px;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
||||
|
||||
.section-container {
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
|
||||
.sub-section {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
|
||||
.post-thumbnail {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.post-thumbnail-title {
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
|
||||
.post-sub-text {
|
||||
text-align: center;
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
||||
.container-bubble {
|
||||
background-color: #EBEBEB;
|
||||
border: 1px solid #bebebe;
|
||||
border-radius: 20px;
|
||||
padding: 30px;
|
||||
color: #767676;
|
||||
}
|
||||
|
||||
.banner {
|
||||
background-image: url(images/backdrop-grey.png);
|
||||
background-position: right;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.banner-text {
|
||||
/*font-size: 42px !important;*/
|
||||
font-size: calc(30px + 6 * ((100vw - 320px) / 680)) !important;
|
||||
}
|
||||
|
||||
.banner-button {
|
||||
width: 100%;
|
||||
max-width: 260px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
|
||||
/*BUTTONS AND LINKS==================================*/
|
||||
|
||||
|
||||
.btn-primary,
|
||||
.btn-primary:visited,
|
||||
.btn-primary:disabled,
|
||||
.btn-primary.disabled {
|
||||
background-color: #2A2A2A;
|
||||
border: 1px solid #2A2A2A !important;
|
||||
color: white;
|
||||
font-family: 'Trebuchet MS', sans-serif;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.btn-primary:hover,
|
||||
.btn-primary:focus {
|
||||
background-color: #212121;
|
||||
}
|
||||
|
||||
.btn-primary:active {
|
||||
background-color: #1d1d1d !important;
|
||||
}
|
||||
|
||||
|
||||
/*MISC ====================================*/
|
||||
|
||||
/*Social Icons*/
|
||||
.fa-discord {
|
||||
color: #5865F2;
|
||||
}
|
||||
|
||||
.fa-youtube {
|
||||
color: #FF0000;
|
||||
}
|
||||
|
||||
|
||||
/*Youtube Video Responsive Embeding*/
|
||||
.fluidMedia16x9 iframe {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: none;
|
||||
}
|
||||
|
||||
|
||||
.fluidMedia16x9 {
|
||||
position: relative;
|
||||
padding-bottom: 56.25%;
|
||||
/* proportion value to aspect ratio 16:9 (9 / 16 = 0.5625 or 56.25%) */
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
background-color: black;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*MEDIA QUERIES===============================*/
|
||||
|
||||
|
||||
/*Bootstrap Large Media Query*/
|
||||
@media only screen and (max-width: 991px) {}
|
||||
|
||||
|
||||
/*Mobile*/
|
||||
@media only screen and (max-width: 767px) {
|
||||
|
||||
main {
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
/*HEADLINES ----------------------*/
|
||||
|
||||
h1 {
|
||||
font-size: 42px;
|
||||
text-align: center
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
/*Mobile Small*/
|
||||
@media only screen and (max-width: 360px) {
|
||||
|
||||
main {
|
||||
width: 92%;
|
||||
}
|
||||
|
||||
#main-content {
|
||||
padding: 40px 5%;
|
||||
}
|
||||
|
||||
|
||||
/*HEADLINES ----------------------*/
|
||||
|
||||
h1 {
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
|
||||
.section-headline {
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
}
|