summaryrefslogtreecommitdiff
path: root/src/css/ghrepo.css
diff options
context:
space:
mode:
Diffstat (limited to 'src/css/ghrepo.css')
-rw-r--r--src/css/ghrepo.css538
1 files changed, 269 insertions, 269 deletions
diff --git a/src/css/ghrepo.css b/src/css/ghrepo.css
index 101caf9a..e631ddac 100644
--- a/src/css/ghrepo.css
+++ b/src/css/ghrepo.css
@@ -10,414 +10,414 @@
/* @media (prefers-color-scheme: dark) { */
:root {
- --text: #e5e5e5;
- --accent: #1688f0;
- --bg-main: #000;
- --bg-repo: #0f0f1a;
- --bg-user: #0a0a0f;
- --purple: rgb(123, 31, 162);
- --violet: rgb(103, 58, 183);
- --pink: rgb(244, 143, 177);
- --light-yellow: rgb(255, 255, 204);
- --pale-yellow: rgb(255, 255, 153);
- --lemon-yellow: rgb(255, 250, 205);
- }
+ --text: #e5e5e5;
+ --accent: #1688f0;
+ --bg-main: #000;
+ --bg-repo: #0f0f1a;
+ --bg-user: #0a0a0f;
+ --purple: rgb(123, 31, 162);
+ --violet: rgb(103, 58, 183);
+ --pink: rgb(244, 143, 177);
+ --light-yellow: rgb(255, 255, 204);
+ --pale-yellow: rgb(255, 255, 153);
+ --lemon-yellow: rgb(255, 250, 205);
+ }
/* } */
* {
- box-sizing: border-box;
- /* background-image: url(/images/backgroundNightCity.jpg); */
- background: transparent;
+ box-sizing: border-box;
+ /* background-image: url(/images/backgroundNightCity.jpg); */
+ background: transparent;
}
body {
- margin: 0;
- margin-top: (3em);
- font-family: 'Open Sans', sans-serif;
+ margin: 0;
+ margin-top: (3em);
+ font-family: 'Open Sans', sans-serif;
}
main {
- margin-top: 3em
+margin-top: 3em
}
.bgWrap {
- overflow: hidden;
- top: 0;
- left: 0;
- margin: 0;
- padding: 0;
- width: 100%;
- height: 100%;
- background-color: rgb(48, 60, 100);
- background-image: url(/images/heigh-grass.jpg);
- background-position: center;
- background-repeat: no-repeat;
- background-size: cover;
- align-items: center;
- display: flex;
- justify-content: center;
- color: #F4E8C1;
- z-index: -1;
- font-size: 16px;
+ overflow: hidden;
+ top: 0;
+ left: 0;
+ margin: 0;
+ padding: 0;
+ width: 100%;
+ height: 100%;
+ background-color: rgb(48, 60, 100);
+ background-image: url(/images/heigh-grass.jpg);
+ background-position: center;
+ background-repeat: no-repeat;
+ background-size: cover;
+ align-items: center;
+ display: flex;
+ justify-content: center;
+ color: #F4E8C1;
+ z-index: -1;
+ font-size: 16px;
}
.container {
- display: flex;
- justify-content: center;
- flex-direction: row;
- flex-wrap: wrap;
- align-items: center;
- width: 90%;
- max-width: 1280px;
- /* background: transparent; */
- position: center;
+ display: flex;
+ justify-content: center;
+ flex-direction: row;
+ flex-wrap: wrap;
+ align-items: center;
+ width: 90%;
+ max-width: 1280px;
+ /* background: transparent; */
+ position: center;
}
.container small, h1 {
- background: transparent;
+background: transparent;
}
.hide {
- /* '!important' is to make sure that when we add the class using JS, it takes precendence */
- display: none !important;
+ /* '!important' is to make sure that when we add the class using JS, it takes precendence */
+ display: none !important;
}
h1 {
- color: var(--accent);
- margin-bottom: 4px;
+ color: var(--accent);
+ margin-bottom: 4px;
}
small {
- width: 100%;
- text-align: center;
- display: block;
- margin-bottom: 20px;
+ width: 100%;
+ text-align: center;
+ display: block;
+ margin-bottom: 20px;
}
h2 {
- width: 100%;
- text-align: center;
- color: var(--text);
- margin: 0;
+ width: 100%;
+ text-align: center;
+ color: var(--text);
+ margin: 0;
}
a {
- background: transparent;
- color: var(--accent);
- text-decoration: none;
- -webkit-transition: background 0.5s
+ background: transparent;
+ color: var(--accent);
+ text-decoration: none;
+ -webkit-transition: background 0.5s
}
.github-img {
- width: 45px;
- margin-right: 8px;
+ width: 45px;
+ margin-right: 8px;
}
ul {
- list-style: none;
- padding: 0;
+ list-style: none;
+ padding: 0;
}
.user-info * {
- background: transparent;
+background: transparent;
}
.user-info {
- display: flex;
- flex-wrap: wrap;
- justify-content: center;
- /* background-image: url(/images/backgroundNightCity.jpg); */
- background: transparent;
- background-position: center;
- background-repeat: no-repeat;
- background-size: cover;
- color: var(--text);
- font-size: 18px;
- padding: 2em;
- border-radius: 16px;
- /* border: 0.1px solid var(--accent); */
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: center;
+ /* background-image: url(/images/backgroundNightCity.jpg); */
+ background: transparent;
+ background-position: center;
+ background-repeat: no-repeat;
+ background-size: cover;
+ color: var(--text);
+ font-size: 18px;
+ padding: 2em;
+ border-radius: 16px;
+ /* border: 0.1px solid var(--accent); */
}
.user-info figure {
- width: 90%;
- max-width: 250px;
- background: transparent;
+ width: 90%;
+ max-width: 250px;
+ background: transparent;
}
.user-info img {
- border: 2px solid var(--accent);
- box-shadow: 0 0px 6px var(--accent), 0 0px 6px var(--accent);
- max-width: 100%;
- height: auto;
- box-shadow: 0 0 10mm rgba(0,0,0,.7);
- border-radius: 100%;
+ border: 2px solid var(--accent);
+ box-shadow: 0 0px 6px var(--accent), 0 0px 6px var(--accent);
+ max-width: 100%;
+ height: auto;
+ box-shadow: 0 0 10mm rgba(0,0,0,.7);
+ border-radius: 100%;
}
.user-info img:hover {
- transform: scale(1.1);
- box-shadow: 0 0 100mm rgba(255, 238, 16,.7);
+transform: scale(1.1);
+box-shadow: 0 0 100mm rgba(255, 238, 16,.7);
}
.user-info div {
- display: flex;
- text-align: center;
- flex-wrap: wrap;
- align-items: center;
- width: 100%;
- padding-left: 5%;
+ display: flex;
+ text-align: center;
+ flex-wrap: wrap;
+ align-items: center;
+ width: 100%;
+ padding-left: 5%;
}
.user-info div p {
- width: 100%;
- margin: 0;
- padding: 0;
- border-bottom: 1px solid var(--text);
- padding-bottom: 18px;
- background: transparent;
+ width: 100%;
+ margin: 0;
+ padding: 0;
+ border-bottom: 1px solid var(--text);
+ padding-bottom: 18px;
+ background: transparent;
}
.user-info *:hover {
- transform: scale(1.1);
+ transform: scale(1.1);
}
.user-info .usertitle {
- font-family: audiowide;
- text-transform: uppercase;
- font-size: 2vw;
+font-family: audiowide;
+text-transform: uppercase;
+font-size: 2vw;
}
.filter-repos,
input {
- background: rgba(10, 10, 15, 0.3);
- width: 50%;
- border-radius: 20px;
- min-width: 300px;
- margin-top: 1em;
- padding: 1em;
- margin-bottom: 1em;
- border: 2px solid var(--accent);
- box-shadow: 0 0 10mm rgba(0,0,0,.7);
- text-align: center;
- -webkit-transition: all 0.5s
+ background: rgba(10, 10, 15, 0.3);
+ width: 50%;
+ border-radius: 20px;
+ min-width: 300px;
+ margin-top: 1em;
+ padding: 1em;
+ margin-bottom: 1em;
+ border: 2px solid var(--accent);
+ box-shadow: 0 0 10mm rgba(0,0,0,.7);
+ text-align: center;
+ -webkit-transition: all 0.5s
}
input:hover,
.filter-repos:hover {
- /* background: rgba(10, 10, 15, 0.5); */
- transition: all 0.5s;
- -moz-filter: blur(5px);
- -o-filter: blur(5px);
- -ms-filter: blur(5px);
- -webkit-backdrop-filter: blur(5px);
- backdrop-filter: blur(5px);
- box-shadow: 0 0 50mm rgba(0,0,0,.7);
- transform: scale(1.1);
- transition: all 0.5s;
+/* background: rgba(10, 10, 15, 0.5); */
+transition: all 0.5s;
+-moz-filter: blur(5px);
+-o-filter: blur(5px);
+-ms-filter: blur(5px);
+-webkit-backdrop-filter: blur(5px);
+backdrop-filter: blur(5px);
+box-shadow: 0 0 50mm rgba(0,0,0,.7);
+transform: scale(1.1);
+transition: all 0.5s;
}
input:active,
.filter-repos:active {
- /* background: #F4E8C1; */
- box-shadow: 0 0 10mm rgba(0,0,0,.7);
- background: rgba(244, 232, 193, 0.3);
+/* background: #F4E8C1; */
+box-shadow: 0 0 10mm rgba(0,0,0,.7);
+background: rgba(244, 232, 193, 0.3);
}
.repos {
- display: flex;
- flex-wrap: wrap;
- justify-content: center;
- background: rgba(128, 128, 128, 0.2);
- margin-top: 0;
- padding: 2em;
- /* border-bottom-left-radius: 20px; */
- /* border-bottom-right-radius: 20px; */
- border-radius: 16px;
- /* border: 0.1px solid var(--accent); */
- margin-bottom: 4em;
- /* box-shadow: 0 0 10mm rgba(0,0,0,.7); */
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: center;
+ background: rgba(128, 128, 128, 0.2);
+ margin-top: 0;
+ padding: 2em;
+ /* border-bottom-left-radius: 20px; */
+ /* border-bottom-right-radius: 20px; */
+ border-radius: 16px;
+ /* border: 0.1px solid var(--accent); */
+ margin-bottom: 4em;
+ /* box-shadow: 0 0 10mm rgba(0,0,0,.7); */
}
.repos:hover {
- background: rgba(0, 0, 0, 0.3);
- transform: scale(1.01);
- box-shadow: 0 0 20mm rgba(128,128,128,.7);
- transition: all 0.5s;
+background: rgba(0, 0, 0, 0.3);
+transform: scale(1.01);
+box-shadow: 0 0 20mm rgba(128,128,128,.7);
+transition: all 0.5s;
}
.repo-title {
- margin: 4px;
- width: 100%;
- text-align: center;
- color: var(--accent);
+ margin: 4px;
+ width: 100%;
+ text-align: center;
+ color: var(--accent);
}
.repo-list {
- width: 100%;
- display: flex;
- flex-wrap: wrap;
- justify-content: center;
- align-items: flex-start;
- background: transparent;
- scroll-snap-type: y mandatory;
- /* background: rgba(128, 128, 128, 0.2); */
+ width: 100%;
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: center;
+ align-items: flex-start;
+ background: transparent;
+ scroll-snap-type: y mandatory;
+ /* background: rgba(128, 128, 128, 0.2); */
}
.repo-list li {
- width: 100%;
- min-height: 180px;
- border-radius: 10px;
- margin: 1em 0;
- border: 1px solid var(--accent);
- padding: 1em;
- text-align: center;
- background: transparent;
- -moz-filter: blur(20px);
- -o-filter: blur(20px);
- -ms-filter: blur(20px);
- -webkit-backdrop-filter: blur(20px);
- backdrop-filter: blur(20px);
- -webkit-transition: all 0.5s;
- scroll-snap-align: center
- /* box-shadow: 0 0 10mm rgba(0,0,0,.7); */
- /* background: rgba(128, 128, 128, 0.1); */
+ width: 100%;
+ min-height: 180px;
+ border-radius: 10px;
+ margin: 1em 0;
+ border: 1px solid var(--accent);
+ padding: 1em;
+ text-align: center;
+ background: transparent;
+ -moz-filter: blur(20px);
+ -o-filter: blur(20px);
+ -ms-filter: blur(20px);
+ -webkit-backdrop-filter: blur(20px);
+ backdrop-filter: blur(20px);
+ -webkit-transition: all 0.5s;
+ scroll-snap-align: center
+ /* box-shadow: 0 0 10mm rgba(0,0,0,.7); */
+ /* background: rgba(128, 128, 128, 0.1); */
}
.repo-list h3, span{
- background: transparent;
+background: transparent;
}
.repo:hover {
- /* box-shadow: 0 3px 6px var(--accent), 0 3px 6px var(--accent); */
- box-shadow: 0 0 50mm rgba(255, 238, 16,.7);
- background: rgba(0, 0, 0, 0.5);
- transform: scale(1.05);
- transition: background 0.5s, transform 1s, all 0.3s
+ /* box-shadow: 0 3px 6px var(--accent), 0 3px 6px var(--accent); */
+ box-shadow: 0 0 50mm rgba(255, 238, 16,.7);
+ background: rgba(0, 0, 0, 0.5);
+ transform: scale(1.05);
+ transition: background 0.5s, transform 1s, all 0.3s
}
.repo-list:hover:has(li:hover) li:not(:hover) {
- /* background: rgba(0, 0, 0, 0.3); */
- background: rgba(0, 0, 0, 0.3);
- transform: scale(0.95);
- animation-duration: 0.5s;
- transition: background 0.5s, transform 1s, all 0.3s
+ /* background: rgba(0, 0, 0, 0.3); */
+ background: rgba(0, 0, 0, 0.3);
+ transform: scale(0.95);
+ animation-duration: 0.5s;
+ transition: background 0.5s, transform 1s, all 0.3s
}
.link-btn {
- padding: 10px 20px;
- /* background: var(--bg-main); */
- /* background: rgba(0, 0, 0, 0.5); */
- background: rgba(128, 128, 128, 0.1);
- border-radius: 30px;
- border: 2px solid var(--accent);
- color: var(--text);
- -webkit-transition: background 0.5s, transform 0.5s, border 0.5s, all 0.5s;
+ padding: 10px 20px;
+ /* background: var(--bg-main); */
+ /* background: rgba(0, 0, 0, 0.5); */
+ background: rgba(128, 128, 128, 0.1);
+ border-radius: 30px;
+ border: 2px solid var(--accent);
+ color: var(--text);
+ -webkit-transition: background 0.5s, transform 0.5s, border 0.5s, all 0.5s;
}
.link-btn:hover {
- background: rgba(22, 136, 240, 0.5);
- border: 2px solid var(--text);
- transform: scale(1.1);
- transition: background 0.5s, transform 0.5s, border 0.5s, all 0.5s;
- box-shadow: 0 0 50mm rgba(0, 156, 255,.7);
+ background: rgba(22, 136, 240, 0.5);
+ border: 2px solid var(--text);
+ transform: scale(1.1);
+ transition: background 0.5s, transform 0.5s, border 0.5s, all 0.5s;
+ box-shadow: 0 0 50mm rgba(0, 156, 255,.7);
}
.repo-list p {
- padding: 0em 0.5em;
- margin: 0.5em 0;
- background: transparent;
+ padding: 0em 0.5em;
+ margin: 0.5em 0;
+ background: transparent;
}
.intro:hover,
.user-info:hover {
- -moz-filter: blur(8px);
- -o-filter: blur(8px);
- -ms-filter: blur(8px);
- -webkit-backdrop-filter: blur(8px);
- backdrop-filter: blur(8px);
- transform: scale(1.1);
- transition: all 0.5s;
+-moz-filter: blur(8px);
+-o-filter: blur(8px);
+-ms-filter: blur(8px);
+-webkit-backdrop-filter: blur(8px);
+backdrop-filter: blur(8px);
+transform: scale(1.1);
+transition: all 0.5s;
}
.user-info {
- /* background: transparent; */
- background: rgba(128, 128, 128, 0.2);
- -moz-filter: blur(2px);
- -o-filter: blur(2px);
- -ms-filter: blur(2px);
- -webkit-backdrop-filter: blur(2px);
- backdrop-filter: blur(2px);
- /* box-shadow: 0 0 10mm rgba(0,0,0,.7); */
+/* background: transparent; */
+background: rgba(128, 128, 128, 0.2);
+-moz-filter: blur(2px);
+-o-filter: blur(2px);
+-ms-filter: blur(2px);
+-webkit-backdrop-filter: blur(2px);
+backdrop-filter: blur(2px);
+/* box-shadow: 0 0 10mm rgba(0,0,0,.7); */
}
.repo {
- -moz-filter: blur(20px);
- -o-filter: blur(20px);
- -ms-filter: blur(20px);
- -webkit-backdrop-filter: blur(20px);
- backdrop-filter: blur(20px);
- box-shadow: 0 0 10mm rgba(0,0,0,.7);
- overflow: auto;
- overflow-x: hidden;
- resize: both;
+ -moz-filter: blur(20px);
+ -o-filter: blur(20px);
+ -ms-filter: blur(20px);
+ -webkit-backdrop-filter: blur(20px);
+ backdrop-filter: blur(20px);
+ box-shadow: 0 0 10mm rgba(0,0,0,.7);
+ overflow: auto;
+ overflow-x: hidden;
+ resize: both;
}
.rdescription {
- display: -webkit-box;
- -webkit-box-orient: vertical;
- -webkit-line-clamp: 3;
- overflow: hidden
+display: -webkit-box;
+-webkit-box-orient: vertical;
+-webkit-line-clamp: 3;
+overflow: hidden
}
.rdescription:hover {
- -webkit-line-clamp: unset;
+-webkit-line-clamp: unset;
}
.rdescriptiontext:hover {
- /* animation: background-pan 3s linear infinite; */
- /* background: linear-gradient( */
- /* to right, */
- /* var(--purple), */
- /* var(--violet), */
- /* var(--pink), */
- /* var(--purple) */
- /* ); */
- /* background-size: 200%; */
- /* -webkit-background-clip: text; */
- /* -webkit-text-fill-color: transparent; */
+/* animation: background-pan 3s linear infinite; */
+/* background: linear-gradient( */
+/* to right, */
+/* var(--purple), */
+/* var(--violet), */
+/* var(--pink), */
+/* var(--purple) */
+/* ); */
+/* background-size: 200%; */
+/* -webkit-background-clip: text; */
+/* -webkit-text-fill-color: transparent; */
}
@media (min-width: 700px) {
- .user-info div {
- width: 45%;
- text-align: left;
- /* background: rgba(10, 10, 15, 0.1); */
- background: transparent;
- }
-
- .user-info div p {
- margin: 10px;
- }
-
- .repo-list {
- justify-content: space-around;
- }
-
- .repo-list li {
- width: 48%;
- margin-right: 1.5%;
- margin-left: 1.5%;
- margin-top: 2%;
- margin-bottom: 2%;
- }
+ .user-info div {
+ width: 45%;
+ text-align: left;
+ /* background: rgba(10, 10, 15, 0.1); */
+ background: transparent;
+ }
+
+ .user-info div p {
+ margin: 10px;
+ }
+
+ .repo-list {
+ justify-content: space-around;
+ }
+
+ .repo-list li {
+ width: 48%;
+ margin-right: 1.5%;
+ margin-left: 1.5%;
+ margin-top: 2%;
+ margin-bottom: 2%;
+ }
}
@media (min-width: 1200px) {
- .repo-list li {
- width: 30%;
- }
+ .repo-list li {
+ width: 30%;
+ }
}