Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
Added fonts and some design changes
  • Loading branch information
zjf19002 committed Oct 10, 2023
1 parent 686979b commit 4cb7462
Show file tree
Hide file tree
Showing 19 changed files with 227 additions and 9 deletions.
Binary file added .DS_Store
Binary file not shown.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
188 changes: 188 additions & 0 deletions class_registration_app/src/assets/Gotham/readme.html
@@ -0,0 +1,188 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="viewport" content="width=device-width" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="refresh" content="5;url=https://fontsgeek.com/gotham-font?ref=readme">
<title>GothamFontsgeek</title>
<style>
/* -------------------------------------
GLOBAL
------------------------------------- */
* {
margin:0;
padding:0;
font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
font-size: 100%;
line-height: 1.6;
}

img {
max-width: 100%;
}

body {
-webkit-font-smoothing:antialiased;
-webkit-text-size-adjust:none;
width: 100%!important;
height: 100%;
background:#DDD;
}


/* -------------------------------------
ELEMENTS
------------------------------------- */
a {
color: #348eda;
}

.btn-primary, .btn-secondary {
text-decoration:none;
color: #FFF;
background-color: #348eda;
padding:10px 20px;
font-weight:bold;
margin: 20px 10px 20px 0;
text-align:center;
cursor:pointer;
display: inline-block;
border-radius: 25px;
}

.btn-secondary{
background: #aaa;
}

.last {
margin-bottom: 0;
}

.first{
margin-top: 0;
}


/* -------------------------------------
BODY
------------------------------------- */
table.body-wrap {
width: 100%;
padding: 20px;
}

table.body-wrap .container{
border: 1px solid #f0f0f0;
}


/* -------------------------------------
FOOTER
------------------------------------- */
table.footer-wrap {
width: 100%;
clear:both!important;
}

.footer-wrap .container p {
font-size:12px;
color:#666;

}

table.footer-wrap a{
color: #999;
}


/* -------------------------------------
TYPOGRAPHY
------------------------------------- */
h1,h2,h3{
font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; line-height: 1.1; margin-bottom:15px; color:#000;
margin: 40px 0 10px;
line-height: 1.2;
font-weight:200;
}

h1 {
font-size: 36px;
}
h2 {
font-size: 28px;
}
h3 {
font-size: 22px;
}

p, ul {
margin-bottom: 10px;
font-weight: normal;
font-size:14px;
}

ul li {
margin-left:5px;
list-style-position: inside;
}

/* ---------------------------------------------------
RESPONSIVENESS
Nuke it from orbit. It's the only way to be sure.
------------------------------------------------------ */

/* Set a max-width, and make it display as block so it will automatically stretch to that width, but will also shrink down on a phone or something */
.container {
display:block!important;
max-width:600px!important;
margin:0 auto!important; /* makes it centered */
clear:both!important;
}

/* This should also be a block element, so that it will fill 100% of the .container */
.content {
padding:20px;
max-width:600px;
margin:0 auto;
display:block;
}

/* Let's make sure tables in the content area are 100% wide */
.content table {
width: 100%;
}

</style>
</head>

<body bgcolor="#f6f6f6">

<!-- body -->
<table class="body-wrap">
<tr>
<td></td>
<td class="container" bgcolor="#FFFFFF">

<!-- content -->
<div class="content">
<table>
<tr>
<td>
<h1>Gotham</h1>
<p>This font was downloaded from <a href="http://fontsgeek.com?ref=readme">fontsgeek.com</a> . You can visit <a href="http://fontsgeek.com?ref=readme">fontsgeek.com</a> for thousands of free fonts.</p>
<p><a href="http://fontsgeek.com/gotham-font?ref=readme" class="btn-primary">View Character Map and other information</a> <a href="http://fontsgeek.com?ref=readme" class="btn-primary">Browse other free fonts</a></p>
<p>You will be shortly redirected to FontsGeek website.</p>
</td>
</tr>
</table>
</div>
<!-- /content -->

</td>
<td></td>
</tr>
</table>
<!-- /body -->

</body>
</html>
29 changes: 20 additions & 9 deletions class_registration_app/src/components/Home.vue
Expand Up @@ -11,7 +11,7 @@ import AppVue from '@/App.vue';
<div class="top">
<img class="logos" src="https://logos-world.net/wp-content/uploads/2022/01/UConn-Huskies-Logo-1970.png">
<div>
<h1>UCONN Class Registration</h1>
<h1 class="uconn">UCONN Class Registration</h1>
<h3>Welcome!</h3>
</div>
<img class="logos" src="https://1000logos.net/wp-content/uploads/2017/08/UConn-Huskies-Logo-1959.png">
Expand All @@ -32,32 +32,43 @@ import AppVue from '@/App.vue';
</template>

<style scoped>
@font-face {
font-family: 'Gotham';
src: url('../assets/Gotham/Gotham\ Ultra/Gotham\ Ultra.otf') format('opentype');
}
.top {
height: 10vh;
color:navy;
font-weight: 100;
height: 20vh;
position: fixed;
display: flex;
justify-content: center;
/*border:1px solid #000;*/
top: 5%;
left: 0%;
width: 100vw;
left: 50%;
transform: translate(-50%);
width: 50vw;
text-align: center;
background-color: white;
color: black;
border-radius: 9999px;
border: solid 3px navy;
.uconn{
font-weight: 600;
}
}
.login {
border: 1px solid black;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 40vw;
height: 30vh;
background-image: url("https://today.uconn.edu/wp-content/uploads/2023/06/062023-JonathanXVFirstShoots-5-scaled.jpg");
background: transparent;
background-size: contain;
border: 1px solid black;
border-radius: 9999px;
Expand All @@ -69,7 +80,7 @@ import AppVue from '@/App.vue';
top: 0%;
height: 100vh;
width: 100vw;
background-image: url("https://today.uconn.edu/wp-content/uploads/2020/03/Aerial131009a125.jpg");
background-image: url("../assets/Aerial131009a125.jpeg");
background-size:cover;
background-repeat: no-repeat;
}
Expand Down
19 changes: 19 additions & 0 deletions class_registration_app/src/components/Login.vue
Expand Up @@ -12,10 +12,29 @@
<input placeholder="Password" type="password" id="password"/>
<button id="submit">Login</button>
</form>
<RouterLink to="/">Back</RouterLink>
</section>
</template>

<style scoped>
section {
background-color: navy ;
font-family: "Roboto";
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
&::before {
z-index: -1;
content: '';
position: fixed;
top: 0;
left: 0;
background-color: rgb(red, green, rgba(20, 20, 241, 0.429));
background-size:cover;
background-repeat: no-repeat;
width: 100%;
height: 100%;
}
}
.form {
position: absolute;
top: 50%;
Expand Down

0 comments on commit 4cb7462

Please sign in to comment.