add images back and break bottom cards

closebracket-solution
Kieran Coldron 2021-08-30 20:22:23 +01:00
parent 2790448e1f
commit cd23f778db
16 changed files with 116 additions and 1016 deletions

View File

@ -0,0 +1 @@
[{"fe4e1305":"1"},{"cachedAt":1630279364994,"type":"2"},"json"]

View File

@ -0,0 +1 @@
[{"login":"sbrl","id":9929737,"node_id":"MDQ6VXNlcjk5Mjk3Mzc=","avatar_url":"https://avatars.githubusercontent.com/u/9929737?v=4","gravatar_id":"","url":"https://api.github.com/users/sbrl","html_url":"https://github.com/sbrl","followers_url":"https://api.github.com/users/sbrl/followers","following_url":"https://api.github.com/users/sbrl/following{/other_user}","gists_url":"https://api.github.com/users/sbrl/gists{/gist_id}","starred_url":"https://api.github.com/users/sbrl/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/sbrl/subscriptions","organizations_url":"https://api.github.com/users/sbrl/orgs","repos_url":"https://api.github.com/users/sbrl/repos","events_url":"https://api.github.com/users/sbrl/events{/privacy}","received_events_url":"https://api.github.com/users/sbrl/received_events","type":"User","site_admin":false,"contributions":29},{"login":"Epictek","id":1466270,"node_id":"MDQ6VXNlcjE0NjYyNzA=","avatar_url":"https://avatars.githubusercontent.com/u/1466270?v=4","gravatar_id":"","url":"https://api.github.com/users/Epictek","html_url":"https://github.com/Epictek","followers_url":"https://api.github.com/users/Epictek/followers","following_url":"https://api.github.com/users/Epictek/following{/other_user}","gists_url":"https://api.github.com/users/Epictek/gists{/gist_id}","starred_url":"https://api.github.com/users/Epictek/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Epictek/subscriptions","organizations_url":"https://api.github.com/users/Epictek/orgs","repos_url":"https://api.github.com/users/Epictek/repos","events_url":"https://api.github.com/users/Epictek/events{/privacy}","received_events_url":"https://api.github.com/users/Epictek/received_events","type":"User","site_admin":false,"contributions":22},{"login":"dependabot[bot]","id":49699333,"node_id":"MDM6Qm90NDk2OTkzMzM=","avatar_url":"https://avatars.githubusercontent.com/in/29110?v=4","gravatar_id":"","url":"https://api.github.com/users/dependabot%5Bbot%5D","html_url":"https://github.com/apps/dependabot","followers_url":"https://api.github.com/users/dependabot%5Bbot%5D/followers","following_url":"https://api.github.com/users/dependabot%5Bbot%5D/following{/other_user}","gists_url":"https://api.github.com/users/dependabot%5Bbot%5D/gists{/gist_id}","starred_url":"https://api.github.com/users/dependabot%5Bbot%5D/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/dependabot%5Bbot%5D/subscriptions","organizations_url":"https://api.github.com/users/dependabot%5Bbot%5D/orgs","repos_url":"https://api.github.com/users/dependabot%5Bbot%5D/repos","events_url":"https://api.github.com/users/dependabot%5Bbot%5D/events{/privacy}","received_events_url":"https://api.github.com/users/dependabot%5Bbot%5D/received_events","type":"Bot","site_admin":false,"contributions":3}]

View File

