Repository: hydralauncher/hydra-themes
Pull request #463: Naruto
Author: login: weguer
Created: 2025-05-16T01:40:35Z | Merged: 2025-05-18T03:26:02Z



Diff:
diff --git a/themes/Naruto-xy0GM14j/Screenshot.png b/themes/Naruto-xy0GM14j/Screenshot.png
new file mode 100644
index 00000000..45e6042c
Binary files /dev/null and b/themes/Naruto-xy0GM14j/Screenshot.png differ
diff --git a/themes/Naruto-xy0GM14j/theme.css b/themes/Naruto-xy0GM14j/theme.css
new file mode 100644
index 00000000..b093f02f
--- /dev/null
+++ b/themes/Naruto-xy0GM14j/theme.css
@@ -0,0 +1,204 @@
+@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
+@import url('https://db.onlinewebfonts.com/c/73fedd912ba11f583a359ce4c2e742ed?family=Ninja+Naruto+V1');
+
+* {
+  font-weight: bold;
+  color: white;
+}
+
+.sidebar,
+.header,
+.container__content,
+.bottom-panel {
+  background: transparent;
+}
+
+.title-bar {
+  font-size: 22px;
+  font-family: 'Ninja Naruto V1', sans-serif;
+  -webkit-text-stroke: 1px black;
+  color: rgba(165, 165, 165, 0.842);
+  display: flex;
+  border-radius: 10px;
+  background: transparent;
+  justify-content: center;
+  align-items: center;
+  text-align: center;
+  position: absolute;
+  left: 112px;
+  top: 15px;
+  border: 0.1px solid rgba(167, 167, 167, 0.74);
+  width: 225px;
+  height: auto;
+  margin: 0;
+}
+
+.sidebar-profile__button {
+  background-color: rgba(0, 0, 0, 0.288);
+  border-radius: 10px;
+  position: relative;
+  top: 50px;
+}
+
+.sidebar__content {
+  overflow: auto;
+  top: 60px;
+  display: flex;
+  position: relative;
+}
+
+#root {
+  background: url(https://i.imgur.com/XxMgOET.png) top no-repeat;
+  background-size: cover;
+}
+
+.text-field-container__text-field--primary,
+.game-item,
+.settings__content,
+.catalogue__filters-container,
+.friends-box__box,
+.user-stats__box,
+.recent-games__box,
+.sidebar {
+  background-color: rgba(68, 65, 65, 0.5) !important;
+  backdrop-filter: blur(5px);
+}
+
+.sidebar {
+  position: relative;
+  padding-top: 40px;
+}
+
+.header--is-windows {
+  position: relative;
+  display: flex;
+  justify-content: flex-end;
+  padding: 10px;
+}
+
+.header__search {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 10px;
+  padding: 10px;
+  width: 100%;
+  max-width: 200px;
+  box-sizing: border-box;
+  margin-right: 200px;
+}
+
+@media (max-width: 768px) {
+  .header__search {
+    width: 80%;
+    margin-right: 10px;
+  }
+}
+
+.text-field-container__text-field--dark {
+  background-color: rgba(0, 0, 0, 0.719) !important;
+  border: 1px solid rgba(255, 255, 255, 0.473);
+}
+
+.settings__content {
+  color: white;
+}
+
+.settings__categories {
+  display: flex;
+  flex-wrap: wrap;
+  position: relative;
+  border-radius: 10px;
+  padding: 10px;
+  box-sizing: border-box;
+  margin-right: 20px;
+  gap: 10px;
+}
+
+.settings__categories > * {
+  flex: 1 1 200px;
+  min-width: 150px;
+}
+
+@media (max-width: 768px) {
+  .settings__categories {
+    flex-direction: column;
+    gap: 20px;
+    margin-right: 10px;
+  }
+
+  .settings__categories > * {
+    width: 100%;
+  }
+}
+
+.container__content .button--outline {
+  backdrop-filter: blur(8px);
+  background-color: rgba(0, 0, 0, 0.747);
+}
+
+.button--primary {
+  color: rgba(255, 255, 255, 0.829);
+  background-color: rgba(71, 70, 70, 0.644);
+  border: 0.2px solid rgba(255, 253, 253, 0.637);
+  transition: background-color 0.5s ease, color 0.5s ease, border-color 0.5s ease, fill 0.5s ease;
+}
+
+.button:hover {
+  background-color: rgba(7, 7, 7, 0.829);
+  color: white;
+  border: 0.2px solid rgba(255, 255, 255, 0.637);
+  transition: background-color 0.9s ease, color 0.9s ease, border-color 0.9s ease, fill 0.9s ease;
+}
+
+.button:hover svg {
+  fill: rgba(255, 255, 255, 0.87);
+  transition: fill 0.9s ease;
+}
+
+.settings-download-sources__item,
+.download-group__item,
+.game-item {
+  background-color: black !important;
+  transition: background-color 0.9s ease, border-color 0.9s ease, fill 0.9s ease;
+  border-radius: 10px;
+}
+
+::-webkit-scrollbar {
+  width: 0px;
+  height: 0px;
+}
+
+.theme-card {
+  background-color: black;
+}
+
+.profile-content__right-content {
+  background: none;
+}
+
+.user-stats__box {
+  border-radius: 10px;
+  color: white;
+}
+
+.recent-games__box,
+.friends-box__box {
+  border-radius: 10px;
+}
+
+.user-stats__section-header,
+.recent-games__section-header,
+.friends-box__section-header {
+  background-color: black;
+  padding: 8px;
+  position: relative;
+  border-radius: 10px;
+  display: block;
+  text-align: center;
+}
+
+.friends-box__section-header {
+  display: flex;
+  align-items: center;
+}


