Browse Source

Implement changing logo image based on theme color using CSS background image

pull/1218/head
Chris Johnston Still Hsu 6 years ago
parent
commit
b6792b7688
No known key found for this signature in database GPG Key ID: 8601A145FDA95209
5 changed files with 27 additions and 4 deletions
  1. +5
    -1
      docs/_template/light-dark-theme/styles/dark.css
  2. +5
    -1
      docs/_template/light-dark-theme/styles/gray.css
  3. +5
    -1
      docs/_template/light-dark-theme/styles/light.css
  4. +9
    -0
      docs/_template/light-dark-theme/styles/master.css
  5. +3
    -1
      docs/index.md

+ 5
- 1
docs/_template/light-dark-theme/styles/dark.css View File

@@ -301,4 +301,8 @@ span.arrow-d{


span.arrow-r{ span.arrow-r{
border-left: 5px solid white border-left: 5px solid white
}
}

.logo-switcher {
background: url("/marketing/logo/SVG/Combinationmark White.svg") no-repeat;
}

+ 5
- 1
docs/_template/light-dark-theme/styles/gray.css View File

@@ -308,4 +308,8 @@ span.arrow-d{


span.arrow-r{ span.arrow-r{
border-left: 5px solid white border-left: 5px solid white
}
}

.logo-switcher {
background: url("/marketing/logo/SVG/Combinationmark White.svg") no-repeat;
}

+ 5
- 1
docs/_template/light-dark-theme/styles/light.css View File

@@ -110,4 +110,8 @@ span.arrow-d{


span.arrow-r{ span.arrow-r{
border-left: 5px solid black border-left: 5px solid black
}
}

.logo-switcher {
background: url("/marketing/logo/SVG/Combinationmark.svg") no-repeat;
}

+ 9
- 0
docs/_template/light-dark-theme/styles/master.css View File

@@ -32,6 +32,15 @@ img {
margin-bottom: 15px; margin-bottom: 15px;
} }


.big-logo {
display: block;
box-shadow: none !important;
/* Width value was taken from the original size of the combomark svg */
width: 951pt;
/* Height was arbitrarily determined */
min-height: 100pt;
}

article.content p{ article.content p{
-webkit-transition: all .75s ease-in-out; -webkit-transition: all .75s ease-in-out;
transition: all .75s ease-in-out; transition: all .75s ease-in-out;


+ 3
- 1
docs/index.md View File

@@ -5,6 +5,8 @@ title: Home


# Discord.Net Documentation # Discord.Net Documentation


<img class="big-logo logo-switcher" />

## What is Discord.Net? ## What is Discord.Net?


Discord.Net is an asynchronous, multi-platform .NET Library used to Discord.Net is an asynchronous, multi-platform .NET Library used to
@@ -25,4 +27,4 @@ objects in the library.
- [GitHub](https://github.com/RogueException/Discord.Net/) - [GitHub](https://github.com/RogueException/Discord.Net/)
- [NuGet](https://www.nuget.org/packages/Discord.Net/) - [NuGet](https://www.nuget.org/packages/Discord.Net/)
- [MyGet Feed](https://www.myget.org/feed/Packages/discord-net) - Add-ons and nightly builds - [MyGet Feed](https://www.myget.org/feed/Packages/discord-net) - Add-ons and nightly builds
- [AppVeyor CI](https://ci.appveyor.com/project/RogueException/discord-net) - Nightly builds via Continuous Integration
- [AppVeyor CI](https://ci.appveyor.com/project/RogueException/discord-net) - Nightly builds via Continuous Integration

Loading…
Cancel
Save