我的博客 scss (Thinkinside)

Posted 2020-06-29

  1 $header-bg-color:#0678be;
  2 $link-color:#0678be;
  3 $link-hover-color:black;
  4 
  5 #mainContent .forFlow{margin-left:0px;float:none;clear:both;width:auto;}
  6 #mainContent{width:73%;float:left;margin-left:1%;}
  7 body {
  8     background-attachment:fixed;
  9     background-repeat:repeat;
 10     padding-bottom: 40px;
 11     padding-top: 60px;
 12     min-height: 101%;
 13     background-color: #fff;
 14     color: #404040;
 15         font-family: ‘Noto Sans‘, Helvetica, ‘Microsoft Yahei‘, 微软雅黑, sans-serif;
 16     font-size: 16px;
 17     font-weight: normal;
 18     line-height: 1.8;
 19     margin: 0;
 20 
 21 }
 22 a{
 23 color: $link-color;
 24     text-decoration: none;
 25 -webkit-transition: 0.25s;
 26     -moz-transition: 0.25s;
 27     -o-transition: 0.25s;
 28     transition: 0.25s;
 29     -webkit-backface-visibility: hidden;
 30 }
 31 *{
 32 -webkit-transition: 0.25s;
 33     -moz-transition: 0.25s;
 34     -o-transition: 0.25s;
 35     transition: 0.25s;
 36 }
 37 #sideBarMain ul{margin-left:0px;}
 38 #sideBarMain ul a{
 39      color: #444;
 40     zoom: 1;
 41     filter: alpha(opacity=50);
 42     -webkit-opacity: .5;
 43     -moz-opacity: .5;
 44     opacity: .5;
 45     word-break: break-all;
 46 }
 47 input{outline:0px;}
 48 #header {    
 49     overflow: visible;
 50     background: $header-bg-color;
 51     filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
 52     clear: both;
 53     font-size:16px;
 54     content: "";
 55     margin: 0px;
 56     border-width: 0 0 1px;
 57     padding-right:2.5%;
 58 }
 59 .blogStats{margin:0px;padding:15px 0px 0px 0px;color:#FFF;}
 60 #blogTitle h1{
 61 padding:15px 15px 17px 0px;
 62 font-weight:400;
 63 }
 64 #navList li{    line-height: 20px;font-weight: 300;}
 65 #navList li a{
 66     text-decoration: none;
 67     color:#FFF;
 68     font-weight:400;
 69     padding: 15px 15px 17px;
 70     margin-top: 0px;
 71     border-radius: 5px;
 72     -moz-border-radius: 5px;
 73 }
 74 #navList a:link, #navList a:visited, #navList a:active{
 75    color:#FFF;
 76     
 77 }
 78 #navList a:hover{
 79  color:#bce3fa;
 80 }
 81 #home,#main{min-width:120px;}
 82 #main{
 83        
 84     text-align: left;
 85      padding-left: 0px;
 86       padding-right: 10px;
 87        background-color:#fff;
 88 }
 89 #sideBar{
 90    width:20%;
 91    background:none;
 92    border:none;
 93    border-radius:0px;
 94    box-shadow:none;
 95    float: right;
 96     margin-right: 1%;
 97 }
 98 .input_my_zzk{width:auto;}
 99 input.btn_my_zzk{
100     height:auto;
101     border: none;
102     padding: 5px 5px;
103     cursor: pointer;
104     border-radius: 5px;
105     cursor:pointer;
106 
107 }
108 input.btn_my_zzk:hover{
109 color:#FFF;
110 }
111 .input_my_zzk{
112     background-color: #fff;
113     border: 1px solid #ccc;
114     -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
115     -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
116     box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
117     -webkit-transition: border linear .2s,box-shadow linear .2s;
118     -moz-transition: border linear .2s,box-shadow linear .2s;
119     -o-transition: border linear .2s,box-shadow linear .2s;
120     transition: border linear .2s,box-shadow linear .2s;
121        display: inline-block;
122     height: 20px;
123     padding: 5px;
124     margin-bottom: 0px;
125     font-size: 14px;
126     line-height: 20px;
127     color: #555;
128     vertical-align: middle;
129     -webkit-border-radius: 4px;
130     -moz-border-radius: 4px;
131     border-radius: 4px;
132 }
133 .input_my_zzk:focus{
134 border-color: rgba(82,168,236,0.8);
135     outline: 0;
136     outline: thin dotted \9;
137     -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.6);
138     -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.6);
139     box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.6);
140 }
141 
142 .post{
143  background:transparent;
144 }
145 
146 .postCon{    line-height: 1.9;
147     font-family: Helvetica, ‘Microsoft Yahei‘, 微软雅黑, sans-serif;}
148 .c_b_p_desc_readmore{display:block;float:right;position: relative;}
149 .dayTitle{display:none;}
150 .postDesc{text-align:left;zoom: 1;
151     filter: alpha(opacity=50);
152     -webkit-opacity: .5;
153     -moz-opacity: .5;
154     opacity: .5;
155     margin-top: 24px;
156     font-size: 14px;
157     font-size: .875rem;clear: both;
158     float: none;border-bottom: 1px dashed $header-bg-color;}
159 .postTitle{
160     font-size: 1.2em;
161     line-height: 1.4;
162     text-transform: capitalize;
163     font-weight: normal;
164     word-break: break-word;
165     margin: 0px 0px 24px;
166     padding: 0px;
167 }
168 .pager{    text-align: center;
169     margin: 15px 0px;}
170 #nav_next_page a,.pager a{    display: inline-block;
171     padding: 6px 12px;
172     background: #5bc0de;
173     text-align: center;
174     color: #FFF;border-color: #46b8da;margin-top: 5px;
175     margin-bottom: 5px;}
176     #nav_next_page a:hover,.pager a:hover{
177     color: #fff;
178     background-color: #269abc;
179     border-color: #1b6d85;}
180     
181 @media screen and (min-width: 960px) {
182      #main{width:960px;margin:0px auto;padding: 0px;}
183      #navigator{width:960px;margin:0 auto;}
184 }
185 
186 @media screen and (max-width:960px){
187    #sideBar{display:none;}
188    #mainContent .forFlow{margin-left:0px;}
189    #main{margin:0px;padding:15px;}
190    #blogTitle{display:none;}
191    #navList li a{padding:15px 12px;}
192    .blogStats{display:none;}
193 }