updated hooks error and flash message styles
This commit is contained in:
parent
5a4f6e7c21
commit
67b15de301
|
@ -185,16 +185,15 @@ p.profile-user-last
|
||||||
+linkStyle
|
+linkStyle
|
||||||
|
|
||||||
.hooks-error
|
.hooks-error
|
||||||
width: 100%;
|
width: 100%
|
||||||
padding: 0 $column-gutter/2;
|
margin-top: 1.3rem
|
||||||
margin-top: 3.3rem;
|
|
||||||
p
|
p
|
||||||
position: relative
|
position: relative
|
||||||
padding: $column-gutter/2 $column-gutter*2 $column-gutter/2 $column-gutter/2;
|
padding: .7em 1.5em .7em 0.5em
|
||||||
color: #de4248
|
color: $brick-red
|
||||||
background-color: #f1b6ad
|
background-color: $quartz-red
|
||||||
a
|
a
|
||||||
color: #de4248
|
color: $brick-red
|
||||||
text-decoration: underline
|
text-decoration: underline
|
||||||
&:after
|
&:after
|
||||||
content: ""
|
content: ""
|
||||||
|
@ -203,14 +202,14 @@ p.profile-user-last
|
||||||
left: 1.5em
|
left: 1.5em
|
||||||
width: 1.2em
|
width: 1.2em
|
||||||
height: 1.2em
|
height: 1.2em
|
||||||
background: #f1b6ad
|
background: $quartz-red
|
||||||
transform: rotate(45deg)
|
transform: rotate(45deg)
|
||||||
.close
|
.close
|
||||||
@extend .icon
|
@extend .icon
|
||||||
|
@extend %icon-line-cross-red
|
||||||
position: absolute
|
position: absolute
|
||||||
top: 1em
|
top: 1em
|
||||||
right: 1em
|
right: 1em
|
||||||
@extend .icon--dismiss-red
|
|
||||||
|
|
||||||
.profile-token-toggle
|
.profile-token-toggle
|
||||||
.icon-eye
|
.icon-eye
|
||||||
|
|
|
@ -1,6 +1,5 @@
|
||||||
.flash
|
.flash
|
||||||
@include resetul
|
@include resetul
|
||||||
font-size: 18px
|
|
||||||
text-align: center
|
text-align: center
|
||||||
height: 0
|
height: 0
|
||||||
li
|
li
|
||||||
|
@ -12,8 +11,6 @@
|
||||||
height: 0
|
height: 0
|
||||||
animation: comeIn 7s 1 ease
|
animation: comeIn 7s 1 ease
|
||||||
z-index: 90
|
z-index: 90
|
||||||
li.broadcast
|
|
||||||
height: auto
|
|
||||||
|
|
||||||
.close
|
.close
|
||||||
@extend .icon
|
@extend .icon
|
||||||
|
@ -27,21 +24,18 @@
|
||||||
padding: .4em 0
|
padding: .4em 0
|
||||||
margin: 0
|
margin: 0
|
||||||
|
|
||||||
li.broadcast p
|
|
||||||
padding: .7em 5em
|
|
||||||
|
|
||||||
.success,
|
.success,
|
||||||
.notice
|
.notice
|
||||||
color: $turf-green
|
color: $turf-green
|
||||||
background-color: $seed-green
|
background-color: $seed-green
|
||||||
.close
|
.close
|
||||||
@extend .icon--dismiss-green
|
@extend .icon-line-cross-green
|
||||||
|
|
||||||
.error
|
.error
|
||||||
color: $brick-red
|
color: $brick-red
|
||||||
background-color: $quartz-red
|
background-color: $quartz-red
|
||||||
.close
|
.close
|
||||||
@extend .icon--dismiss-red
|
@extend .icon-line-cross-red
|
||||||
|
|
||||||
@keyframes comeIn
|
@keyframes comeIn
|
||||||
0%
|
0%
|
||||||
|
|
|
@ -29,16 +29,6 @@
|
||||||
.icon--search
|
.icon--search
|
||||||
background-image: inline-image('stroke-icons/icon-search.svg')
|
background-image: inline-image('stroke-icons/icon-search.svg')
|
||||||
|
|
||||||
.icon--dismiss-yellow
|
|
||||||
background-image: inline-image('ui/icon-warning-dismiss.svg')
|
|
||||||
.icon--dismiss-green
|
|
||||||
background-image: inline-image('ui/icon-success-dismiss.svg')
|
|
||||||
.icon--dismiss-red
|
|
||||||
background-image: inline-image('ui/icon-error-dismiss.svg')
|
|
||||||
|
|
||||||
.icon--dismiss-grey
|
|
||||||
background-image: inline-image('ui/dismiss.svg')
|
|
||||||
|
|
||||||
%icon-line-trashcan
|
%icon-line-trashcan
|
||||||
background-image: inline-image('stroke-icons/icon-trash.svg')
|
background-image: inline-image('stroke-icons/icon-trash.svg')
|
||||||
%icon-line-trashcan-red
|
%icon-line-trashcan-red
|
||||||
|
@ -178,6 +168,12 @@
|
||||||
background-image: inline-image('stroke-icons/icon-failed-white.svg')
|
background-image: inline-image('stroke-icons/icon-failed-white.svg')
|
||||||
%icon-line-cross-teal
|
%icon-line-cross-teal
|
||||||
background-image: inline-image('stroke-icons/icon-failed-teal.svg')
|
background-image: inline-image('stroke-icons/icon-failed-teal.svg')
|
||||||
|
%icon-line-cross-red
|
||||||
|
background-image: inline-image('stroke-icons/icon-failed-red.svg')
|
||||||
|
%icon-line-cross-green
|
||||||
|
background-image: inline-image('stroke-icons/icon-failed-green.svg')
|
||||||
|
%icon-line-cross-yellow
|
||||||
|
background-image: inline-image('stroke-icons/icon-failed-yellow.svg')
|
||||||
|
|
||||||
.icon-deactivate
|
.icon-deactivate
|
||||||
@extend .icon
|
@extend .icon
|
||||||
|
|
12
public/images/stroke-icons/icon-failed-green.svg
Executable file
12
public/images/stroke-icons/icon-failed-green.svg
Executable file
|
@ -0,0 +1,12 @@
|
||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 19.2.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<svg version="1.1" id="icon-failed" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
|
||||||
|
y="0px" viewBox="0 0 15 15" style="enable-background:new 0 0 15 15;" xml:space="preserve">
|
||||||
|
<style type="text/css">
|
||||||
|
.st0{fill:none;stroke:#39aa56;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
|
||||||
|
</style>
|
||||||
|
<g id="failed">
|
||||||
|
<line class="st0" x1="0.5" y1="0.5" x2="14.5" y2="14.5"/>
|
||||||
|
<line class="st0" x1="14.5" y1="0.5" x2="0.5" y2="14.5"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
After Width: | Height: | Size: 625 B |
12
public/images/stroke-icons/icon-failed-red.svg
Executable file
12
public/images/stroke-icons/icon-failed-red.svg
Executable file
|
@ -0,0 +1,12 @@
|
||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 19.2.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<svg version="1.1" id="icon-failed" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
|
||||||
|
y="0px" viewBox="0 0 15 15" style="enable-background:new 0 0 15 15;" xml:space="preserve">
|
||||||
|
<style type="text/css">
|
||||||
|
.st0{fill:none;stroke:#db4545;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
|
||||||
|
</style>
|
||||||
|
<g id="failed">
|
||||||
|
<line class="st0" x1="0.5" y1="0.5" x2="14.5" y2="14.5"/>
|
||||||
|
<line class="st0" x1="14.5" y1="0.5" x2="0.5" y2="14.5"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
After Width: | Height: | Size: 625 B |
12
public/images/stroke-icons/icon-failed-yellow.svg
Executable file
12
public/images/stroke-icons/icon-failed-yellow.svg
Executable file
|
@ -0,0 +1,12 @@
|
||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 19.2.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<svg version="1.1" id="icon-failed" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
|
||||||
|
y="0px" viewBox="0 0 15 15" style="enable-background:new 0 0 15 15;" xml:space="preserve">
|
||||||
|
<style type="text/css">
|
||||||
|
.st0{fill:none;stroke:cdb62c;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
|
||||||
|
</style>
|
||||||
|
<g id="failed">
|
||||||
|
<line class="st0" x1="0.5" y1="0.5" x2="14.5" y2="14.5"/>
|
||||||
|
<line class="st0" x1="14.5" y1="0.5" x2="0.5" y2="14.5"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
After Width: | Height: | Size: 624 B |
Loading…
Reference in New Issue
Block a user