@ -10,6 +10,7 @@ module.exports = config => {
config.addPassthroughCopy('internal/css')
config.addPassthroughCopy('internal/js')
config.addPassthroughCopy('internal/img')
config.addPassthroughCopy('internal/img')
config.addPassthroughCopy('favicon.png')
config.addPassthroughCopy('favicon.svg')

26
css/tailwind.scss Normal file
View File

@ -0,0 +1,26 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
@layer components {
.btn-cta {
@apply inline-block pb-1 pt-2 pl-2 pr-2 mr-2 bg-primary hover:ring-white rounded ring-2 ring-black text-white;
}
.bg-project {
background-image: url("/img/project-bg.png");
background-size: 70vw;
background-position: -30vw;
background-repeat: no-repeat;
}
.bg-alumni {
background-image: url("/img/alumni-bg.jpg");
background-size: 70vw;
background-position: center;
background-repeat: no-repeat;
}
.social-icons .icon-link:hover {
color: #fe6431;
}
}

View File

@ -1,923 +0,0 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
@layer components {
.btn-cta {
@apply inline-block pb-1 pt-2 pl-2 pr-2 mr-2 bg-primary hover:ring-white rounded ring-2 ring-black text-white;
}
}
/* Non Tailwind CSS Below */
/*
.bg-secondary {
background:#525252
}
.bg-grey {
background:#4e5b71
}
.bg-white {
background:#F3F6FB
}
.bg-discord {
background: #5865F2;
}
.bg-project {
background-image: url("/assets/img/project-bg.png");
background-size: 70vw;
background-position: -30vw;
background-repeat: no-repeat;
}
.bg-alumni {
background-image: url("/assets/img/alumni-bg.jpg");
background-size: 70vw;
background-position: center;
background-repeat: no-repeat;
}
.color-primary {
color:#240d09
}
.color-secondary {
color:#fe6431
}
.color-grey {
color:#4e5b71
}
.color-white {
color:#F3F6FB
}
.font-base,
.font-heading {
font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,sans-serif
}
.box-block {
display:block
}
.box-inline-block {
display:inline-block
}
.box-flex {
display:flex
}
.box-grid {
display:grid
}
.box-hidden {
display:none
}
.mt-300 {
margin-top:.8rem
}
.mt-400 {
margin-top:1rem
}
.mt-500 {
margin-top:1.25rem
}
.mt-600 {
margin-top:1.56rem
}
.mt-700 {
margin-top:1.95rem
}
.mt-800 {
margin-top:2.44rem
}
.mt-900 {
margin-top:3.05rem
}
.mt-1000 {
margin-top:3.81rem
}
.mt-1100 {
margin-top:4.76rem
}
.mb-300 {
margin-bottom:.8rem
}
.mb-400 {
margin-bottom:1rem
}
.mb-500 {
margin-bottom:1.25rem
}
.mb-600 {
margin-bottom:1.56rem
}
.mb-700 {
margin-bottom:1.95rem
}
.mb-800 {
margin-bottom:2.44rem
}
.mb-900 {
margin-bottom:3.05rem
}
.mb-1000 {
margin-bottom:3.81rem
}
.mb-1100 {
margin-bottom:4.76rem
}
.ml-300 {
margin-left:.8rem
}
.ml-400 {
margin-left:1rem
}
.ml-500 {
margin-left:1.25rem
}
.ml-600 {
margin-left:1.56rem
}
.ml-700 {
margin-left:1.95rem
}
.ml-800 {
margin-left:2.44rem
}
.ml-900 {
margin-left:3.05rem
}
.ml-1000 {
margin-left:3.81rem
}
.ml-1100 {
margin-left:4.76rem
}
.mr-300 {
margin-right:.8rem
}
.mr-400 {
margin-right:1rem
}
.mr-500 {
margin-right:1.25rem
}
.mr-600 {
margin-right:1.56rem
}
.mr-700 {
margin-right:1.95rem
}
.mr-800 {
margin-right:2.44rem
}
.mr-900 {
margin-right:3.05rem
}
.mr-1000 {
margin-right:3.81rem
}
.mr-1100 {
margin-right:4.76rem
}
.pt-300 {
padding-top:.8rem
}
.pt-400 {
padding-top:1rem
}
.pt-500 {
padding-top:1.25rem
}
.pt-600 {
padding-top:1.56rem
}
.pt-700 {
padding-top:1.95rem
}
.pt-800 {
padding-top:2.44rem
}
.pt-900 {
padding-top:3.05rem
}
.pt-1000 {
padding-top:3.81rem
}
.pt-1100 {
padding-top:4.76rem
}
.pb-300 {
padding-bottom:.8rem
}
.pb-400 {
padding-bottom:1rem
}
.pb-500 {
padding-bottom:1.25rem
}
.pb-600 {
padding-bottom:1.56rem
}
.pb-700 {
padding-bottom:1.95rem
}
.pb-800 {
padding-bottom:2.44rem
}
.pb-900 {
padding-bottom:3.05rem
}
.pb-1000 {
padding-bottom:3.81rem
}
.pb-1100 {
padding-bottom:4.76rem
}
.pl-300 {
padding-left:.8rem
}
.pl-400 {
padding-left:1rem
}
.pl-500 {
padding-left:1.25rem
}
.pl-600 {
padding-left:1.56rem
}
.pl-700 {
padding-left:1.95rem
}
.pl-800 {
padding-left:2.44rem
}
.pl-900 {
padding-left:3.05rem
}
.pl-1000 {
padding-left:3.81rem
}
.pl-1100 {
padding-left:4.76rem
}
.pr-300 {
padding-right:.8rem
}
.pr-400 {
padding-right:1rem
}
.pr-500 {
padding-right:1.25rem
}
.pr-600 {
padding-right:1.56rem
}
.pr-700 {
padding-right:1.95rem
}
.pr-800 {
padding-right:2.44rem
}
.pr-900 {
padding-right:3.05rem
}
.pr-1000 {
padding-right:3.81rem
}
.pr-1100 {
padding-right:4.76rem
}
.text-300 {
font-size:.8rem
}
.text-400 {
font-size:1rem
}
.text-500 {
font-size:1.25rem
}
.text-600 {
font-size:1.56rem
}
.text-700 {
font-size:1.95rem
}
.text-800 {
font-size:2.44rem
}
.text-900 {
font-size:3.05rem
}
.text-1000 {
font-size:3.81rem
}
.text-1100 {
font-size:4.76rem
}
.leading-tight {
line-height:1.1
}
.leading-normal {
line-height:1.6
}
.leading-loose {
line-height:2
}
.weight-thin {
font-weight:300
}
.weight-regular {
font-weight:400
}
.weight-bold {
font-weight:700
}
.width-full {
width:100%
}
.width-screen {
width:100vw
}
.width-half {
width:50%
}
.width-quarter {
width:25%
}
.width-third {
width:33.3333333333%
}
.height-full {
height:100%
}
.height-screen {
height:100vh
}
.length-compact {
max-width:25ch
}
.length-optimal {
max-width:75ch
}
.z-20 {
z-index:20
}
@media screen and (min-width:22.5em) {
.mobileL\:box-block {
display:block
}
.mobileL\:box-inline-block {
display:inline-block
}
.mobileL\:box-flex {
display:flex
}
.mobileL\:box-grid {
display:grid
}
.mobileL\:box-hidden {
display:none
}
.mobileL\:width-full {
width:100%
}
.mobileL\:width-screen {
width:100vw
}
.mobileL\:width-half {
width:50%
}
.mobileL\:width-quarter {
width:25%
}
.mobileL\:width-third {
width:33.3333333333%
}
}
@media screen and (min-width:40em) {
.mobileXL\:box-block {
display:block
}
.mobileXL\:box-inline-block {
display:inline-block
}
.mobileXL\:box-flex {
display:flex
}
.mobileXL\:box-grid {
display:grid
}
.mobileXL\:box-hidden {
display:none
}
.mobileXL\:width-full {
width:100%
}
.mobileXL\:width-screen {
width:100vw
}
.mobileXL\:width-half {
width:50%
}
.mobileXL\:width-quarter {
width:25%
}
.mobileXL\:width-third {
width:33.3333333333%
}
}
@media screen and (min-width:48em) {
.tablet\:box-block {
display:block
}
.tablet\:box-inline-block {
display:inline-block
}
.tablet\:box-flex {
display:flex
}
.tablet\:box-grid {
display:grid
}
.tablet\:box-hidden {
display:none
}
.tablet\:width-full {
width:100%
}
.tablet\:width-screen {
width:100vw
}
.tablet\:width-half {
width:50%
}
.tablet\:width-quarter {
width:25%
}
.tablet\:width-third {
width:33.3333333333%
}
}
@media screen and (min-width:64em) {
.laptop\:box-block {
display:block
}
.laptop\:box-inline-block {
display:inline-block
}
.laptop\:box-flex {
display:flex
}
.laptop\:box-grid {
display:grid
}
.laptop\:box-hidden {
display:none
}
.laptop\:width-full {
width:100%
}
.laptop\:width-screen {
width:100vw
}
.laptop\:width-half {
width:50%
}
.laptop\:width-quarter {
width:25%
}
.laptop\:width-third {
width:33.3333333333%
}
}
@media screen and (min-width:80em) {
.desktop\:box-block {
display:block
}
.desktop\:box-inline-block {
display:inline-block
}
.desktop\:box-flex {
display:flex
}
.desktop\:box-grid {
display:grid
}
.desktop\:box-hidden {
display:none
}
.desktop\:width-full {
width:100%
}
.desktop\:width-screen {
width:100vw
}
.desktop\:width-half {
width:50%
}
.desktop\:width-quarter {
width:25%
}
.desktop\:width-third {
width:33.3333333333%
}
}
@media screen and (min-width:90em) {
.desktopL\:box-block {
display:block
}
.desktopL\:box-inline-block {
display:inline-block
}
.desktopL\:box-flex {
display:flex
}
.desktopL\:box-grid {
display:grid
}
.desktopL\:box-hidden {
display:none
}
.desktopL\:width-full {
width:100%
}
.desktopL\:width-screen {
width:100vw
}
.desktopL\:width-half {
width:50%
}
.desktopL\:width-quarter {
width:25%
}
.desktopL\:width-third {
width:33.3333333333%
}
}
@media screen and (min-width:120em) {
.desktopXL\:box-block {
display:block
}
.desktopXL\:box-inline-block {
display:inline-block
}
.desktopXL\:box-flex {
display:flex
}
.desktopXL\:box-grid {
display:grid
}
.desktopXL\:box-hidden {
display:none
}
.desktopXL\:width-full {
width:100%
}
.desktopXL\:width-screen {
width:100vw
}
.desktopXL\:width-half {
width:50%
}
.desktopXL\:width-quarter {
width:25%
}
.desktopXL\:width-third {
width:33.3333333333%
}
}
:root {
--max-width:80rem;
--gap:1.56rem;
--base-font-size:1rem;
--ratio:1.1;
--text-300:calc(var(--base-font-size)/var(--ratio)/var(--ratio));
--text-400:calc(var(--text-300)*var(--ratio));
--text-500:calc(var(--text-400)*var(--ratio)*var(--ratio));
--text-600:calc(var(--text-500)*var(--ratio));
--text-700:calc(var(--text-600)*var(--ratio));
--text-800:calc(var(--text-700)*var(--ratio));
--text-900:calc(var(--text-800)*var(--ratio));
--text-1000:calc(var(--text-900)*var(--ratio));
--text-1100:calc(var(--text-1000)*var(--ratio));
--border-radius:.25rem;
--border-size:.15rem;
--transition-duration:.25s;
--transition-timing:ease-out
}
@media (min-width:48em) {
:root {
--ratio:1.2
}
}
@media (min-width:64em) {
:root {
--ratio:1.25
}
}
.inner {
width:100%;
margin:0 auto;
max-width:var(--max-width);
padding-left:1.56rem;
padding-right:1.56rem
}
.flow>*+* {
margin-top:var(--gap)
}
@media (min-width:48em) {
.flow>*+* {
--gap:1.95rem
}
}
[data-src] {
opacity:0
}
.loaded {
opacity:1;
transition:opacity var(--transition-duration) var(--transition-timing)
}
.sr-only {
position:absolute;
width:1px;
height:1px;
padding:0;
margin:-1px;
overflow:hidden;
clip:rect(0,0,0,0);
white-space:nowrap;
border-width:0
}
*,
:after,
:before {
box-sizing:border-box
}
html {
min-height:100%;
scroll-behavior:smooth
}
body {
overflow-x:hidden;
text-rendering:optimizeLegibility;
-webkit-font-smoothing:antialiased
}
blockquote,
body,
dd,
dl,
figure,
h1,
h2,
h3,
h4,
ol,
p,
ul {
margin:0
}
img {
display:block;
max-width:100%;
height:auto
}
button,
input,
select,
textarea {
font:inherit
}
@media (prefers-reduced-motion:reduce) {
* {
-webkit-animation-duration:NaNs!important;
animation-duration:NaNs!important;
-webkit-animation-iteration-count:1!important;
animation-iteration-count:1!important;
transition-duration:NaNs!important;
scroll-behavior:auto!important
}
}
ol[class],
ul[class] {
list-style:none;
padding:0
}
body {
font-size:var(--text-500)
}
h1,
h2,
h3 {
line-height:1.1;
letter-spacing:-.01rem
}
h1 {
--gap:1.95rem;
font-size:var(--text-900);
margin:0 0 var(--gap)
}
h2 {
font-size:var(--text-800)
}
h3 {
font-size:var(--text-700)
}
.content {
word-wrap:break-word
}
.sub-heading {
font-size:var(--text-700);
line-height:1.5
}
a {
text-decoration: none;
color: #fe6431;
transition:color var(--transition-duration) var(--transition-timing)
}
a:hover{
text-decoration: none;
color: #240d09;
}
a:not([class]) {
color:#F3F6FB;
padding-bottom:.1rem;
-webkit-text-decoration-skip:ink;
text-decoration-skip-ink:auto
}
a:not([class]):hover {
color: #240d09;
}
:focus {
outline:1px solid #24e0d0;
outline-offset:.25rem
}
.wrapper {
min-height:100vh;
flex-direction:column;
background-attachment:fixed;
}
@media (min-width:40em) {
.wrapper {
padding-bottom:0
}
}
.logo {
--logo-size:1.25rem;
font-size:var(--logo-size);
margin:0 auto
}
@media (min-width:40em) {
.logo {
--logo-size:1.56rem;
margin:0 auto 0 0
}
}
@media (min-width:40em) {
.header-inner {
align-items:center;
justify-content:space-between;
}
}
.nav .link {
color: #240d09;
height:3.05rem;
line-height:3.05rem
}
.nav .link.active,
.nav .link:hover {
color: #fe6431;
}
.nav .link-button {
border-radius:var(--border-radius);
transition:background-color var(--transition-duration) var(--transition-timing)
}
.nav .link-button:hover {
background:#525252;
color: #fe6431;
}
.nav .link-calltoaction {
border-radius:var(--border-radius);
transition:background-color var(--transition-duration) var(--transition-timing)
}
.nav .link-calltoaction:hover {
background:#525252;
color: #F3F6FB;
}
.mobile-nav {
--transition-duration:.3s;
position:fixed;
top:0;
left:0;
overflow-y:auto;
transform:translate3d(-100%,0,0);
transition:transform var(--transition-duration) cubic-bezier(.77,0,.175,1);
transition-delay:.1s;
will-change:transform
}
.mobile-nav.menu-visible {
transform:translateZ(0)
}
.mobile-nav .link {
--gap:.25rem;
padding:var(--gap) 0
}
.mobile-nav .link.active,
.mobile-nav .link:hover {
color:#fe6431
}
.mobile-nav-toggle {
position:fixed;
bottom:0;
height:3.05rem;
align-items:center;
justify-content:center;
border:0;
outline:0
}
.mobile-nav-toggle .mobile-nav-icon {
flex-direction:column
}
.mobile-nav-toggle .icon-line {
--transition-duration:.2s;
--transition-timing:cubic-bezier(0,0,.2,1);
height:2px;
width:1.25rem;
transform-origin:7px 1px;
transition:transform var(--transition-duration) var(--transition-timing),opacity var(--transition-duration) var(--transition-timing)
}
.mobile-nav-toggle .icon-line:not(:last-child) {
margin-bottom:.25rem
}
.mobile-nav-toggle.expanded .icon-line {
margin:0
}
.mobile-nav-toggle.expanded .icon-line:first-child {
transform:rotate(45deg)
}
.mobile-nav-toggle.expanded .icon-line:nth-child(2) {
opacity:0
}
.mobile-nav-toggle.expanded .icon-line:last-child {
transform:rotate(-45deg)
}
.main {
flex-direction:column;
flex:1
}
.main:focus {
outline:0
}
.page-header {
--gap:2.44rem;
margin-bottom:var(--gap)
}
@media (min-width:48em) {
.page-header {
--gap:3.05rem
}
}
.footer-inner {
align-items:center;
justify-content:space-between
}
.button {
display:inline-block;
background-color:#fe6431;
border:0;
border-radius:var(--border-radius);
color:#525252;
padding:.8rem 1.25rem;
transition:background-color var(--transition-duration) var(--transition-timing);
font-weight:700
}
.button:hover {
background:#fe6431
}
.pagination {
--gap:3.81rem
}
.pagination .items {
justify-content:space-between;
padding:0
}
.input,
.textarea {
border:0;
border-radius:var(--border-radius);
padding:0 .5rem
}
.input {
height:2.44rem
}
.textarea {
height:4.76rem
}
.social-icons .icon-link:hover {
color:#fe6431
}
.social-icons .icon {
--social-icon-size:1.25rem;
width:var(--social-icon-size);
height:var(--social-icon-size)
}
*/

View File

@ -19,7 +19,7 @@
</p>
</div>
<div class="row-span-1 col-span-1">
<img class="w-40" src="../assets/img/uoh-logo.png"/>
<img class="w-40" src="../img/uoh-logo.png"/>
</div>
</div>
</div>

View File

@ -1,6 +1,6 @@
<div class="container flex mx-auto h-24 mb-20 mt-2">
<div class="flex-none">
<a href="/"><img src="/assets/img/logo.png" class="logo float-left w-64"></a>
<a href="/"><img src="/img/logo.png" class="logo float-left w-64"></a>
</div>
<div class="flex-1 flex justify-end">

View File

@ -13,37 +13,37 @@ title: Alumni
<div class="container mx-auto h-full m-16 p-6 w-screen">
<div class="grid grid-rows-1 grid-flow-col">
<div class="row-span-1 col-start-1">
<img class="rounded-sm w-48 items-center" src="/assets/img/epictek.jpg" />
<img class="rounded-sm w-48 items-center" src="/img/epictek.jpg" />
<h4 class="p-2 text-gray-400 font-medium leading-relaxed">epictek</h4>
</div>
<div class="row-span-1 col-start-2">
<img class="rounded-2xl w-48 items-center" src="/assets/img/logo.jpg" />
<img class="rounded-2xl w-48 items-center" src="/img/logo.jpg" />
<h4 class="p-2 text-gray-400 font-medium leading-relaxed">shinsters</h4>
</div>
<div class="row-span-1 col-start-3">
<img class="rounded-2xl w-48 items-center" src="/assets/img/logo.jpg" />
<img class="rounded-2xl w-48 items-center" src="/img/logo.jpg" />
<h4 class="p-2 text-gray-400 font-medium leading-relaxed">sleepyxuras</h4>
</div>
<div class="row-span-1 col-start-4">
<img class="rounded-2xl w-48 items-center" src="/assets/img/closebracket.jpg" />
<img class="rounded-2xl w-48 items-center" src="/img/closebracket.jpg" />
<h4 class="p-2 text-gray-400 font-medium leading-relaxed">closebracket</h4>
</div>
</div>
<div class="grid grid-rows-1 grid-flow-col">
<div class="row-span-1 col-start-1">
<img class="rounded-2xl w-48 items-center" src="/assets/img/logo.jpg" />
<img class="rounded-2xl w-48 items-center" src="/img/logo.jpg" />
<h4 class="p-2 text-gray-400 font-medium leading-relaxed">?????</h4>
</div>
<div class="row-span-1 col-start-2">
<img class="rounded-2xl w-48 items-center" src="/assets/img/logo.jpg" />
<img class="rounded-2xl w-48 items-center" src="/img/logo.jpg" />
<h4 class="p-2 text-gray-400 font-medium leading-relaxed">?????</h4>
</div>
<div class="row-span-1 col-start-3">
<img class="rounded-2xl w-48 items-center" src="/assets/img/logo.jpg" />
<img class="rounded-2xl w-48 items-center" src="/img/logo.jpg" />
<h4 class="p-2 text-gray-400 font-medium leading-relaxed">?????</h4>
</div>
<div class="row-span-1 col-start-4">
<img class="rounded-2xl w-48 items-center" src="/assets/img/logo.jpg" />
<img class="rounded-2xl w-48 items-center" src="/img/logo.jpg" />
<h4 class="p-2 text-gray-400 font-medium leading-relaxed">?????</h4>
</div>
</div>

BIN
internal/img/alumni-bg.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 71 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 145 KiB

BIN
internal/img/lab.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 375 KiB

BIN
internal/img/logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

BIN
internal/img/project-bg.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 50 KiB

BIN
internal/img/uoh-logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

View File

@ -3,95 +3,88 @@ layout: layouts/default
title: Freeside
---
<section class="landing mx-auto container mx-auto h-full w-screen grid grid-rows-1 grid-flow-col gap-2">
<div class="grid grid-cols-4 gap-4">
<div class="col-span-4 md:col-span-2">
<h1 class="text-8xl font-bold overflow-ellipsis">Linux @ Hull.</h1>
<h5 class="tracking-wide leading-loose">Freeside is the student run and maintained linux cluster within
<section class="landing mx-auto container mx-auto h-full w-screen grid grid-rows-1 grid-flow-col gap-2">
<div class="grid grid-cols-4 gap-4">
<div class="col-span-4 md:col-span-2">
<h1 class="text-8xl font-bold overflow-ellipsis">Linux @ Hull.</h1>
<h5 class="tracking-wide leading-loose">Freeside is the student run and maintained linux cluster within
the
University Of Hull Computer Science Department providing Linux administration experience, mentoring
and
technical advice alongside other peer-led support. It is completely <b>free</b> to all students to
join,
irrespective of degree pathway.</h5>
</div>
<div class="col-span-4 md:col-span-2">
<img class="rounded pull-right shadow-2xl" src="/assets/img/lab.jpg" />
</div>
</div>
</section>
<div class="container mx-auto h-full m-16 p-6 ">
<div class="">
<div class="">
<h3>Connect with us</h3>
<ol class="flex gap-10 m-5">
<li><a class="" href="https://github.com/FreesideHull"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/github.svg" /></a></li>
<li><a class="" href="https://gitlab.freeside.co.uk/"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/gitlab.svg" /></a></li>
<li><a class="icon-link" href="https://discord.gg/qAZ8dAp"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/discord.svg" /></a></li>
<li><a class="icon-link" href="http://forums.freeside.co.uk/"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/discourse.svg" /></a></li>
<li><a class="icon-link" href="https://www.twitter.com/FreesideHull"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/twitter.svg" /></a></li>
<li><a class="icon-link" href="https://www.facebook.com/FreesideHull"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/facebook.svg" /></a></li>
</ol>
</div>
<div class=" inline-block" aria-label="Primary">
<button
class="btn-cta inline-block"><a
href="https://discord.gg/qAZ8dAp"> Join our Discord </a></button>
<button
class="bg-discord text-white btn-cta inline-block"><a
href="https://profiles.freeside.co.uk/join"> Create Freeside Account </a></button>
</div>
</div>
<div class="col-span-4 md:col-span-2">
<img class="rounded-3xl pull-right shadow-2xl" src="/img/lab.jpg"/>
</div>
</div>
<div class="container mx-auto h-full grid grid-cols-1 md:grid-cols-3">
<div class="col-span-1">
<div class="bg-alumni rounded-xl p-10 w-3/4">
<h2 class="text-gray text-bold">Alumni Network</h2>
<p>Our community is made up of like-minded life-time members including many distinguished alumni
whom continue to support students.</p>
<br>
<div class=" box-hidden mobileXL:box-block">
</section>
<div class="container mx-auto h-full m-16 p-6 flex">
<div class="flex-1">
<h3>Connect with us</h3>
<ol class="flex gap-10 m-5">
<li>
<a class="icon-link" href="https://github.com/freesidehull"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/github.svg"/></a>
</li>
<li>
<a class="icon-link" href="https://gitlab.freeside.co.uk/"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/gitlab.svg"/></a>
</li>
<li>
<a class="icon-link" href="https://discord.gg/qaz8dap"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/discord.svg"/></a>
</li>
<li>
<a class="icon-link" href="http://forums.freeside.co.uk/"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/discourse.svg"/></a>
</li>
<li>
<a class="icon-link" href="https://www.twitter.com/freesidehull"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/twitter.svg"/></a>
</li>
<li>
<a class="icon-link" href="https://www.facebook.com/freesidehull"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/facebook.svg"/></a>
</li>
<button
class="btn-cta"><a
href="/alumnus"> View Alumni </a></button>
</div>
</div>
</div>
<div class="col-span-1">
<div class="rounded-xl bg-project p-10 w-3/4">
<h2 class="text-white text-bold">Hands-on Projects</h2>
<p class="text-white">Get involved with hands-on Linux administration or contribute to open-source
coding projects.</p>
<br>
<div class=" box-hidden mobileXL:box-block">
<button
class="btn-cta"><a
href="https://github.com/FreesideHull"> Get involved </a></button>
</div>
</div>
</div>
<div class="col-span-1">
<div class="rounded-xl bg-primary p-10 w-3/4">
<h2 class="text-gray text-bold">Free Resources</h2>
<p>Take your learning to the next level with our Free Student Resources List featuring over 130
contributions in multiple areas of Computer Science.</p>
<br>
<div class=" box-hidden mobileXL:box-block">
<button
class="btn-cta "><a
href="https://github.com/FreesideHull/StudentResources"> View List </a></button>
</div>
</div>
</ol>
</div>
</div>
<div class="flex-0" aria-label="primary">
<button class="btn-cta inline-block">
<ahref="https://discord.gg/qaz8dap"> Join our Discord </a>
</button>
<button class="bg-discord text-white btn-cta inline-block">
<a href="https://profiles.freeside.co.uk/join"> Create Freeside Account </a>
</button>
</div>
</div>
</div>
<div class="container mx-auto h-full grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
<div class="col-span-1 bg-alumni rounded-xl p-10 ">
<h2 class="text-gray text-bold">Alumni Network</h2>
<p>Our community is made up of like-minded life-time members including many distinguished alumni
whom continue to support students.</p>
<br>
<button class="btn-cta">
<a href="/alumnus"> View Alumni </a>
</button>
</div>
<div class="col-span-1 rounded-xl bg-project p-10">
<h2 class="text-white text-bold">Hands-on Projects</h2>
<p class="text-white">Get involved with hands-on Linux administration or contribute to open-source coding projects.</p>
<br>
<button class="btn-cta">
<a href="https://github.com/freesidehull"> Get involved </a>
</button>
</div>
<div class="col-span-1 rounded-xl bg-primary p-10 w-3/4">
<h2 class="text-gray text-bold">Free Resources</h2>
<p>Take your learning to the next level with our Free Student Resources List featuring over 130 contributions in multiple areas of Computer Science.</p>
<br>
<button class="btn-cta ">
<a href="https://github.com/freesidehull/studentresources"> View List </a>
</button>
</div>
</div>

View File

@ -17,10 +17,11 @@
"devDependencies": {
"@11ty/eleventy": "^0.12.1",
"@11ty/eleventy-img": "^0.9.0",
"@types/simple-icons": "^5.8.0"
"@types/simple-icons": "^5.8.0",
"cross-env": "^7.0.3"
},
"scripts": {
"tailwind:process": "npx postcss internal/_includes/css/tailwind.scss --o public/assets/css/main.css --watch",
"tailwind:process": "cross-env TAILWIND_MODE=watch postcss css/tailwind.scss --o public/assets/css/main.css --watch",
"start": "concurrently \"npm run tailwind:process\" \"npm run serve\"",
"serve": "npx eleventy --serve"
}