From 864344d25bce4e9c36291afe9355da822372ad09 Mon Sep 17 00:00:00 2001 From: Jason <38664452+uchks@users.noreply.github.com> Date: Sat, 5 Oct 2024 23:17:04 -0500 Subject: [PATCH] css --- depictions/web/changelog.html | 120 +++++----- depictions/web/com.example.newsample/info.xml | 2 +- depictions/web/index.html | 91 +------ depictions/web/screenshots.html | 127 +++++----- depictions/web/style.css | 32 --- index.html | 65 ----- style.css | 222 ++++++++++++++++++ 7 files changed, 340 insertions(+), 319 deletions(-) delete mode 100644 depictions/web/style.css create mode 100644 style.css diff --git a/depictions/web/changelog.html b/depictions/web/changelog.html index 9b3df9a4..ecd912ed 100644 --- a/depictions/web/changelog.html +++ b/depictions/web/changelog.html @@ -18,25 +18,22 @@ crossorigin="anonymous" referrerpolicy="no-referrer" /> - - - - - - + + + + -
-
-
+
+
+

Changelog

+
+
+ +
+
+
+ - -
-
CONTACT
- +

Contact

+
+ +
- diff --git a/depictions/web/com.example.newsample/info.xml b/depictions/web/com.example.newsample/info.xml index 776022a3..877442aa 100644 --- a/depictions/web/com.example.newsample/info.xml +++ b/depictions/web/com.example.newsample/info.xml @@ -39,7 +39,7 @@ /r/jailbreak https://www.reddit.com/r/jailbreak - fa fa-reddit + fa-brands fa-reddit \ No newline at end of file diff --git a/depictions/web/index.html b/depictions/web/index.html index d0bf0372..c194141f 100644 --- a/depictions/web/index.html +++ b/depictions/web/index.html @@ -24,100 +24,11 @@ crossorigin="anonymous" referrerpolicy="no-referrer" > + - - - - - - + + + + -
-
+
+
+

Screenshots

+
+
+
-
SCREENSHOTS
- +
+ - -
-
CONTACT
- +

Contact

+
+ +
- diff --git a/depictions/web/style.css b/depictions/web/style.css deleted file mode 100644 index 25279d01..00000000 --- a/depictions/web/style.css +++ /dev/null @@ -1,32 +0,0 @@ -.disable-hover { - pointer-events: none; -} - -.link-item { - list-style-type: none; - padding: 17px 15px; - display: block; - color: #337ab7 !important; - text-align: left; -} - -.link-item:hover { - border: 1px solid #ddd; - background-color: #f5f5f5; -} - -html.can-touch .link-item:hover { - /* disable hover effect when input is touch */ - background-color: #fff; -} - -html.can-touch .link-item:active { - /* disable hover effect when input is touch */ - background-color: #f5f5f5; -} - -.fa { - font-size: 16px; - margin-left: 5px; - margin-right: 10px; -} diff --git a/index.html b/index.html index 07662c89..bd022f59 100755 --- a/index.html +++ b/index.html @@ -19,71 +19,6 @@ referrerpolicy="no-referrer" /> -
diff --git a/style.css b/style.css new file mode 100644 index 00000000..993195cf --- /dev/null +++ b/style.css @@ -0,0 +1,222 @@ +body { + background-color: #f8f9fa; + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, + "Helvetica Neue", Arial, sans-serif; +} + +.package-header { + background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%); + color: white; + padding: 3rem 0; + margin-bottom: 2rem; +} + +.package-header h1 { + margin: 0; + font-weight: 700; +} + +.package-header p { + margin: 0.5rem 0 0; + opacity: 0.9; +} + +.repo-header { + background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%); + color: white; + padding: 3rem 0; + margin-bottom: 2rem; +} + +.repo-header img { + width: 64px; + height: 64px; + margin-right: 1rem; + border-radius: 12px; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); +} + +.repo-header h1 { + margin: 0; + font-weight: 700; +} + +.changelog-header { + background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%); + color: white; + padding: 3rem 0; + margin-bottom: 2rem; +} + +.changelog-header h1 { + margin: 0; + font-weight: 700; +} + +.screenshots-header { + background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%); + color: white; + padding: 3rem 0; + margin-bottom: 2rem; +} + +.screenshots-header h1 { + margin: 0; + font-weight: 700; +} + +.screenshot-grid { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); + gap: 1.5rem; + margin-bottom: 2rem; +} + +.screenshot-card { + border: none; + border-radius: 12px; + overflow: hidden; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); + transition: transform 0.2s, box-shadow 0.2s; + background: white; +} + +.screenshot-card:hover { + transform: translateY(-2px); + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); +} + +.screenshot-image { + width: 100%; + height: auto; + object-fit: cover; +} + +.screenshot-caption { + padding: 1rem; + color: #4b5563; + font-size: 0.875rem; + text-align: center; +} + +.card { + border: none; + border-radius: 12px; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); + margin-bottom: 1.5rem; + transition: transform 0.2s; +} + +.card:hover { + transform: translateY(-2px); +} + +.card-header { + background-color: #fff; + border-bottom: 1px solid rgba(0, 0, 0, 0.05); + font-weight: 600; + padding: 1rem 1.25rem; +} + +.section-title { + color: #111827; + font-weight: 700; + font-size: 1.25rem; + margin-bottom: 1rem; +} + +.list-group { + border-radius: 12px; + overflow: hidden; +} + +.list-group-item { + border: none; + border-bottom: 1px solid rgba(0, 0, 0, 0.05); + padding: 1rem 1.25rem; +} + +.list-group-item:last-child { + border-bottom: none; +} + +.link-item { + color: #4f46e5; + text-decoration: none; + display: flex; + align-items: center; + gap: 0.5rem; +} + +.link-item:hover { + background-color: #f8f9fa; + color: #4338ca; +} + +.badge { + background-color: #4f46e5; + color: white; + font-weight: 600; + padding: 0.5em 1em; + border-radius: 6px; +} + +.alert { + border: none; + border-radius: 12px; + padding: 1rem 1.25rem; +} + +.alert-danger { + background-color: #fee2e2; + color: #991b1b; +} + +.version-tag { + display: inline-block; + background-color: #4f46e5; + color: white; + font-size: 0.875rem; + font-weight: 600; + padding: 0.25rem 0.75rem; + border-radius: 6px; + margin-bottom: 0.5rem; +} + +.changelog-date { + color: #6b7280; + font-size: 0.875rem; +} + +.changelog-entry { + margin-bottom: 2rem; +} + +.changelog-entry ul { + margin-bottom: 0; + padding-left: 1.25rem; +} + +.btn-primary { + background-color: #4f46e5; + border-color: #4f46e5; + padding: 0.5rem 1rem; + border-radius: 8px; + margin: 0.25rem; +} + +.btn-primary:hover { + background-color: #4338ca; + border-color: #4338ca; +} + +#contactInfo { + margin-top: 3rem; + padding-bottom: 2rem; +} + +@media (max-width: 768px) { + .screenshot-grid { + grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); + } +}