New buttons with project colors + small bugfix #80

Merged
bvisness merged 5 commits from giggs/hmn:buttons into master 2022-08-13 02:13:14 +00:00
8 changed files with 961 additions and 948 deletions

View File

@ -2519,39 +2519,39 @@ img, video {
/* Monospaced Typefaces (for code) */
/* From http://cssfontstack.com */
code, .code {
font-family: Consolas, monaco, monospace; }
font-family: Consolas, monaco, monospace; }
.courier {
font-family: 'Courier Next', courier, monospace; }
font-family: 'Courier Next', courier, monospace; }
/* Sans-Serif Typefaces */
.helvetica {
font-family: 'helvetica neue', helvetica, sans-serif; }
font-family: 'helvetica neue', helvetica, sans-serif; }
.avenir {
font-family: 'avenir next', avenir, sans-serif; }
font-family: 'avenir next', avenir, sans-serif; }
/* Serif Typefaces */
.athelas {
font-family: athelas, georgia, serif; }
font-family: athelas, georgia, serif; }
.georgia {
font-family: georgia, serif; }
font-family: georgia, serif; }
.times {
font-family: times, serif; }
font-family: times, serif; }
.bodoni {
font-family: "Bodoni MT", serif; }
font-family: "Bodoni MT", serif; }
.calisto {
font-family: "Calisto MT", serif; }
font-family: "Calisto MT", serif; }
.garamond {
font-family: garamond, serif; }
font-family: garamond, serif; }
.baskerville {
font-family: baskerville, serif; }
font-family: baskerville, serif; }
/*
@ -8390,10 +8390,10 @@ input[type=button],
input[type=submit] {
color: black;
color: var(--form-button-color);
background-color: #fff;
background-color: var(--form-button-background);
border-color: #ccc;
border-color: var(--form-button-border-color);
background-color: #666;
background-color: var(--theme-color);
border-color: #666;
border-color: var(--theme-color);
border-width: 1px;
border-style: solid;
display: inline-block;
@ -8408,8 +8408,10 @@ input[type=submit] {
input[type=submit]:hover {
color: #4c9ed9;
color: var(--form-button-color-active);
background-color: #f2f2f2;
background-color: var(--form-button-background-active); }
background-color: #aaa;
background-color: var(--theme-color-dim);
border-color: #aaa;
border-color: var(--theme-color-dim); }
button.lite,
.button.lite,
@ -8512,8 +8514,8 @@ input[type=submit] {
.avatar-icon {
width: 40px;
height: 40px;
object-fit: cover;
flex-shrink: 0;
object-fit: cover;
border-radius: 100%;
overflow: hidden;
background-color: #bbb;

View File

@ -270,7 +270,7 @@ pre, code, .codeblock {
--landing-search-background-hover: #181818;
--editor-toolbar-background: #282828;
--editor-toolbar-border-color: #333;
--editor-toolbar-button-background: 282828;
--editor-toolbar-button-background: #282828;
--editor-toolbar-button-background-hover: #333;
--editor-toolbar-button-border-color: #333;
--post-blockquote-border-color: #555;

View File

@ -143,8 +143,8 @@ input, select, textarea {
@extend .pv2;
@include usevar('color', 'form-button-color');
@include usevar('background-color', 'form-button-background');
@include usevar('border-color', 'form-button-border-color');
@include usevar('background-color', 'theme-color');
@include usevar('border-color', 'theme-color');
border-width: 1px;
border-style: solid;
@ -156,7 +156,8 @@ input, select, textarea {
&:hover {
@include usevar('color', 'form-button-color-active');
@include usevar('background-color', 'form-button-background-active');
@include usevar('background-color', 'theme-color-dim');
@include usevar('border-color', 'theme-color-dim');
}
&.lite {

View File

@ -54,6 +54,7 @@
width: 40px;
height: 40px;
flex-shrink: 0;
object-fit: cover;
border-radius: 100%;
overflow: hidden;
@include usevar(background-color, dimmest-color);

View File

@ -77,7 +77,7 @@ $vars: (
editor-toolbar-background: #282828,
editor-toolbar-border-color: #333,
editor-toolbar-button-background: 282828,
editor-toolbar-button-background: #282828,
editor-toolbar-button-background-hover: #333,
editor-toolbar-button-border-color: #333,

View File

@ -38,11 +38,20 @@ header .content-title .subtitle {
border-top-color: var(--theme-dim);
}
a, .thread:before, button, .button, input[type=button], input[type=submit] {
a, .thread:before, button, .button, input[type=button] {
color: {{ $linkColor }};
color: var(--link-color);
}
a:hover, button:hover, .button:hover, input[type=button]:hover, input[type=submit]:hover {
.submit, input[type=submit] {
color: white;
}
a.submit:hover, .submit:hover, input[type=submit]:hover {
color: white;
}
a:hover, button:hover, .button:hover, input[type=button]:hover {
color: {{ $linkHoverColor }};
color: var(--link-hover-color);
}

View File

@ -128,7 +128,7 @@
{{ if .Editing }}
<input type="submit" value="Save" />
{{ else }}
<a class="button" href="javascript:;" onclick="gotoTab('description');">Next</a>
<a class="button submit" href="javascript:;" onclick="gotoTab('description');">Next</a>
{{ end }}
</div>
</div>
@ -183,7 +183,7 @@
{{ if .Editing }}
<input type="submit" value="Save" />
{{ else }}
<a class="button" href="javascript:;" onclick="gotoTab('assets');">Next</a>
<a class="button submit" href="javascript:;" onclick="gotoTab('assets');">Next</a>
{{ end }}
</div>
</div>

View File

@ -136,7 +136,7 @@
{{ end }}
{{ if .OwnProfile }}
{{ if .CanAddProject }}
<a href="{{ .NewProjectUrl }}" class="button pv2 ph3">Add New Project</a>
<a href="{{ .NewProjectUrl }}" class="button submit pv2 ph3">Add New Project</a>
{{ else }}
<span class="c--dim i">You have reached the maximum number of personal projects.</span>
{{ end }}