-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
d1f6d68
commit ebfb758
Showing
3 changed files
with
141 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,3 @@ | ||
| @font-face { font-family: 'DSans Regular'; src: url('https://dsans.davidstudios.uk/DSans_R.woff2') format('woff2'); } | ||
|
|
||
| @font-face { font-family: 'DSans Bold'; src: url('https://dsans.davidstudios.uk/DSans_B.woff2') format('woff2'); } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,44 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
|
|
||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <link rel="stylesheet" href="style.css"> | ||
| <title>DSans</title> | ||
| </head> | ||
|
|
||
| <body> | ||
| <center> | ||
| <span class="shadow"><span class="title">DSans.</span></span> | ||
| <br> | ||
| A font designed for websites. | ||
|
|
||
|
|
||
| <br><br> | ||
| <br> | ||
| <br><br><br><br><h1 name="info">What is DSans?</h1> | ||
| <br> DSans is a font designed for websites. It's a beautiful font meant to present a welcoming & comfortable experience for users. | ||
| <br><br><br><br><h1 name="why">Why use DSans?</h1> | ||
| <br>DSans is more <i>soft</i> than other fonts, and isn't jagged, so users feels your page is clean and sleek. | ||
| <br><br><br><br><h1 name="example">Example of DSans</h1> | ||
| <br>A showcase of what the DSans font looks like: | ||
| <br><p>AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz</p> | ||
| <br><p>The quick brown fox jumps over the lazy dog.</p> | ||
| <br> | ||
| <br> | ||
| <br>Numbers: 1234567890, characters: £ % ^ & * ( ! " ' # ? | ||
| <br><i>NOTE: Foreign characters (such as Japanese letters) may cause rendering issues. We recommend setting a fallback font in-case this happens. We are working on fixing it.</i> | ||
| <br><br><br><br><h1 name="get">How do I get DSans</h1> | ||
| Getting DSans is very simple. Just paste this code into your CSS style: | ||
| <br> | ||
| <samp>@import url('https://dsans.davidstudios.uk/css2');</samp> | ||
| <br><br> | ||
| When that is done, just define either <samp>"DSans Regular"</samp> or <samp>"DSans Bold"</samp> in your <code>font-family</code>. | ||
| <br> | ||
| <br><i>Please also consider placing a link back here with the text "This page uses the DSans font.".</i> Thanks if you do! ❤️ | ||
| <br><br><br><br><br><br><footer>This page & DSans is created by <a href="https://guilded.gg/u/d4vidthedev" target="_blank">D4vidthedev (David)</a> | ||
| <br>This site uses the <a href="https://dsans.davidstudios.uk" target="_blank">DSans font</a>.</footer> | ||
| </body> | ||
|
|
||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,94 @@ | ||
| @import url('https://dsans.davidstudios.uk/css2'); | ||
|
|
||
| body { | ||
| background-color: #151618; | ||
| color: whitesmoke; | ||
| font-family: 'DSans Regular', sans-serif; | ||
| } | ||
|
|
||
| samp { | ||
| font-family: "Segoe UI", monospace, sans-serif; | ||
| background-color: #444; | ||
| opacity: .75; | ||
| border-radius: 5px; | ||
| color: white; | ||
| } | ||
|
|
||
| h1 { | ||
| margin: 0; | ||
| color: whitesmoke; | ||
| font-size: 250%; | ||
| font-family: 'DSans Bold', sans-serif; | ||
| } | ||
|
|
||
| .title { | ||
| cursor: pointer; | ||
| border-radius: 8px; | ||
| color: white; | ||
| font-size: 6rem; | ||
| font-family: 'DSans Bold', sans-serif; | ||
| } | ||
|
|
||
| span { | ||
| transition: ease all 0.35s; | ||
| } | ||
|
|
||
| span:hover { | ||
| transition: ease all 0.35s; | ||
| font-size: 6.5rem; | ||
| } | ||
|
|
||
| .shadow { | ||
| background-color: #F5C400; | ||
| box-shadow: 0px 0px 8px 2px rgba(255, 255, 255, 0.525); | ||
| -webkit-box-shadow: 0px 0px 8px 2px rgba(255, 255, 255, 0.525); | ||
| } | ||
|
|
||
| button { | ||
| color: white; | ||
| border-radius: 5px; | ||
| font-family: 'DSans Bold', sans-serif; | ||
| padding-top: 15px; | ||
| padding-bottom: 15px; | ||
| padding-right: 70px; | ||
| padding-left: 70px; | ||
| outline: none; | ||
| border: none; | ||
| background-color: #F5C400; | ||
| transition: ease all 0.35s; | ||
| } | ||
|
|
||
| button:hover { | ||
| color: #F5C400; | ||
| cursor: pointer; | ||
| transition: ease all 0.5s; | ||
| background-color: #151618; | ||
| box-shadow: 0px 0px 8px 2px rgba(255, 255, 255, 0.525); | ||
| -webkit-box-shadow: 0px 0px 8px 2px rgba(255, 255, 255, 0.525); | ||
| } | ||
|
|
||
| a { | ||
| color: #00ff73; | ||
| cursor: pointer; | ||
| font-family: 'DSans Bold', sans-serif; | ||
| transition: ease all 0.25s; | ||
| } | ||
|
|
||
| a:hover { | ||
| color: #2883eb; | ||
| cursor: pointer; | ||
| transition: ease all 0.25s; | ||
| } | ||
|
|
||
|
|
||
| nav { | ||
| display: flex; | ||
| height: 55px; | ||
| width: 100%; | ||
| background: #0f0f10; | ||
| align-items: center; | ||
| justify-content: space-between; | ||
| padding: 0 50px 0 100px; | ||
| flex-wrap: wrap; | ||
| animation: pageShow .7s ease-in-out; | ||
| } |