layout fixes

main
overlisted 8 months ago
parent a9c661466a
commit 3f80792d80
Signed by: me
GPG Key ID: 1ACCDCC0429C9737
  1. 2
      migrations/2022-06-15-195343_link_border/down.sql
  2. 2
      migrations/2022-06-15-195343_link_border/up.sql
  3. 1
      src/db/model.rs
  4. 1
      src/db/schema.rs
  5. 5
      templates/base-head.html.hbs
  6. 23
      templates/index.html.hbs
  7. 7
      templates/projects.html.hbs

@ -0,0 +1,2 @@
ALTER TABLE link_types
DROP COLUMN border_color;

@ -0,0 +1,2 @@
ALTER TABLE link_types
ADD COLUMN border_color VARCHAR NOT NULL DEFAULT 'transparent';

@ -45,6 +45,7 @@ pub struct LinkType {
pub bg_color: String,
pub fg_color: String,
pub short_name: Option<String>,
pub border_color: String,
}
#[derive(Queryable, Insertable, AsChangeset, Serialize)]

@ -27,6 +27,7 @@ table! {
bg_color -> Varchar,
fg_color -> Varchar,
short_name -> Nullable<Varchar>,
border_color -> Varchar,
}
}

@ -17,6 +17,7 @@
a {
color: {{config.themeColor}};
font-weight: 500;
}
html {
@ -24,6 +25,10 @@
background-color: #F8F0F8;
}
span {
white-space: nowrap;
}
#nav {
position: relative;
}

@ -77,12 +77,20 @@
row-gap: 16px;
}
#highlights img {
#highlights .image {
width: 100%;
}
#highlights article *:last {
margin-top: 8px;
#highlights > ul > li {
display: flex; /* webkit bug */
}
#highlights article {
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
}
#contact li {
@ -109,7 +117,7 @@
}
#contact-{{id}} > img {
margin-right: 8px;
margin-right: 16px;
}
{{/each}}
@ -147,10 +155,9 @@
align-items: center;
border-radius: 6px;
padding: 8px;
font-weight: 500;
font-size: 18px;
background-color: {{type.bg_color}};
color: {{type.fg_color}};
border: 1px solid {{type.border_color}};
}
#project-link-{{extra.id}} > img {
@ -221,14 +228,14 @@
<p>{{project.description}}</p>
</div>
{{#if project.image}}
<img src="{{project.image}}" alt="Demo screenshot">
<img class="image" src="{{project.image}}" alt="Demo screenshot">
{{/if}}
<ul class="indent bg project-links">
{{#each links}}
<li>
<a class="shadow" id="project-link-{{extra.id}}" href="{{extra.url}}">
<img src="{{type.icon}}" height="24">
<span>{{extra.short_name}}</span>
<span>{{type.short_name}}</span>
</a>
</li>
{{/each}}

@ -24,6 +24,7 @@
.project-title {
display: flex;
align-items: center;
margin-bottom: 8px;
}
.project-links {
@ -55,6 +56,7 @@
{{#each tags}}
#project-tag-{{extra.id}} {
display: inline;
line-height: 1;
margin-left: 8px;
border-radius: 4px;
@ -73,6 +75,7 @@
padding: 8px;
background-color: {{type.bg_color}};
color: {{type.fg_color}};
border: 1px solid {{type.border_color}};
}
#project-link-{{extra.id}} > img {
@ -98,9 +101,7 @@
<h2>{{project.name}}</h1>
<ul>
{{#each tags}}
<li id="project-tag-{{extra.id}}">
{{type.name}}
</li>
<li id="project-tag-{{extra.id}}">{{type.name}}</li>
{{/each}}
</ul>
</div>

Loading…
Cancel
Save