Reviews:
user: login: greptile-apps[bot]
body: 
## PR Summary

Added a new Naruto theme featuring a custom ninja font and responsive design elements with blur effects and dark overlays.

- Added custom `Ninja Naruto V1` font styling for title bar with text stroke effects and positioning at `/themes/Naruto-xy0GM14j/theme.css`
- Implemented responsive header search with media queries for different screen sizes
- Added backdrop-filter blur effects (5px) with semi-transparent backgrounds (rgba(68, 65, 65, 0.5)) for UI components
- Added black background with rounded corners (10px) for section headers in user stats, recent games, and friends box
- Configured sidebar positioning with 60px top offset and scrollable content

<sub>💡 (2/5) Greptile learns from your feedback when you react with 👍/👎!</sub>

<sub>1 file(s) reviewed, 3 comment(s)</sub>
<sub>[Edit PR Review Bot Settings](https://app.greptile.com/review/github) | [Greptile](https://greptile.com?utm_source=greptile_expert&utm_medium=github&utm_campaign=code_reviews&utm_content=hydra-themes_463)</sub>
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-05-16T01:41:48Z

Review comments:
diff_hunk: @@ -0,0 +1,221 @@
+@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
+@import url('https://db.onlinewebfonts.com/c/73fedd912ba11f583a359ce4c2e742ed?family=Ninja+Naruto+V1');
+
+* {
+  font-weight: bold;
+  color: white;
+}
+
+.sidebar,
+.header,
+.container__content,
+.bottom-panel {
+  background: transparent;
+}
+
+.title-bar {
+  font-size: 22px;
+  font-family: 'Ninja Naruto V1', sans-serif;
+  color: white;
+  -webkit-text-stroke: 1px black;
+  color: #3a3a39;
+  display: flex;
+  border-radius: 10px;
+  background: transparent;
+  justify-content: center;
+  position: absolute;
+  align-items: center;
+  text-align: center;
+  left: 112px;
+  top: 15px;
+  color: rgba(165, 165, 165, 0.842);
+  border: 0.1px solid rgba(167, 167, 167, 0.74);
+  width: 225px;
+  height: auto;
+  margin: 0;
+}
path: themes/Naruto-xy0GM14j/theme.css
user: login: greptile-apps[bot]
body: logic: Multiple color declarations for .title-bar (lines 19, 21, 31). Last declaration overrides previous ones.

```suggestion
.title-bar {
  font-size: 22px;
  font-family: 'Ninja Naruto V1', sans-serif;
  -webkit-text-stroke: 1px black;
  display: flex;
  border-radius: 10px;
  background: transparent;
  justify-content: center;
  position: absolute;
  align-items: center;
  text-align: center;
  left: 112px;
  top: 15px;
  color: rgba(165, 165, 165, 0.842);
  border: 0.1px solid rgba(167, 167, 167, 0.74);
  width: 225px;
  height: auto;
  margin: 0;
}
```
created_at: 2025-05-16T01:41:12Z
author_association: CONTRIBUTOR
diff_hunk: @@ -0,0 +1,221 @@
+@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
+@import url('https://db.onlinewebfonts.com/c/73fedd912ba11f583a359ce4c2e742ed?family=Ninja+Naruto+V1');
+
+* {
+  font-weight: bold;
+  color: white;
+}
+
+.sidebar,
+.header,
+.container__content,
+.bottom-panel {
+  background: transparent;
+}
+
+.title-bar {
+  font-size: 22px;
+  font-family: 'Ninja Naruto V1', sans-serif;
+  color: white;
+  -webkit-text-stroke: 1px black;
+  color: #3a3a39;
+  display: flex;
+  border-radius: 10px;
+  background: transparent;
+  justify-content: center;
+  position: absolute;
+  align-items: center;
+  text-align: center;
+  left: 112px;
+  top: 15px;
+  color: rgba(165, 165, 165, 0.842);
+  border: 0.1px solid rgba(167, 167, 167, 0.74);
+  width: 225px;
+  height: auto;
+  margin: 0;
+}
+
+.sidebar-profile__button {
+  background-color: rgba(0, 0, 0, 0.288);
+  border-radius: 10px;
+  top: 50px;
+  position: relative;
+}
+
+.sidebar__content {
+  overflow: scroll;
+  top: 60px;
path: themes/Naruto-xy0GM14j/theme.css
user: login: greptile-apps[bot]
body: style: overflow: scroll without overflow-x/y specification may cause unwanted scrollbars. Consider using 'auto' or specifying axis.
created_at: 2025-05-16T01:41:13Z
author_association: CONTRIBUTOR
diff_hunk: @@ -0,0 +1,221 @@
+@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
+@import url('https://db.onlinewebfonts.com/c/73fedd912ba11f583a359ce4c2e742ed?family=Ninja+Naruto+V1');
+
+* {
+  font-weight: bold;
+  color: white;
+}
+
+.sidebar,
+.header,
+.container__content,
+.bottom-panel {
+  background: transparent;
+}
+
+.title-bar {
+  font-size: 22px;
+  font-family: 'Ninja Naruto V1', sans-serif;
+  color: white;
+  -webkit-text-stroke: 1px black;
+  color: #3a3a39;
+  display: flex;
+  border-radius: 10px;
+  background: transparent;
+  justify-content: center;
+  position: absolute;
+  align-items: center;
+  text-align: center;
+  left: 112px;
+  top: 15px;
+  color: rgba(165, 165, 165, 0.842);
+  border: 0.1px solid rgba(167, 167, 167, 0.74);
+  width: 225px;
+  height: auto;
+  margin: 0;
+}
+
+.sidebar-profile__button {
+  background-color: rgba(0, 0, 0, 0.288);
+  border-radius: 10px;
+  top: 50px;
+  position: relative;
+}
+
+.sidebar__content {
+  overflow: scroll;
+  top: 60px;
+  display: flex;
+  position: relative;
+}
+
+#root {
+  background: url(https://i.imgur.com/XxMgOET.png);
+  background-position: top;
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+
+.text-field-container__text-field--primary,
+.game-item,
+.settings__content,
+.catalogue__filters-container,
+.friends-box__box,
+.user-stats__box,
+.recent-games__box,
+.sidebar {
+  background-color: rgba(68, 65, 65, 0.5) !important;
+  backdrop-filter: blur(5px);
+}
+
+.sidebar {
+  position: relative;
+  padding-top: 40px;
+}
+
+.header--is-windows {
+  position: relative;
+  display: flex;
+  justify-content: flex-end;
+  padding: 10px;
+}
+
+.header__search {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 10px;
+  padding: 10px;
+  width: 100%;
+  max-width: 200px;
+  box-sizing: border-box;
+  margin-right: 200px;
+}
+
+@media (max-width: 768px) {
+  .header__search {
+    width: 80%;
+    margin-right: 10px;
+  }
+}
+
+.text-field-container__text-field--dark {
+  background-color: rgba(0, 0, 0, 0.719) !important;
+  border: 1px solid rgba(255, 255, 255, 0.473);
+}
+
+.settings__content {
+  color: rgb(255, 255, 255);
+}
+
+.settings__categories {
+  display: flex;
+  flex-wrap: wrap;
+  position: relative;
+  border-radius: 10px;
+  padding: 10px;
+  box-sizing: border-box;
+  margin-right: 20px;
+  gap: 10px;
+}
+
+.settings__categories > * {
+  flex: 1 1 200px;
+  min-width: 150px;
+}
+
+@media (max-width: 768px) {
+  .settings__categories {
+    flex-direction: column;
+    gap: 20px;
+    margin-right: 10px;
+  }
+
+  .settings__categories > * {
+    width: 100%;
+  }
+}
+
+.container__content .button--outline {
+  backdrop-filter: blur(8px);
+  background-color: rgba(0, 0, 0, 0.747);
+}
+
+.button--primary {
+  color: rgba(255, 255, 255, 0.829);
+  background-color: rgba(71, 70, 70, 0.644);
+  border: 0.2px solid rgba(255, 253, 253, 0.637);
+  transition: background-color 0.5s ease, color 0.5s ease, border-color 0.5s ease, fill 0.5s ease;
+}
+
+.button:hover {
+  background-color: rgba(7, 7, 7, 0.829);
+  color: rgb(255, 255, 255);
+  border: 0.2px solid rgba(255, 255, 255, 0.637);
+  transition: background-color 0.9s ease, color 0.9s ease, border-color 0.9s ease, fill 0.9s ease;
+}
+
+.settings-download-sources__item,
+.download-group__item,
+.game-item {
+  background-color: rgb(0, 0, 0) !important;
+  transition: background-color 0.9s ease, border-color 0.9s ease, fill 0.9s ease;
+  border-radius: 10px;
+}
+
+.button:hover svg {
+  fill: rgba(255, 255, 255, 0.87);
+  transition: fill 0.9s ease;
+}
+
+::-webkit-scrollbar {
+  width: 0px;
+  height: 0px;
+}
+
+.theme-card {
+  background-color: rgb(0, 0, 0);
+}
+
+.profile-content__right-content {
+  background: none;
+}
+
+.user-stats__box {
+  border-radius: 10px;
+  color: whi;
+}
path: themes/Naruto-xy0GM14j/theme.css
user: login: greptile-apps[bot]
body: syntax: Invalid color value 'whi' - appears to be a typo

```suggestion
.user-stats__box {
  border-radius: 10px;
  color: white;
}
```
created_at: 2025-05-16T01:41:14Z
author_association: CONTRIBUTOR

PR comments:
user: login: sonarqubecloud[bot]
created_at: 2025-05-18T03:22:56Z
body: ## [![Quality Gate Passed](https://sonarsource.github.io/sonarcloud-github-static-resources/v2/checks/QualityGateBadge/qg-passed-20px.png 'Quality Gate Passed')](https://sonarcloud.io/dashboard?id=hydralauncher_hydra-themes&pullRequest=463) **Quality Gate passed**  
Issues  
![](https://sonarsource.github.io/sonarcloud-github-static-resources/v2/common/passed-16px.png '') [0 New issues](https://sonarcloud.io/project/issues?id=hydralauncher_hydra-themes&pullRequest=463&issueStatuses=OPEN,CONFIRMED&sinceLeakPeriod=true)  
![](https://sonarsource.github.io/sonarcloud-github-static-resources/v2/common/accepted-16px.png '') [0 Accepted issues](https://sonarcloud.io/project/issues?id=hydralauncher_hydra-themes&pullRequest=463&issueStatuses=ACCEPTED)

Measures  
![](https://sonarsource.github.io/sonarcloud-github-static-resources/v2/common/passed-16px.png '') [0 Security Hotspots](https://sonarcloud.io/project/security_hotspots?id=hydralauncher_hydra-themes&pullRequest=463&issueStatuses=OPEN,CONFIRMED&sinceLeakPeriod=true)  
![](https://sonarsource.github.io/sonarcloud-github-static-resources/v2/common/passed-16px.png '') [0.0% Coverage on New Code](https://sonarcloud.io/component_measures?id=hydralauncher_hydra-themes&pullRequest=463&metric=new_coverage&view=list)  
![](https://sonarsource.github.io/sonarcloud-github-static-resources/v2/common/passed-16px.png '') [0.0% Duplication on New Code](https://sonarcloud.io/component_measures?id=hydralauncher_hydra-themes&pullRequest=463&metric=new_duplicated_lines_density&view=list)  
  
[See analysis details on SonarQube Cloud](https://sonarcloud.io/dashboard?id=hydralauncher_hydra-themes&pullRequest=463)


author_association: NONE